Getting error when using Local API and Next's App directory structure

I'm refactoring to Next's new

directory, and I get the following error when attempting to fetch a page collection using the

.

I'm using the

template.

error ./node_modules/@swc/core-darwin-arm64/swc.darwin-arm64.node
Module parse failed: Unexpected character '�' (1:0)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
(Source code omitted for this binary file)

Import trace for requested module:
./node_modules/@swc/core-darwin-arm64/swc.darwin-arm64.node
./node_modules/@swc/core/binding.js
./node_modules/@swc/core/index.js
./node_modules/swc-loader/src/index.js
./node_modules/payload/dist/webpack/getBaseConfig.js
./node_modules/payload/dist/webpack/getDevConfig.js
./node_modules/payload/dist/webpack/init.js
./node_modules/payload/dist/express/admin.js
./node_modules/payload/dist/initHTTP.js
./node_modules/payload/dist/index.js
./app/home/page.tsx

Here's what the page looks like in

:

import payload from 'payload'

async function getPage({ slug }: { slug: string }) {
  const pageQuery = await payload.find({
    collection: 'pages',
    where: {
      slug: {
        equals: slug
      }
    }
  })

  const page = pageQuery.docs[0]

  return page
}

export default async function Page() {
  const pageData = getPage({ slug: 'home' })

  const [page] = await Promise.all([pageData])

  console.log({ page })

  return <main>Home</main>
}

New to the

directory, maybe I'm missing something? Page works fine, but calling

seems to break it.

UPDATE: This fixes it.