payloadcms / next-payload Goto Github PK

View Code? Open in Web Editor NEW

306.0 306.0 45.0 828 KB

A utility to deploy Payload serverlessly within a Next.js app

JavaScript 24.04% TypeScript 74.05% Shell 1.90%

next-payload's People

Contributors

Stargazers

Watchers

Forkers

hyra10 quentin-binder isabella232 n86ies ali2kan leonardstruck kariyngva peiris dotellie jannikzed brandonmager dearlygroup alamit avinagites bornfromcode garrettjohnlaw okeken saurav-xcdify rooleary scotteadams rpfaeffle mr56k x-oss-byte anhgeeky gahalor barryandjamie seripap jarrodmflesch nilportugues shmookoff ccapndave ahamidian hoanghailethe meme8383 mogery listrexjs anoubluvz toonchavez8 dumindad triginarsa riskysaptra johntday royyangs emircyn

next-payload's Issues

Server only modules are being accessed in client buncle when using Cloud Storage plugin for S3

I'm trying to use the cloud storage plugin. Unfortunately I can't because when I try to use the admin panel I get this:
Module not found: Can't resolve 'fs'

It's trying to load the cloudStorage plugin's dependencies. Especially 'fs'. I read https://payloadcms.com/docs/admin/webpack for webpack. But I'm using Next.js, the integration should be flawless I guess. How to fix this?

Also I'm using Zod to parse the .env variables for some config values for the plugin and also for generating types. Since the config is ran on both the server and the client Zod is erroring out because it can't read the env vars. I had to import dotenv to make the generation of types' script work, but can't do anything when it's trying to load the code in the admin panel.

Payload Routes Breaks on Nextjs

For example a user triggers, forgot and got a typical link like below,

http://localhost:3000/dashboard/reset/d85b566d3bb185001968d9df27ea767d7d70ead5

On navigating to the frontend, nextjs returns a 404 page, what's the best way to make sure nextjs is aware of this route?

hasMany relationship field fails with more than 22 items

A collection with a field with type: "relationship" and hasMany: true will fail if I add more than 22 items to it. The error I got is

[09:09:45] ERROR (payload): CastError: Cast to ObjectId failed for value "{
  '0': '64673cbe7b43c50c05008b9b',
  '1': '64673cbe7b43c50c05008ba5',
  '2': '64673cbc7b43c50c05008b73',
  '3': '64673cbd7b43c50c05008b91',
  '4': '64673cbc7b43c50c05008b7d',
  '5': '64673cbb7b43c50c05008b69',
  '6': '64673cb97b43c50c05008b55',
  '7': '64673cb27b43c50c05008b48',
  '8': '64673cba7b43c50c05008b5f',
  '9': '64673cbd7b43c50c05008b87',
  '10': '64673cbe7b43c50c05008baf',
  '11': '64673cbf7b43c50c05008bb9',
  '12': '64673cbf7b43c50c05008bc3',
  '13': '64673cbf7b43c50c05008bcd',
  '14': '64673cc07b43c50c05008bd7',
  '15': '64673cc07b43c50c05008be1',
  '16': '64673cc17b43c50c05008beb',
  '17': '64673cc17b43c50c05008bf5',
  '18': '64673cc27b43c50c05008bff',
  '19': '64673cc27b43c50c05008c09',
  '20': '64673cc27b43c50c05008c13',
  '21': '64673cc37b43c50c05008c1d'
}" (type Object) at path "_id" for model "examples"
    at model.Query.exec (webpack-internal:///(api)/./node_modules/mongoose/lib/query.js:4155:23)
    at Function.paginate (/Users/wilsonle/tmp/my-app/node_modules/mongoose-paginate-v2/dist/index.js:158:51)
    at find (webpack-internal:///(api)/./node_modules/payload/dist/collections/operations/find.js:106:30)
    at runMicrotasks (<anonymous>)
    at processTicksAndRejections (node:internal/process/task_queues:96:5)
    at async handler (webpack-internal:///(api)/./node_modules/@payloadcms/next-payload/dist/handlers/[collection]/index.js:37:36)

Here's a reproducible repo: https://github.com/WilsonLe/payload-next-bug-repro

I noticed that error only occur in payload attached to a nextjs project. A standalone payload project does not have this error.

Any reasons why this might be the case?

No Typescrip types in the middleware folder

No types in @payloadcms/next-payload/middleware. This causes a problem with typescript when importing them.

Not working with extra Payload plugins?

Hi!

We're building a new website in Next.js and Payload and are testing this awesome looking plugin. We've followed the readme docs and have it fully working now, but we're running into issues when we add a Payload plugin like the SEO or Formbuilder plugin.

The error we got is:

You're importing a component that needs unstable_batchedUpdates. It only works in a Client Component but none of its parents are marked with "use client", so they're Server Components by default.

Which, if i understand it correctly, means we have to make the whole Next.js app client side?

Are we doing something wrong?

0.0.26 fails to build

I followed all the instructions and when I run yarn build to build the NextJS project with Payload, this is the error I got.

- error ./node_modules/payload/dist/admin/scss/app.scss.webpack[javascript/auto]!=!./node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[2].oneOf[13].use[2]!./node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[2].oneOf[13].use[3]!./node_modules/next/dist/build/webpack/loaders/resolve-url-loader/index.js??ruleSet[1].rules[2].oneOf[13].use[4]!./node_modules/next/dist/compiled/sass-loader/cjs.js??ruleSet[1].rules[2].oneOf[13].use[5]!./node_modules/payload/dist/admin/scss/app.scss
SassError: Can't find stylesheet to import.
    ╷
180 │ @import '~payload-user-css';
    │         ^^^^^^^^^^^^^^^^^^^
    ╵
  node_modules/payload/dist/admin/scss/app.scss 180:9  root stylesheet
 
Import trace for requested module:
./node_modules/payload/dist/admin/scss/app.scss.webpack[javascript/auto]!=!./node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[2].oneOf[13].use[2]!./node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[2].oneOf[13].use[3]!./node_modules/next/dist/build/webpack/loaders/resolve-url-loader/index.js??ruleSet[1].rules[2].oneOf[13].use[4]!./node_modules/next/dist/compiled/sass-loader/cjs.js??ruleSet[1].rules[2].oneOf[13].use[5]!./node_modules/payload/dist/admin/scss/app.scss
./node_modules/payload/dist/admin/scss/app.scss
./node_modules/payload/dist/admin/Root.js
./app/(payload)/admin/page.tsx
- error ./node_modules/payload/dist/admin/scss/app.scss.webpack[javascript/auto]!=!./node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[2].oneOf[13].use[2]!./node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[2].oneOf[13].use[3]!./node_modules/next/dist/build/webpack/loaders/resolve-url-loader/index.js??ruleSet[1].rules[2].oneOf[13].use[4]!./node_modules/next/dist/compiled/sass-loader/cjs.js??ruleSet[1].rules[2].oneOf[13].use[5]!./node_modules/payload/dist/admin/scss/app.scss
SassError: Can't find stylesheet to import.
    ╷
180 │ @import '~payload-user-css';
    │         ^^^^^^^^^^^^^^^^^^^
    ╵
  node_modules/payload/dist/admin/scss/app.scss 180:9  root stylesheet
 
Import trace for requested module:
./node_modules/payload/dist/admin/scss/app.scss.webpack[javascript/auto]!=!./node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[2].oneOf[13].use[2]!./node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[2].oneOf[13].use[3]!./node_modules/next/dist/build/webpack/loaders/resolve-url-loader/index.js??ruleSet[1].rules[2].oneOf[13].use[4]!./node_modules/next/dist/compiled/sass-loader/cjs.js??ruleSet[1].rules[2].oneOf[13].use[5]!./node_modules/payload/dist/admin/scss/app.scss
./node_modules/payload/dist/admin/scss/app.scss
./node_modules/payload/dist/admin/Root.js
./app/(payload)/admin/page.tsx

Also in ./my-app/app/(payload)/admin/page.tsx, I got the following problem:

Cannot find module 'payload/dist/admin/Root' or its corresponding type declarations.ts(2307)

It looks like the error is coming from payload itself, but creating a standalone payload project seems to work fine.

Tailwind CSS import in root layout causes payload UI styling to break

When importing the Tailwind CSS framework in the root layout (app folder) of the Next.js application, the payload UI styling is broken. This issue seems to be caused by conflicts between the existing styles in the application and the styles applied by Tailwind CSS. When the import is removed, the payload UI styling returns to its expected appearance.

NextJS App Stuck on "Loading" overlay during first register.

I've created a new NextJS project, using the NextJS App Dir and Next-Payload.

When I navigate to /admin for the first time, the page renders, but then a loading overlay appears and never resolves. I see the following error in my browser console:
Uncaught (in promise) SyntaxError: Unexpected token '<', "<!DOCTYPE "... is not valid JSON

I've attached a reproducible example
here: repro.zip

Outdated Packages

I don't know where to ask this as is it not really an issue, there is deprecated package (with some security topics), i found out the problem coming from sass (which is multiple major versions behind), could we do something about this ?

Can the local API use the user token for access control?

Hi,

is there a way of using the local API with overrideAccess: false, and setup the user via the payload-token?

I don't seem to find on the docs the proper way of requesting content only the user can see via the local API.

I'm looking for something like this:

import {notFound} from "next/navigation";
import {getPayloadClient} from "@/content/payloadClient";
import {Post} from "@/content/types";
import RichText from "@/components/RichText";
import { cookies } from 'next/headers'

interface PostPageProps {
	params: {
		slug: string
	}
}

export default async function PostPage({params}: PostPageProps) {
	const post = await getPostBySlug(params.slug)
	if (!post) return notFound();
	return <div>
		<h1>{post.title}</h1>
		<RichText content={post.content}/>
	</div>
};

async function getPostBySlug(slug: string): Promise<Post> {
	const payload = await getPayloadClient();
	const cookieStore = cookies()
	const posts = await payload.find({
		collection: "posts",
		overrideAccess: false,
		user: {
			token: cookieStore.get("payload-token").value
		},
		where: {
			slug: {
				equals: slug,
			},
		},
	});
	return posts.docs[0];
}

I've successfully used payload.login to get a user document that can be used for this kind of user control, but this is not something I can do because this is the server-generated page and the cookie token of an already logged-in user should be used to set up access control in the local API.

Is that possible?

getPayloadClient crashing NextJS frontend

When using getPayloadClient as described in your readme the Next.js hot reload crashes the app:

Unhandled Runtime Error
Error: Cannot overwrite `_preferences` model once compiled.

API Reset Password Got Type Error

Following the standard setup procedure and using the RestAPI documentation (https://payloadcms.com/docs/rest-api/overview#auth-operations) on reset user password after receiving a reset token yields the following error:

The request:

[16:50:41] ERROR (payload): TypeError: args.res.cookie is not a function
    at resetPassword (webpack-internal:///(api)/./node_modules/payload/dist/auth/operations/resetPassword.js:81:18)
    at processTicksAndRejections (node:internal/process/task_queues:96:5)
    at async handler (webpack-internal:///(api)/./node_modules/@payloadcms/next-payload/dist/handlers/[collection]/reset-password.js:26:24)

The specific line that cause this error:

// node_modules/payload/dist/auth/operations/resetPassword.js

if (args.res) {
    const cookieOptions = {
        path: '/',
        httpOnly: true,
        expires: (0, getCookieExpiration_1.default)(collectionConfig.auth.tokenExpiration),
        secure: collectionConfig.auth.cookies.secure,
        sameSite: collectionConfig.auth.cookies.sameSite,
        domain: undefined,
    };
    if (collectionConfig.auth.cookies.domain)
        cookieOptions.domain = collectionConfig.auth.cookies.domain;
    args.res.cookie(`${config.cookiePrefix}-token`, token, cookieOptions); // <----- error here
}

Since this error occur after payload updates user with new password, the intended functinality is achieved. The only problem is that now the API request will return status 500, which is not ideal.

getPayloadClient doesn't work

The Payload admin system works when when trying to use the Payload Client to query the database, it throws an error saying it is using a client-side package "use-context-selector". This means it cannot be used to query content and because of it's access to the database it cannot be used with "use client".

My code for this is here.

Nextjs build error on version 0.0.20

Im getting the following error:

Failed to compile.

./node_modules/@payloadcms/next-payload/dist/middleware/withPayload.js
Module not found: Can't resolve '@payloadcms/next-payload/getPayload'

https://nextjs.org/docs/messages/module-not-found

Import trace for requested module:
./node_modules/@payloadcms/next-payload/dist/handlers/graphql.js
./src/pages/api/graphql.ts


> Build failed because of webpack errors

Am I doing something wrong?

@import '~payload-user-css'; fail

./node_modules/payload/dist/admin/scss/app.scss.webpack[javascript/auto]!=!./node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[4].oneOf[13].use[2]!./node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[4].oneOf[13].use[3]!./node_modules/next/dist/build/webpack/loaders/resolve-url-loader/index.js??ruleSet[1].rules[4].oneOf[13].use[4]!./node_modules/next/dist/compiled/sass-loader/cjs.js??ruleSet[1].rules[4].oneOf[13].use[5]!./node_modules/payload/dist/admin/scss/app.scss SassError: Can't find stylesheet to import. ╷ 180 │ @import '~payload-user-css'; │ ^^^^^^^^^^^^^^^^^^^ ╵ node_modules/payload/dist/admin/scss/app.scss 180:9 root stylesheet

I get this error on install. Deleting line 180 fixes it.

Content in Globals disappearing after save

Describe the bug

After hitting "Save" button, Content is saved but disappears from browser. Refreshing the page loads the updated content.

To Reproduce

Cloned next-payload-demo
Changed .env leaving only S3 blank:

MONGODB_URI=mongodb://localhost/payload-vercel-functions
PAYLOAD_SECRET=YOUR_SECRET_HERE
PAYLOAD_CONFIG_PATH=dist/payload.config.js
NEXT_PUBLIC_APP_URL=http://localhost:3000
PAYLOAD_PUBLIC_CMS_URL=http://localhost:3000
S3_ACCESS_KEY_ID=
S3_SECRET_ACCESS_KEY=
S3_REGION=
NEXT_PUBLIC_S3_ENDPOINT=
NEXT_PUBLIC_S3_BUCKET=
PAYLOAD_PRIVATE_REGENERATION_SECRET=123123
NEXT_PRIVATE_REGENERATION_SECRET=123123

Run yarn dev
Make a change in Main Menu -> Nav Items

Expected behavior

Updated content should be still visible after save.

Screenshots/Video

Screen_Recording_2023-04-14_at_15.51.23.mp4

Additional context

Thread in community-help: https://discord.com/channels/967097582721572934/1096539580687200347

HMR doesn't work

E.g. adding or changing a field. I have to reload the browser to see the change, which is extremely slow (>10s).

FileUploadError when attempting to write to a local folder

When creating a media-collection that does not use cloud-storage, but instead local-storage (as we plan to host the project ourselves), imageResizer.js throws an error. I attempted debugging this and found out that instantiating sharp fails, even though the dependency itself and the file-data are available.
I am not 100% sure whether or not this is indeed a bug or instead a configuration error. Any pointers to what might cause this issue would be helpful.

Thrown error

TypeError: Cannot read properties of undefined (reading 'resize')
    at eval (webpack-internal:///(api)/./node_modules/payload/dist/uploads/imageResizer.js:66:33)
    at Array.map (<anonymous>)
    at resizeAndSave (webpack-internal:///(api)/./node_modules/payload/dist/uploads/imageResizer.js:53:31)
    at generateFileData (webpack-internal:///(api)/./node_modules/payload/dist/uploads/generateFileData.js:169:44)
    at async create (webpack-internal:///(api)/./node_modules/payload/dist/collections/operations/create.js:120:7)
    at async handler (webpack-internal:///(api)/./node_modules/@payloadcms/next-payload/dist/handlers/[collection]/index.js:112:23)

Media collection-definition

import path from "path";
import { CollectionConfig } from "payload/types";

const Media: CollectionConfig = {
  slug: "media",
  access: {
    read: () => true,
    create: () => true,
    update: () => true,
    delete: () => true,
  },
  admin: {
    useAsTitle: "filename",
    description: "Media files that are either images, video or audio.",
    group: "Content",
  },

  upload: {
    adminThumbnail: "thumbnail",
    staticDir: path.resolve(__dirname, "../../data/media"),
    mimeTypes: ["image/png", "image/jpeg"],
    imageSizes: [
      {
        name: "thumbnail",
        width: 480,
        height: 320,
      },
      {
        name: "portrait",
        width: 768,
        height: 1024,
      },
      {
        name: "hero",
        width: 1920,
        height: 1080,
      },
    ],
  },

  fields: [
    {
      name: "alt",
      label: "Alt Text",
      localized: true,
      type: "text",
      required: true,
    },
  ],
};

export default Media;

req.query.where is undefined

req.query.where is undefined in pages/api/[collection]/index.ts.

Stumbled upon this while trying to implement the bulk operation endpoints myself. It looks like the req.query object isn't deserialized properly:

{
  locale: 'en',
  depth: '0',
  draft: 'true',
  page: '1',
  'where[or][0][email][like]': 'testasdasd',
  limit: '10',
  invoke: '39c3af95-edda-4797-bae1-a4fcaf31102f',
  collection: 'users'
}

(req.query on a search request)

NextjS Typescript project fails to build on the 0.0.25 version of the package

Setting up a NextJS Typescript project fails to build using the 0.0.25 version of the package with the following errors:

Could not find a declaration file for module '@payloadcms/next-payload/dist/handlers/[collection]/refresh-token'
Could not find a declaration file for module '@payloadcms/next-payload/dist/handlers/[collection]/reset-password'
Could not find a declaration file for module '@payloadcms/next-payload/dist/handlers/[collection]/unlock'

SassError: Can't find stylesheet to import.

#12 54.47 SassError: Can't find stylesheet to import.
#12 54.47     ╷
#12 54.47 180 │ @import '~payload-user-css';
#12 54.47     │         ^^^^^^^^^^^^^^^^^^^
#12 54.47     ╵
#12 54.47   node_modules/payload/dist/admin/scss/app.scss 180:9  root stylesheet

Getting this error when adding next-payload into a clean NextJS installation. Commenting out that line inthe app.scss fixes it.

Using
"@payloadcms/next-payload": "^0.0.31",
"next": "^13.4.7",
payload": "^1.10.2",

Payload package included in main client bundle when using local api

When doing a production build of a site that uses nextjs app router and payload side by side, I have found that the full Payload package is added to the main shared client js bundle.

The only time payload is referenced in the app components is when using the local api to fetch data in server components, so I would have thought this would not have to be in the js delivered to the client.

My app dir setup is:

And the bundles for the /app/(website)/[[...path]]/page routes looks like:

After speaking with others on the payload discord we found that any routes where the local api was not used then payload was not bundled, but anywhere where it was, it was. Is this expected?

The README doesn't mention the second argument (the path) to the withPayload() function in next.config.js

It doesn't work without specifying it.

Update to leverage Vercel KV?

Not quite MongoDB, but it would be great to demo utilizing Vercel's DB options so a local/remote Mongo instance is not required. https://vercel.com/storage/kv

Error when running admin in production

Currently pinning the Next version due to the breaking change in the latest version of Next, so I can't say if fixing that other issue will fix this too but when running in production, serverless in Vercel, the admin panel doesn't load due to several errors like this one

/var/task/node_modules/payload/dist/admin/components/forms/Label/index.scss:1
@import '../../../scss/styles.scss';
^

SyntaxError: Invalid or unexpected token
    at internalCompileFunction (node:internal/vm:73:18)
    at wrapSafe (node:internal/modules/cjs/loader:1176:20)
    at Module._compile (node:internal/modules/cjs/loader:1218:27)
    at Module._extensions..js (node:internal/modules/cjs/loader:1308:10)
    at Module.load (node:internal/modules/cjs/loader:1117:32)
    at Module._load (node:internal/modules/cjs/loader:958:12)
    at Module.require (node:internal/modules/cjs/loader:1141:19)
    at require (node:internal/modules/cjs/helpers:110:18)
    at Object.<anonymous> (/var/task/node_modules/payload/dist/admin/components/forms/Label/index.js:9:1)
    at Module._compile (node:internal/modules/cjs/loader:1254:14)
RequestId: 515966ff-be5b-41bc-8696-66dc7697a0b7 Error: Runtime exited with error: exit status 1
Runtime.ExitError

Combine all routes to 1 route handler

Some suggestions:

If I'm not mistaken, by wrapping all endpoints in separate routes, every route incurs a cold start. I would suggest to have one 1 route: pages/api/[...payload].ts that catches all requests.

Why still use the pages directory? It sounds like a route handler in the app directory would work too?

Memory leak on page reload

Dev mode:
During loading of admin panel multiple errors are listed in console. Server takes lots of memory.
After page refresh all errors are listed again and memory consumption keeps increasing

Build mode:
Fewer errors, but build builds successfully

Start mode:
Infinite loading screen. Another error is given in console instead: TypeError: Cannot convert undefined or null to object that points to somewhere in chunks.

All errors are similar, just module name differs

./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/utils.js
Module not found: Can't resolve 'mongodb-client-encryption' in 'path-to-current-project\node_modules\.pnpm\[email protected]\node_modules\mongodb\lib'

Import trace for requested module:
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/utils.js
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/collection.js
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/index.js
./node_modules/.pnpm/[email protected]/node_modules/mongoose/lib/index.js
./node_modules/.pnpm/[email protected]/node_modules/mongoose/index.js
./node_modules/.pnpm/[email protected][email protected][email protected][email protected]/node_modules/payload/dist/payload.js
./payload/payloadClient.ts
./node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@payloadcms/next-payload/dist/middleware/withPayload.js
./node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@payloadcms/next-payload/dist/handlers/[collection]/init.js

Can't resolve '@payloadcms/next-payload/getPayload'

@payloadcms/next-payload/middleware/withPayload.js imports @payloadcms/next-payload/getPayload which doesn't exist

`yarn next-payload install` doesn't check for `src` folder correctly

Following a recent update, src directory support was added, but it seems to enforce it.

Screen.Recording.2023-08-08.at.12.32.39.mov

GraphQL error

Trying to run this on a fresh install of nextjs to test, but I can't get past this error;

event - compiled successfully in 0 ms (2998 modules)
[19:56:41] INFO (payload): Connected to Mongo server successfully!
[19:56:41] INFO (payload): Starting Payload...
error - Error: Cannot use GraphQLScalarType "DateTime" from another module or realm.

Ensure that there is only one instance of "graphql" in the node_modules
directory. If different versions of "graphql" are the dependencies of other
relied on modules, use "resolutions" to ensure only one version is installed.

https://yarnpkg.com/en/docs/selective-version-resolutions

Duplicate "graphql" modules cannot be used at the same time since different
versions may have different capabilities and behavior. The data from one
version used in the function from another could produce confusing and
spurious results.
    at instanceOf (webpack-internal:///(api)/./node_modules/payload/node_modules/graphql/jsutils/instanceOf.js:26:19)
    at isScalarType (webpack-internal:///(api)/./node_modules/payload/node_modules/graphql/type/definition.js:76:39)
    at isType (webpack-internal:///(api)/./node_modules/payload/node_modules/graphql/type/definition.js:65:12)
    at isNullableType (webpack-internal:///(api)/./node_modules/payload/node_modules/graphql/type/definition.js:286:12)
    at new GraphQLNonNull (webpack-internal:///(api)/./node_modules/payload/node_modules/graphql/type/definition.js:258:9)
    at eval (webpack-internal:///(api)/./node_modules/payload/dist/collections/graphql/init.js:114:23)
    at Array.forEach (<anonymous>)
    at initCollectionsGraphQL (webpack-internal:///(api)/./node_modules/payload/dist/collections/graphql/init.js:73:38)
    at registerSchema (webpack-internal:///(api)/./node_modules/payload/dist/graphql/registerSchema.js:71:24)
    at BasePayload.init (webpack-internal:///(api)/./node_modules/payload/dist/payload.js:193:42)
    at process.processTicksAndRejections (node:internal/process/task_queues:95:5) {
  digest: undefined
}

test repo: https://github.com/seripap/nextjs-payload-test

$ npm install
$ docker-compose up
$ npm run dev

--> http://localhost:3000/admin

Large number of connections MongoDB Atlas

When deploying to vercel, payload creates a new connection to mongodb for every serverless function call. Therefore and due to the fact that those are not closed after the function has executed the number of connections with Atlas is pretty big.

For instance just when having opened an edit view payload reaches 100 connections and when building the actual website and making API calls to the graphql enpoint the number of connections easily exceeds 500.

useAPIKey doesn't work

When using auth: {useAPIKey} in the Users collecition, I can't log in. Payload says I don't have authorization.

Importing local Images return string instead of the nextJs image obj

I was trying this plugin out, I know it is not production ready, but I noticed that if you import an image hosted locally

the normal
import RandomName from 'path/to/Image.png'

it will return a string instead of the normal NextJs image obj
example of what it should return:

{
  src: '/_next/static/media/image.png',
  height: 1057,
  width: 2061,
  blurDataURL: '/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fimage1.0f59ede4.png&w=8&q=70',
  blurWidth: 8,
  blurHeight: 4
}

what it returns

'/_next/static/media/image.png',

TypeError: tag[primaryAttributeKey].toLowerCase is not a function

The error occurs with the standard setup of nextjs and next-payload.

This is what I have done:

yarn create next-app (yes to everything but tailwind)
follow this guide steps 1-3 (step 4 looks off in the guide but correct in code): https://github.com/payloadcms/next-payload
Opening http://localhost:3000/admin/login

I get this error:

Unhandled Runtime Error
TypeError: tag[primaryAttributeKey].toLowerCase is not a function

Call Stack
eval
node_modules\react-helmet\es\Helmet.js (253:0)
Array.filter
<anonymous>
eval
node_modules\react-helmet\es\Helmet.js (232:0)
Array.reduce
<anonymous>
getTagsFromPropsList
node_modules\react-helmet\es\Helmet.js (229:5)
reducePropsToState
node_modules\react-helmet\es\Helmet.js (305:0)
emitChange
node_modules\react-side-effect\lib\index.js (56:0)
SideEffect.UNSAFE_componentWillMount
node_modules\react-side-effect\lib\index.js (97:0)

What am I doing wrong here? 😄

I think also kind of missing is setting up the /css/my-custom-payload-styles.css either from the install script or mentioning that in the guide.

Btw. if this works, it is literally a dream come true for me, keep up the great work! 👍

Versioning not working in `next-payload`

A brand new installation following the documentation. simply added following collection config:

import { CollectionConfig } from "payload/types";
import formatSlug from "@/utilities/formatSlug";

export const Page: CollectionConfig = {
  slug: "pages",
  admin: {
    useAsTitle: "title",
  },
  versions: {
    drafts: true,
  },
  access: {
    read: (): boolean => true, // Everyone can read Pages
  },
  fields: [
    {
      name: "title",
      label: "Page Title",
      type: "text",
      required: true,
    },
    {
      name: "slug",
      label: "Page Slug",
      type: "text",
      admin: {
        position: "sidebar",
      },
      hooks: {
        beforeValidate: [formatSlug("title")],
      },
    },
  ],
};

export default Page;

// formatSlug.ts
import { FieldHook } from "payload/types";

const format = (val: string): string =>
  val
    .replace(/ /g, "-")
    .replace(/[^\w-/]+/g, "")
    .toLowerCase();

const formatSlug =
  (fallback: string): FieldHook =>
  ({ value, originalDoc, data }) => {
    if (typeof value === "string") {
      return format(value);
    }
    const fallbackData =
      (data && data[fallback]) || (originalDoc && originalDoc[fallback]);

    if (fallbackData && typeof fallbackData === "string") {
      return format(fallbackData);
    }

    return value;
  };

export default formatSlug;

Untitled.mp4

Do note that the _pages_versions collection is present and each version is saved correctly in DB.

It is not possible to unpublish neither.

Aliases broke with latest version 0.34

No biggy (I think) but the latest 0.34 release broke some path aliases in payload.config.ts

I had this previously:

import Users from '@/payload/collections/Users'

Which threw

Error: Cannot find module '@/payload/collections/Users'

and fixed by

import Users from './collections/Users'

tsconfig.json:

    "paths": {
      "@/*": ["./src/*"]
    }

No Email integration

Unlike the server version, the serverless Payload CMS does not allow for email integration through the Next JS API. This means no password recovery and unable to effectively use the FormBuilder plugin to handle forms.

Many `Module not found` errors while using @payloadcms/[email protected] with pnpm

I have created a new Next.js project with npx create-next-app@latest --experimental-app and then applied all the steps from https://github.com/payloadcms/next-payload/blob/main/README.md.

The only thing that I've done differently is that I used pnpm (@8.4.0) instead of npm/yarn.

I'm getting a lot of errors while attempting to visit the default /admin route:

next-payload-test on  main [!?] via  v18.13.0 on ☁️  (eu-central-1) took 1m55s 
❯ pnpm dev

> [email protected] dev /Volumes/dev/repos/next-payload-test
> next dev

ready - started server on 0.0.0.0:3000, url: http://localhost:3000
info  - Loaded env from /Volumes/dev/repos/next-payload-test/.env
warn  - You have enabled experimental features (appDir, outputFileTracingExcludes) in next.config.js.
warn  - Experimental features are not covered by semver, and may cause unexpected or broken application behavior. Use at your own risk.

info  - Thank you for testing `appDir` please leave your feedback at https://nextjs.link/app-feedback
event - compiled client and server successfully in 725 ms (269 modules)
wait  - compiling...
event - compiled client and server successfully in 179 ms (269 modules)
wait  - compiling /(payload)/admin/page (client and server)...
event - compiled client and server successfully in 3.4s (4641 modules)
wait  - compiling /favicon.ico/route (client and server)...
wait  - compiling /api/[collection]/init (client and server)...
wait  - compiling /api/[collection]/me (client and server)...
warn  - ./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/bson.js
Module not found: Can't resolve 'bson-ext' in '/Volumes/dev/repos/next-payload-test/node_modules/.pnpm/[email protected]/node_modules/mongodb/lib'

Import trace for requested module:
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/bson.js
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/index.js
./node_modules/.pnpm/[email protected]/node_modules/mongoose/lib/index.js
./node_modules/.pnpm/[email protected]/node_modules/mongoose/index.js
./node_modules/.pnpm/[email protected][email protected][email protected][email protected]/node_modules/payload/dist/payload.js
./payload/payloadClient.ts
./node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@payloadcms/next-payload/dist/middleware/withPayload.js
./node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@payloadcms/next-payload/dist/handlers/[collection]/me.js

./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/deps.js
Module not found: Can't resolve 'kerberos' in '/Volumes/dev/repos/next-payload-test/node_modules/.pnpm/[email protected]/node_modules/mongodb/lib'

Import trace for requested module:
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/deps.js
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/index.js
./node_modules/.pnpm/[email protected]/node_modules/mongoose/lib/index.js
./node_modules/.pnpm/[email protected]/node_modules/mongoose/index.js
./node_modules/.pnpm/[email protected][email protected][email protected][email protected]/node_modules/payload/dist/payload.js
./payload/payloadClient.ts
./node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@payloadcms/next-payload/dist/middleware/withPayload.js
./node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@payloadcms/next-payload/dist/handlers/[collection]/me.js

./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/deps.js
Module not found: Can't resolve '@mongodb-js/zstd' in '/Volumes/dev/repos/next-payload-test/node_modules/.pnpm/[email protected]/node_modules/mongodb/lib'

Import trace for requested module:
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/deps.js
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/index.js
./node_modules/.pnpm/[email protected]/node_modules/mongoose/lib/index.js
./node_modules/.pnpm/[email protected]/node_modules/mongoose/index.js
./node_modules/.pnpm/[email protected][email protected][email protected][email protected]/node_modules/payload/dist/payload.js
./payload/payloadClient.ts
./node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@payloadcms/next-payload/dist/middleware/withPayload.js
./node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@payloadcms/next-payload/dist/handlers/[collection]/me.js

./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/deps.js
Module not found: Can't resolve 'snappy' in '/Volumes/dev/repos/next-payload-test/node_modules/.pnpm/[email protected]/node_modules/mongodb/lib'

Import trace for requested module:
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/deps.js
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/index.js
./node_modules/.pnpm/[email protected]/node_modules/mongoose/lib/index.js
./node_modules/.pnpm/[email protected]/node_modules/mongoose/index.js
./node_modules/.pnpm/[email protected][email protected][email protected][email protected]/node_modules/payload/dist/payload.js
./payload/payloadClient.ts
./node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@payloadcms/next-payload/dist/middleware/withPayload.js
./node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@payloadcms/next-payload/dist/handlers/[collection]/me.js

./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/deps.js
Module not found: Can't resolve 'snappy/package.json' in '/Volumes/dev/repos/next-payload-test/node_modules/.pnpm/[email protected]/node_modules/mongodb/lib'

Import trace for requested module:
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/deps.js
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/index.js
./node_modules/.pnpm/[email protected]/node_modules/mongoose/lib/index.js
./node_modules/.pnpm/[email protected]/node_modules/mongoose/index.js
./node_modules/.pnpm/[email protected][email protected][email protected][email protected]/node_modules/payload/dist/payload.js
./payload/payloadClient.ts
./node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@payloadcms/next-payload/dist/middleware/withPayload.js
./node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@payloadcms/next-payload/dist/handlers/[collection]/me.js

./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/deps.js
Module not found: Can't resolve 'aws4' in '/Volumes/dev/repos/next-payload-test/node_modules/.pnpm/[email protected]/node_modules/mongodb/lib'

Import trace for requested module:
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/deps.js
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/index.js
./node_modules/.pnpm/[email protected]/node_modules/mongoose/lib/index.js
./node_modules/.pnpm/[email protected]/node_modules/mongoose/index.js
./node_modules/.pnpm/[email protected][email protected][email protected][email protected]/node_modules/payload/dist/payload.js
./payload/payloadClient.ts
./node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@payloadcms/next-payload/dist/middleware/withPayload.js
./node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@payloadcms/next-payload/dist/handlers/[collection]/me.js

./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/utils.js
Module not found: Can't resolve 'mongodb-client-encryption' in '/Volumes/dev/repos/next-payload-test/node_modules/.pnpm/[email protected]/node_modules/mongodb/lib'

Import trace for requested module:
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/utils.js
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/collection.js
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/index.js
./node_modules/.pnpm/[email protected]/node_modules/mongoose/lib/index.js
./node_modules/.pnpm/[email protected]/node_modules/mongoose/index.js
./node_modules/.pnpm/[email protected][email protected][email protected][email protected]/node_modules/payload/dist/payload.js
./payload/payloadClient.ts
./node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@payloadcms/next-payload/dist/middleware/withPayload.js
./node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@payloadcms/next-payload/dist/handlers/[collection]/me.js
[21:46:10] INFO (payload): Connected to Mongo server successfully!
[21:46:10] INFO (payload): Starting Payload...
warn  - ./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/bson.js
Module not found: Can't resolve 'bson-ext' in '/Volumes/dev/repos/next-payload-test/node_modules/.pnpm/[email protected]/node_modules/mongodb/lib'

Import trace for requested module:
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/bson.js
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/index.js
./node_modules/.pnpm/[email protected]/node_modules/mongoose/lib/index.js
./node_modules/.pnpm/[email protected]/node_modules/mongoose/index.js
./node_modules/.pnpm/[email protected][email protected][email protected][email protected]/node_modules/payload/dist/payload.js
./payload/payloadClient.ts
./node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@payloadcms/next-payload/dist/middleware/withPayload.js
./node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@payloadcms/next-payload/dist/handlers/[collection]/me.js

./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/deps.js
Module not found: Can't resolve 'kerberos' in '/Volumes/dev/repos/next-payload-test/node_modules/.pnpm/[email protected]/node_modules/mongodb/lib'

Import trace for requested module:
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/deps.js
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/index.js
./node_modules/.pnpm/[email protected]/node_modules/mongoose/lib/index.js
./node_modules/.pnpm/[email protected]/node_modules/mongoose/index.js
./node_modules/.pnpm/[email protected][email protected][email protected][email protected]/node_modules/payload/dist/payload.js
./payload/payloadClient.ts
./node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@payloadcms/next-payload/dist/middleware/withPayload.js
./node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@payloadcms/next-payload/dist/handlers/[collection]/me.js

./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/deps.js
Module not found: Can't resolve '@mongodb-js/zstd' in '/Volumes/dev/repos/next-payload-test/node_modules/.pnpm/[email protected]/node_modules/mongodb/lib'

Import trace for requested module:
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/deps.js
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/index.js
./node_modules/.pnpm/[email protected]/node_modules/mongoose/lib/index.js
./node_modules/.pnpm/[email protected]/node_modules/mongoose/index.js
./node_modules/.pnpm/[email protected][email protected][email protected][email protected]/node_modules/payload/dist/payload.js
./payload/payloadClient.ts
./node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@payloadcms/next-payload/dist/middleware/withPayload.js
./node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@payloadcms/next-payload/dist/handlers/[collection]/me.js

./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/deps.js
Module not found: Can't resolve 'snappy' in '/Volumes/dev/repos/next-payload-test/node_modules/.pnpm/[email protected]/node_modules/mongodb/lib'

Import trace for requested module:
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/deps.js
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/index.js
./node_modules/.pnpm/[email protected]/node_modules/mongoose/lib/index.js
./node_modules/.pnpm/[email protected]/node_modules/mongoose/index.js
./node_modules/.pnpm/[email protected][email protected][email protected][email protected]/node_modules/payload/dist/payload.js
./payload/payloadClient.ts
./node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@payloadcms/next-payload/dist/middleware/withPayload.js
./node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@payloadcms/next-payload/dist/handlers/[collection]/me.js

./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/deps.js
Module not found: Can't resolve 'snappy/package.json' in '/Volumes/dev/repos/next-payload-test/node_modules/.pnpm/[email protected]/node_modules/mongodb/lib'

Import trace for requested module:
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/deps.js
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/index.js
./node_modules/.pnpm/[email protected]/node_modules/mongoose/lib/index.js
./node_modules/.pnpm/[email protected]/node_modules/mongoose/index.js
./node_modules/.pnpm/[email protected][email protected][email protected][email protected]/node_modules/payload/dist/payload.js
./payload/payloadClient.ts
./node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@payloadcms/next-payload/dist/middleware/withPayload.js
./node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@payloadcms/next-payload/dist/handlers/[collection]/me.js

./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/deps.js
Module not found: Can't resolve 'aws4' in '/Volumes/dev/repos/next-payload-test/node_modules/.pnpm/[email protected]/node_modules/mongodb/lib'

Import trace for requested module:
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/deps.js
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/index.js
./node_modules/.pnpm/[email protected]/node_modules/mongoose/lib/index.js
./node_modules/.pnpm/[email protected]/node_modules/mongoose/index.js
./node_modules/.pnpm/[email protected][email protected][email protected][email protected]/node_modules/payload/dist/payload.js
./payload/payloadClient.ts
./node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@payloadcms/next-payload/dist/middleware/withPayload.js
./node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@payloadcms/next-payload/dist/handlers/[collection]/me.js

./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/utils.js
Module not found: Can't resolve 'mongodb-client-encryption' in '/Volumes/dev/repos/next-payload-test/node_modules/.pnpm/[email protected]/node_modules/mongodb/lib'

Import trace for requested module:
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/utils.js
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/collection.js
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/index.js
./node_modules/.pnpm/[email protected]/node_modules/mongoose/lib/index.js
./node_modules/.pnpm/[email protected]/node_modules/mongoose/index.js
./node_modules/.pnpm/[email protected][email protected][email protected][email protected]/node_modules/payload/dist/payload.js
./payload/payloadClient.ts
./node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@payloadcms/next-payload/dist/middleware/withPayload.js
./node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@payloadcms/next-payload/dist/handlers/[collection]/me.js
wait  - compiling /api/access (client and server)...
warn  - ./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/bson.js
Module not found: Can't resolve 'bson-ext' in '/Volumes/dev/repos/next-payload-test/node_modules/.pnpm/[email protected]/node_modules/mongodb/lib'

Import trace for requested module:
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/bson.js
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/index.js
./node_modules/.pnpm/[email protected]/node_modules/mongoose/lib/index.js
./node_modules/.pnpm/[email protected]/node_modules/mongoose/index.js
./node_modules/.pnpm/[email protected][email protected][email protected][email protected]/node_modules/payload/dist/payload.js
./payload/payloadClient.ts
./node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@payloadcms/next-payload/dist/middleware/withPayload.js
./node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@payloadcms/next-payload/dist/handlers/[collection]/init.js

./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/deps.js
Module not found: Can't resolve 'kerberos' in '/Volumes/dev/repos/next-payload-test/node_modules/.pnpm/[email protected]/node_modules/mongodb/lib'

Import trace for requested module:
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/deps.js
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/index.js
./node_modules/.pnpm/[email protected]/node_modules/mongoose/lib/index.js
./node_modules/.pnpm/[email protected]/node_modules/mongoose/index.js
./node_modules/.pnpm/[email protected][email protected][email protected][email protected]/node_modules/payload/dist/payload.js
./payload/payloadClient.ts
./node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@payloadcms/next-payload/dist/middleware/withPayload.js
./node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@payloadcms/next-payload/dist/handlers/[collection]/init.js

./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/deps.js
Module not found: Can't resolve '@mongodb-js/zstd' in '/Volumes/dev/repos/next-payload-test/node_modules/.pnpm/[email protected]/node_modules/mongodb/lib'

Import trace for requested module:
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/deps.js
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/index.js
./node_modules/.pnpm/[email protected]/node_modules/mongoose/lib/index.js
./node_modules/.pnpm/[email protected]/node_modules/mongoose/index.js
./node_modules/.pnpm/[email protected][email protected][email protected][email protected]/node_modules/payload/dist/payload.js
./payload/payloadClient.ts
./node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@payloadcms/next-payload/dist/middleware/withPayload.js
./node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@payloadcms/next-payload/dist/handlers/[collection]/init.js

./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/deps.js
Module not found: Can't resolve 'snappy' in '/Volumes/dev/repos/next-payload-test/node_modules/.pnpm/[email protected]/node_modules/mongodb/lib'

Import trace for requested module:
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/deps.js
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/index.js
./node_modules/.pnpm/[email protected]/node_modules/mongoose/lib/index.js
./node_modules/.pnpm/[email protected]/node_modules/mongoose/index.js
./node_modules/.pnpm/[email protected][email protected][email protected][email protected]/node_modules/payload/dist/payload.js
./payload/payloadClient.ts
./node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@payloadcms/next-payload/dist/middleware/withPayload.js
./node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@payloadcms/next-payload/dist/handlers/[collection]/init.js

./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/deps.js
Module not found: Can't resolve 'snappy/package.json' in '/Volumes/dev/repos/next-payload-test/node_modules/.pnpm/[email protected]/node_modules/mongodb/lib'

Import trace for requested module:
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/deps.js
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/index.js
./node_modules/.pnpm/[email protected]/node_modules/mongoose/lib/index.js
./node_modules/.pnpm/[email protected]/node_modules/mongoose/index.js
./node_modules/.pnpm/[email protected][email protected][email protected][email protected]/node_modules/payload/dist/payload.js
./payload/payloadClient.ts
./node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@payloadcms/next-payload/dist/middleware/withPayload.js
./node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@payloadcms/next-payload/dist/handlers/[collection]/init.js

./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/deps.js
Module not found: Can't resolve 'aws4' in '/Volumes/dev/repos/next-payload-test/node_modules/.pnpm/[email protected]/node_modules/mongodb/lib'

Import trace for requested module:
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/deps.js
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/index.js
./node_modules/.pnpm/[email protected]/node_modules/mongoose/lib/index.js
./node_modules/.pnpm/[email protected]/node_modules/mongoose/index.js
./node_modules/.pnpm/[email protected][email protected][email protected][email protected]/node_modules/payload/dist/payload.js
./payload/payloadClient.ts
./node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@payloadcms/next-payload/dist/middleware/withPayload.js
./node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@payloadcms/next-payload/dist/handlers/[collection]/init.js

./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/utils.js
Module not found: Can't resolve 'mongodb-client-encryption' in '/Volumes/dev/repos/next-payload-test/node_modules/.pnpm/[email protected]/node_modules/mongodb/lib'

Import trace for requested module:
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/utils.js
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/collection.js
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/index.js
./node_modules/.pnpm/[email protected]/node_modules/mongoose/lib/index.js
./node_modules/.pnpm/[email protected]/node_modules/mongoose/index.js
./node_modules/.pnpm/[email protected][email protected][email protected][email protected]/node_modules/payload/dist/payload.js
./payload/payloadClient.ts
./node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@payloadcms/next-payload/dist/middleware/withPayload.js
./node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@payloadcms/next-payload/dist/handlers/[collection]/init.js
warn  - ./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/bson.js
Module not found: Can't resolve 'bson-ext' in '/Volumes/dev/repos/next-payload-test/node_modules/.pnpm/[email protected]/node_modules/mongodb/lib'

Import trace for requested module:
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/bson.js
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/index.js
./node_modules/.pnpm/[email protected]/node_modules/mongoose/lib/index.js
./node_modules/.pnpm/[email protected]/node_modules/mongoose/index.js
./node_modules/.pnpm/[email protected][email protected][email protected][email protected]/node_modules/payload/dist/payload.js
./payload/payloadClient.ts
./node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@payloadcms/next-payload/dist/middleware/withPayload.js
./node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@payloadcms/next-payload/dist/handlers/[collection]/init.js

./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/deps.js
Module not found: Can't resolve 'kerberos' in '/Volumes/dev/repos/next-payload-test/node_modules/.pnpm/[email protected]/node_modules/mongodb/lib'

Import trace for requested module:
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/deps.js
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/index.js
./node_modules/.pnpm/[email protected]/node_modules/mongoose/lib/index.js
./node_modules/.pnpm/[email protected]/node_modules/mongoose/index.js
./node_modules/.pnpm/[email protected][email protected][email protected][email protected]/node_modules/payload/dist/payload.js
./payload/payloadClient.ts
./node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@payloadcms/next-payload/dist/middleware/withPayload.js
./node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@payloadcms/next-payload/dist/handlers/[collection]/init.js

./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/deps.js
Module not found: Can't resolve '@mongodb-js/zstd' in '/Volumes/dev/repos/next-payload-test/node_modules/.pnpm/[email protected]/node_modules/mongodb/lib'

Import trace for requested module:
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/deps.js
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/index.js
./node_modules/.pnpm/[email protected]/node_modules/mongoose/lib/index.js
./node_modules/.pnpm/[email protected]/node_modules/mongoose/index.js
./node_modules/.pnpm/[email protected][email protected][email protected][email protected]/node_modules/payload/dist/payload.js
./payload/payloadClient.ts
./node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@payloadcms/next-payload/dist/middleware/withPayload.js
./node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@payloadcms/next-payload/dist/handlers/[collection]/init.js

./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/deps.js
Module not found: Can't resolve 'snappy' in '/Volumes/dev/repos/next-payload-test/node_modules/.pnpm/[email protected]/node_modules/mongodb/lib'

Import trace for requested module:
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/deps.js
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/index.js
./node_modules/.pnpm/[email protected]/node_modules/mongoose/lib/index.js
./node_modules/.pnpm/[email protected]/node_modules/mongoose/index.js
./node_modules/.pnpm/[email protected][email protected][email protected][email protected]/node_modules/payload/dist/payload.js
./payload/payloadClient.ts
./node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@payloadcms/next-payload/dist/middleware/withPayload.js
./node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@payloadcms/next-payload/dist/handlers/[collection]/init.js

./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/deps.js
Module not found: Can't resolve 'snappy/package.json' in '/Volumes/dev/repos/next-payload-test/node_modules/.pnpm/[email protected]/node_modules/mongodb/lib'

Import trace for requested module:
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/deps.js
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/index.js
./node_modules/.pnpm/[email protected]/node_modules/mongoose/lib/index.js
./node_modules/.pnpm/[email protected]/node_modules/mongoose/index.js
./node_modules/.pnpm/[email protected][email protected][email protected][email protected]/node_modules/payload/dist/payload.js
./payload/payloadClient.ts
./node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@payloadcms/next-payload/dist/middleware/withPayload.js
./node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@payloadcms/next-payload/dist/handlers/[collection]/init.js

./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/deps.js
Module not found: Can't resolve 'aws4' in '/Volumes/dev/repos/next-payload-test/node_modules/.pnpm/[email protected]/node_modules/mongodb/lib'

Import trace for requested module:
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/deps.js
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/index.js
./node_modules/.pnpm/[email protected]/node_modules/mongoose/lib/index.js
./node_modules/.pnpm/[email protected]/node_modules/mongoose/index.js
./node_modules/.pnpm/[email protected][email protected][email protected][email protected]/node_modules/payload/dist/payload.js
./payload/payloadClient.ts
./node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@payloadcms/next-payload/dist/middleware/withPayload.js
./node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@payloadcms/next-payload/dist/handlers/[collection]/init.js

./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/utils.js
Module not found: Can't resolve 'mongodb-client-encryption' in '/Volumes/dev/repos/next-payload-test/node_modules/.pnpm/[email protected]/node_modules/mongodb/lib'

Import trace for requested module:
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/utils.js
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/collection.js
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/index.js
./node_modules/.pnpm/[email protected]/node_modules/mongoose/lib/index.js
./node_modules/.pnpm/[email protected]/node_modules/mongoose/index.js
./node_modules/.pnpm/[email protected][email protected][email protected][email protected]/node_modules/payload/dist/payload.js
./payload/payloadClient.ts
./node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@payloadcms/next-payload/dist/middleware/withPayload.js
./node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@payloadcms/next-payload/dist/handlers/[collection]/init.js
wait  - compiling /api/[collection]/[id] (client and server)...
warn  - ./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/bson.js
Module not found: Can't resolve 'bson-ext' in '/Volumes/dev/repos/next-payload-test/node_modules/.pnpm/[email protected]/node_modules/mongodb/lib'

Import trace for requested module:
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/bson.js
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/index.js
./node_modules/.pnpm/[email protected]/node_modules/mongoose/lib/index.js
./node_modules/.pnpm/[email protected]/node_modules/mongoose/index.js
./node_modules/.pnpm/[email protected][email protected][email protected][email protected]/node_modules/payload/dist/payload.js
./payload/payloadClient.ts
./node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@payloadcms/next-payload/dist/middleware/withPayload.js
./node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@payloadcms/next-payload/dist/handlers/[collection]/init.js

./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/deps.js
Module not found: Can't resolve 'kerberos' in '/Volumes/dev/repos/next-payload-test/node_modules/.pnpm/[email protected]/node_modules/mongodb/lib'

Import trace for requested module:
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/deps.js
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/index.js
./node_modules/.pnpm/[email protected]/node_modules/mongoose/lib/index.js
./node_modules/.pnpm/[email protected]/node_modules/mongoose/index.js
./node_modules/.pnpm/[email protected][email protected][email protected][email protected]/node_modules/payload/dist/payload.js
./payload/payloadClient.ts
./node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@payloadcms/next-payload/dist/middleware/withPayload.js
./node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@payloadcms/next-payload/dist/handlers/[collection]/init.js

./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/deps.js
Module not found: Can't resolve '@mongodb-js/zstd' in '/Volumes/dev/repos/next-payload-test/node_modules/.pnpm/[email protected]/node_modules/mongodb/lib'

Import trace for requested module:
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/deps.js
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/index.js
./node_modules/.pnpm/[email protected]/node_modules/mongoose/lib/index.js
./node_modules/.pnpm/[email protected]/node_modules/mongoose/index.js
./node_modules/.pnpm/[email protected][email protected][email protected][email protected]/node_modules/payload/dist/payload.js
./payload/payloadClient.ts
./node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@payloadcms/next-payload/dist/middleware/withPayload.js
./node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@payloadcms/next-payload/dist/handlers/[collection]/init.js

./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/deps.js
Module not found: Can't resolve 'snappy' in '/Volumes/dev/repos/next-payload-test/node_modules/.pnpm/[email protected]/node_modules/mongodb/lib'

Import trace for requested module:
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/deps.js
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/index.js
./node_modules/.pnpm/[email protected]/node_modules/mongoose/lib/index.js
./node_modules/.pnpm/[email protected]/node_modules/mongoose/index.js
./node_modules/.pnpm/[email protected][email protected][email protected][email protected]/node_modules/payload/dist/payload.js
./payload/payloadClient.ts
./node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@payloadcms/next-payload/dist/middleware/withPayload.js
./node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@payloadcms/next-payload/dist/handlers/[collection]/init.js

./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/deps.js
Module not found: Can't resolve 'snappy/package.json' in '/Volumes/dev/repos/next-payload-test/node_modules/.pnpm/[email protected]/node_modules/mongodb/lib'

Import trace for requested module:
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/deps.js
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/index.js
./node_modules/.pnpm/[email protected]/node_modules/mongoose/lib/index.js
./node_modules/.pnpm/[email protected]/node_modules/mongoose/index.js
./node_modules/.pnpm/[email protected][email protected][email protected][email protected]/node_modules/payload/dist/payload.js
./payload/payloadClient.ts
./node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@payloadcms/next-payload/dist/middleware/withPayload.js
./node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@payloadcms/next-payload/dist/handlers/[collection]/init.js

./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/deps.js
Module not found: Can't resolve 'aws4' in '/Volumes/dev/repos/next-payload-test/node_modules/.pnpm/[email protected]/node_modules/mongodb/lib'

Import trace for requested module:
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/deps.js
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/index.js
./node_modules/.pnpm/[email protected]/node_modules/mongoose/lib/index.js
./node_modules/.pnpm/[email protected]/node_modules/mongoose/index.js
./node_modules/.pnpm/[email protected][email protected][email protected][email protected]/node_modules/payload/dist/payload.js
./payload/payloadClient.ts
./node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@payloadcms/next-payload/dist/middleware/withPayload.js
./node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@payloadcms/next-payload/dist/handlers/[collection]/init.js

./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/utils.js
Module not found: Can't resolve 'mongodb-client-encryption' in '/Volumes/dev/repos/next-payload-test/node_modules/.pnpm/[email protected]/node_modules/mongodb/lib'

Import trace for requested module:
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/utils.js
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/collection.js
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/index.js
./node_modules/.pnpm/[email protected]/node_modules/mongoose/lib/index.js
./node_modules/.pnpm/[email protected]/node_modules/mongoose/index.js
./node_modules/.pnpm/[email protected][email protected][email protected][email protected]/node_modules/payload/dist/payload.js
./payload/payloadClient.ts
./node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@payloadcms/next-payload/dist/middleware/withPayload.js
./node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@payloadcms/next-payload/dist/handlers/[collection]/init.js
warn  - ./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/bson.js
Module not found: Can't resolve 'bson-ext' in '/Volumes/dev/repos/next-payload-test/node_modules/.pnpm/[email protected]/node_modules/mongodb/lib'

Import trace for requested module:
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/bson.js
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/index.js
./node_modules/.pnpm/[email protected]/node_modules/mongoose/lib/index.js
./node_modules/.pnpm/[email protected]/node_modules/mongoose/index.js
./node_modules/.pnpm/[email protected][email protected][email protected][email protected]/node_modules/payload/dist/payload.js
./payload/payloadClient.ts
./node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@payloadcms/next-payload/dist/middleware/withPayload.js
./node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@payloadcms/next-payload/dist/handlers/[collection]/init.js

./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/deps.js
Module not found: Can't resolve 'kerberos' in '/Volumes/dev/repos/next-payload-test/node_modules/.pnpm/[email protected]/node_modules/mongodb/lib'

Import trace for requested module:
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/deps.js
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/index.js
./node_modules/.pnpm/[email protected]/node_modules/mongoose/lib/index.js
./node_modules/.pnpm/[email protected]/node_modules/mongoose/index.js
./node_modules/.pnpm/[email protected][email protected][email protected][email protected]/node_modules/payload/dist/payload.js
./payload/payloadClient.ts
./node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@payloadcms/next-payload/dist/middleware/withPayload.js
./node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@payloadcms/next-payload/dist/handlers/[collection]/init.js

./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/deps.js
Module not found: Can't resolve '@mongodb-js/zstd' in '/Volumes/dev/repos/next-payload-test/node_modules/.pnpm/[email protected]/node_modules/mongodb/lib'

Import trace for requested module:
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/deps.js
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/index.js
./node_modules/.pnpm/[email protected]/node_modules/mongoose/lib/index.js
./node_modules/.pnpm/[email protected]/node_modules/mongoose/index.js
./node_modules/.pnpm/[email protected][email protected][email protected][email protected]/node_modules/payload/dist/payload.js
./payload/payloadClient.ts
./node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@payloadcms/next-payload/dist/middleware/withPayload.js
./node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@payloadcms/next-payload/dist/handlers/[collection]/init.js

./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/deps.js
Module not found: Can't resolve 'snappy' in '/Volumes/dev/repos/next-payload-test/node_modules/.pnpm/[email protected]/node_modules/mongodb/lib'

Import trace for requested module:
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/deps.js
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/index.js
./node_modules/.pnpm/[email protected]/node_modules/mongoose/lib/index.js
./node_modules/.pnpm/[email protected]/node_modules/mongoose/index.js
./node_modules/.pnpm/[email protected][email protected][email protected][email protected]/node_modules/payload/dist/payload.js
./payload/payloadClient.ts
./node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@payloadcms/next-payload/dist/middleware/withPayload.js
./node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@payloadcms/next-payload/dist/handlers/[collection]/init.js

./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/deps.js
Module not found: Can't resolve 'snappy/package.json' in '/Volumes/dev/repos/next-payload-test/node_modules/.pnpm/[email protected]/node_modules/mongodb/lib'

Import trace for requested module:
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/deps.js
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/index.js
./node_modules/.pnpm/[email protected]/node_modules/mongoose/lib/index.js
./node_modules/.pnpm/[email protected]/node_modules/mongoose/index.js
./node_modules/.pnpm/[email protected][email protected][email protected][email protected]/node_modules/payload/dist/payload.js
./payload/payloadClient.ts
./node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@payloadcms/next-payload/dist/middleware/withPayload.js
./node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@payloadcms/next-payload/dist/handlers/[collection]/init.js

./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/deps.js
Module not found: Can't resolve 'aws4' in '/Volumes/dev/repos/next-payload-test/node_modules/.pnpm/[email protected]/node_modules/mongodb/lib'

Import trace for requested module:
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/deps.js
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/index.js
./node_modules/.pnpm/[email protected]/node_modules/mongoose/lib/index.js
./node_modules/.pnpm/[email protected]/node_modules/mongoose/index.js
./node_modules/.pnpm/[email protected][email protected][email protected][email protected]/node_modules/payload/dist/payload.js
./payload/payloadClient.ts
./node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@payloadcms/next-payload/dist/middleware/withPayload.js
./node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@payloadcms/next-payload/dist/handlers/[collection]/init.js

./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/utils.js
Module not found: Can't resolve 'mongodb-client-encryption' in '/Volumes/dev/repos/next-payload-test/node_modules/.pnpm/[email protected]/node_modules/mongodb/lib'

Import trace for requested module:
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/utils.js
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/collection.js
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/index.js
./node_modules/.pnpm/[email protected]/node_modules/mongoose/lib/index.js
./node_modules/.pnpm/[email protected]/node_modules/mongoose/index.js
./node_modules/.pnpm/[email protected][email protected][email protected][email protected]/node_modules/payload/dist/payload.js
./payload/payloadClient.ts
./node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@payloadcms/next-payload/dist/middleware/withPayload.js
./node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@payloadcms/next-payload/dist/handlers/[collection]/init.js
warn  - ./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/bson.js
Module not found: Can't resolve 'bson-ext' in '/Volumes/dev/repos/next-payload-test/node_modules/.pnpm/[email protected]/node_modules/mongodb/lib'

Import trace for requested module:
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/bson.js
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/index.js
./node_modules/.pnpm/[email protected]/node_modules/mongoose/lib/index.js
./node_modules/.pnpm/[email protected]/node_modules/mongoose/index.js
./node_modules/.pnpm/[email protected][email protected][email protected][email protected]/node_modules/payload/dist/payload.js
./payload/payloadClient.ts
./node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@payloadcms/next-payload/dist/middleware/withPayload.js
./node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@payloadcms/next-payload/dist/handlers/[collection]/init.js

./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/deps.js
Module not found: Can't resolve 'kerberos' in '/Volumes/dev/repos/next-payload-test/node_modules/.pnpm/[email protected]/node_modules/mongodb/lib'

Import trace for requested module:
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/deps.js
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/index.js
./node_modules/.pnpm/[email protected]/node_modules/mongoose/lib/index.js
./node_modules/.pnpm/[email protected]/node_modules/mongoose/index.js
./node_modules/.pnpm/[email protected][email protected][email protected][email protected]/node_modules/payload/dist/payload.js
./payload/payloadClient.ts
./node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@payloadcms/next-payload/dist/middleware/withPayload.js
./node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@payloadcms/next-payload/dist/handlers/[collection]/init.js

./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/deps.js
Module not found: Can't resolve '@mongodb-js/zstd' in '/Volumes/dev/repos/next-payload-test/node_modules/.pnpm/[email protected]/node_modules/mongodb/lib'

Import trace for requested module:
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/deps.js
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/index.js
./node_modules/.pnpm/[email protected]/node_modules/mongoose/lib/index.js
./node_modules/.pnpm/[email protected]/node_modules/mongoose/index.js
./node_modules/.pnpm/[email protected][email protected][email protected][email protected]/node_modules/payload/dist/payload.js
./payload/payloadClient.ts
./node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@payloadcms/next-payload/dist/middleware/withPayload.js
./node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@payloadcms/next-payload/dist/handlers/[collection]/init.js

./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/deps.js
Module not found: Can't resolve 'snappy' in '/Volumes/dev/repos/next-payload-test/node_modules/.pnpm/[email protected]/node_modules/mongodb/lib'

Import trace for requested module:
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/deps.js
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/index.js
./node_modules/.pnpm/[email protected]/node_modules/mongoose/lib/index.js
./node_modules/.pnpm/[email protected]/node_modules/mongoose/index.js
./node_modules/.pnpm/[email protected][email protected][email protected][email protected]/node_modules/payload/dist/payload.js
./payload/payloadClient.ts
./node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@payloadcms/next-payload/dist/middleware/withPayload.js
./node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@payloadcms/next-payload/dist/handlers/[collection]/init.js

./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/deps.js
Module not found: Can't resolve 'snappy/package.json' in '/Volumes/dev/repos/next-payload-test/node_modules/.pnpm/[email protected]/node_modules/mongodb/lib'

Import trace for requested module:
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/deps.js
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/index.js
./node_modules/.pnpm/[email protected]/node_modules/mongoose/lib/index.js
./node_modules/.pnpm/[email protected]/node_modules/mongoose/index.js
./node_modules/.pnpm/[email protected][email protected][email protected][email protected]/node_modules/payload/dist/payload.js
./payload/payloadClient.ts
./node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@payloadcms/next-payload/dist/middleware/withPayload.js
./node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@payloadcms/next-payload/dist/handlers/[collection]/init.js

./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/deps.js
Module not found: Can't resolve 'aws4' in '/Volumes/dev/repos/next-payload-test/node_modules/.pnpm/[email protected]/node_modules/mongodb/lib'

Import trace for requested module:
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/deps.js
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/index.js
./node_modules/.pnpm/[email protected]/node_modules/mongoose/lib/index.js
./node_modules/.pnpm/[email protected]/node_modules/mongoose/index.js
./node_modules/.pnpm/[email protected][email protected][email protected][email protected]/node_modules/payload/dist/payload.js
./payload/payloadClient.ts
./node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@payloadcms/next-payload/dist/middleware/withPayload.js
./node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@payloadcms/next-payload/dist/handlers/[collection]/init.js

./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/utils.js
Module not found: Can't resolve 'mongodb-client-encryption' in '/Volumes/dev/repos/next-payload-test/node_modules/.pnpm/[email protected]/node_modules/mongodb/lib'

Import trace for requested module:
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/utils.js
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/collection.js
./node_modules/.pnpm/[email protected]/node_modules/mongodb/lib/index.js
./node_modules/.pnpm/[email protected]/node_modules/mongoose/lib/index.js
./node_modules/.pnpm/[email protected]/node_modules/mongoose/index.js
./node_modules/.pnpm/[email protected][email protected][email protected][email protected]/node_modules/payload/dist/payload.js
./payload/payloadClient.ts
./node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@payloadcms/next-payload/dist/middleware/withPayload.js
./node_modules/.pnpm/@[email protected][email protected][email protected]/node_modules/@payloadcms/next-payload/dist/handlers/[collection]/init.js

This is obviously related to the way pnpm handles undeclared dependencies and goes away once I add shamefully-hoist=true to .npmrc.
Would it be possible - on your end - to include missing dependencies? Is there something you could do to improve the out-of-the-box pnpm support?

Error when calling getPayloadClient() in server component (dev)

I have created a fresh Next.js project with npx create-next-app@latest (with TypeScript, Tailwind, the App Router and without a src directory) and then applied all the steps from the README.

When running npm run dev I get the following error when calling getPayloadClient() from the server component page.tsx.

- error TypeError: Cannot read properties of undefined (reading 'sources')
    at Object.<anonymous> (/Users/user1/project1/node_modules/payload/node_modules/swc-minify-webpack-plugin/dist/index.js:38:61)
    at Module._compile (node:internal/modules/cjs/loader:1105:14)
    at Module._extensions..js (node:internal/modules/cjs/loader:1159:10)
    at Module.load (node:internal/modules/cjs/loader:981:32)
    at Module._load (node:internal/modules/cjs/loader:827:12)
    at Module.require (node:internal/modules/cjs/loader:1005:19)
    at require (node:internal/modules/cjs/helpers:102:18)
    at Object.<anonymous> (/Users/user1/project1/node_modules/payload/dist/bundlers/webpack/configs/prod.js:9:37)
    at Module._compile (node:internal/modules/cjs/loader:1105:14)
    at Module._extensions..js (node:internal/modules/cjs/loader:1159:10)
    at Module.load (node:internal/modules/cjs/loader:981:32)
    at Module._load (node:internal/modules/cjs/loader:827:12)
    at Module.require (node:internal/modules/cjs/loader:1005:19)
    at require (node:internal/modules/cjs/helpers:102:18)
    at Object.<anonymous> (/Users/user1/project1/node_modules/payload/dist/bundlers/webpack/scripts/build.js:8:16)
    at Module._compile (node:internal/modules/cjs/loader:1105:14)
    at Module._extensions..js (node:internal/modules/cjs/loader:1159:10)
    at Module.load (node:internal/modules/cjs/loader:981:32)
    at Module._load (node:internal/modules/cjs/loader:827:12)
    at Module.require (node:internal/modules/cjs/loader:1005:19)
    at require (node:internal/modules/cjs/helpers:102:18)
    at Object.<anonymous> (/Users/user1/project1/node_modules/payload/dist/bundlers/webpack/bundler.js:4:17)
    at Module._compile (node:internal/modules/cjs/loader:1105:14)
    at Module._extensions..js (node:internal/modules/cjs/loader:1159:10)
    at Module.load (node:internal/modules/cjs/loader:981:32)
    at Module._load (node:internal/modules/cjs/loader:827:12)
    at Module.require (node:internal/modules/cjs/loader:1005:19)
    at require (node:internal/modules/cjs/helpers:102:18)
    at Object.<anonymous> (/Users/user1/project1/node_modules/payload/dist/config/sanitize.js:15:35)
    at Module._compile (node:internal/modules/cjs/loader:1105:14)
    at Module._extensions..js (node:internal/modules/cjs/loader:1159:10)
    at Module.load (node:internal/modules/cjs/loader:981:32)
    at Module._load (node:internal/modules/cjs/loader:827:12)
    at Module.require (node:internal/modules/cjs/loader:1005:19)
    at require (node:internal/modules/cjs/helpers:102:18)
    at Object.<anonymous> (/Users/user1/project1/node_modules/payload/dist/config/build.js:4:20)
    at Module._compile (node:internal/modules/cjs/loader:1105:14)
    at Module._extensions..js (node:internal/modules/cjs/loader:1159:10)
    at Module.load (node:internal/modules/cjs/loader:981:32)
    at Module._load (node:internal/modules/cjs/loader:827:12)
    at Module.require (node:internal/modules/cjs/loader:1005:19)
    at require (node:internal/modules/cjs/helpers:102:18)
    at Object.<anonymous> (/Users/user1/project1/node_modules/payload/config.js:1:23)
    at Module._compile (node:internal/modules/cjs/loader:1105:14)
    at Module._extensions..js (node:internal/modules/cjs/loader:1159:10)
    at Module.load (node:internal/modules/cjs/loader:981:32)
    at Module._load (node:internal/modules/cjs/loader:827:12)
    at Module.require (node:internal/modules/cjs/loader:1005:19)
    at require (node:internal/modules/cjs/helpers:102:18)
    at payload/config (/Users/user1/project1/.next/server/app/(site)/page.js:209:18) {
  digest: '2670685204'
}

where .next/server/app/(site)/page.js:209:18 resolves to the following (last line):

/***/ }),

/***/ "payload/config":
/*!*********************************!*\
  !*** external "payload/config" ***!
  \*********************************/
/***/ ((module) => {

"use strict";
module.exports = require("payload/config"); // <-- HERE: Line 209

Environment

Mac with M2 chip
Node version 18.0.0 (also tried with 19.0.0 and the latest Yarn version)
Npm version 8.6.0
Payload version 1.11.8
Next.Js version 13.4.12
@payloadcms/next-payload version 0.0.33

Importing Payload components causes SyntaxError on the front-end

I have tried to add a color-picker field to a global in Payload, but the moment I call the useField hook or useFieldType hook, it seems that the front-end is having issues - outputting following in the terminal:

- error /my-app/node_modules/payload/dist/admin/components/forms/Label/index.scss:1
@import '../../../scss/styles.scss';
^

SyntaxError: Invalid or unexpected token
    at internalCompileFunction (node:internal/vm:73:18)
    at wrapSafe (node:internal/modules/cjs/loader:1176:20)
    at Module._compile (node:internal/modules/cjs/loader:1218:27)
    at Module._extensions..js (node:internal/modules/cjs/loader:1308:10)
    at Module.load (node:internal/modules/cjs/loader:1117:32)
    at Module._load (node:internal/modules/cjs/loader:958:12)
    at Module.require (node:internal/modules/cjs/loader:1141:19)
    at require (node:internal/modules/cjs/helpers:110:18)
    at Object.<anonymous> (/my-app/node_modules/payload/dist/admin/components/forms/Label/index.js:10:1)
    at Module._compile (node:internal/modules/cjs/loader:1254:14) {
  digest: undefined
}

How to replicate

Spin up a new next installation.
Follow the next-payload installation directions.
Create a Field.tsx file in the payload directory with following:

import React from "react";
import { Label } from "payload/components/forms";
import { Props } from "payload/components/fields/Text";

const LabelField: React.FC<Props> = (props) => {
  const { path, required, label } = props;

  return (
    <div>
      <Label htmlFor={path} label={label} required={required} />
    </div>
  );
};

export default LabelField;

Update payload.config.ts as follows:

import path from "path";
import { buildConfig } from "payload/config";
import Field from "./Field";

export default buildConfig({
  collections: [
    // Your collections here
  ],
  globals: [
    // Your globals here
    {
      slug: "header",
      fields: [
        {
          name: "custom",
          type: "text",
          admin: {
            components: {
              Field,
            },
          },
        },
      ],
    },
  ],
  typescript: {
    outputFile: path.resolve(__dirname, "../payload-types.ts"),
  },
});

Finally call the getPayloadClient() function on the front-end e.g. by updating the default layout.tsx file like this:

import getPayloadClient from '@/payload/payloadClient'
import './globals.css'
import type { Metadata } from 'next'
import { Inter } from 'next/font/google'

const inter = Inter({ subsets: ['latin'] })

export const metadata: Metadata = {
  title: 'Create Next App',
  description: 'Generated by create next app',
}

export default function RootLayout({
  children,
}: {
  children: React.ReactNode
}) {
  return (
    <html lang="en">
      <body className={inter.className}>{children}</body>
    </html>
  )
}

async function getSiteSettings() {
  const payload = await getPayloadClient();

  return {};
}

This will cause the error on the front-end. And if one goes in the the Field.tsx file and simply remove the imported <Label /> component from Payload, then no errors appear.

I have also tried not to use the Payload components, but when I call the useField() hook, it causes the same error.

Relationships and Uploads disappearing in Globals after save

Describe the bug

I guess this is related to issue #14

After hitting "Save" button, text content is saved but relationships and upload disappears from browser.
Refreshing the page loads up the previously saved content.

To Reproduce

Cloned next-payload-demo
Changed .env and configured GCS for media
Added relationship and upload fields
Run yarn dev
Make a change in fields and save

Expected behavior

Updated content should be still visible after save.

Screenshots/Video

Screen.Recording.2023-05-18.at.15.52.32.mov

Next.js can't recognize the exported `config` field in route "/pages/api/[collection]/me"

Message:
Unknown identifier "handlerConfig" at "config". The default config will be used instead. Read More - https://nextjs.org/docs/messages/invalid-page-config
The same thing occurs for all api routes
It's only a warning, not an error. Thought I would still raise an issue. Feel free to close it if that's the intended behaviour

Error: failed to handle: base_dir() must be absolute. Please ensure that `jsc.baseUrl` is specified correctly.

Getting the following issue when I follow the README steps. Cloned https://github.com/payloadcms/next-payload-demo and ran as is and seeing the same. Any ideas?

thread '<unnamed>' panicked at 'base_dir() must be absolute. Please ensure that `jsc.baseUrl` is specified correctly.', C:\Users\runneradmin\.cargo\registry\src\index.crates.io-6f17d22bba15001f\swc_ecma_transforms_module-0.173.28\src\path.rs:104:13
note: run with `RUST_BACKTRACE=1` environment variable to display a backtrace
C:\Users\Chris\code-coyotes\node_modules\@swc\core\index.js:241
            return bindings.transformSync(isModule ? JSON.stringify(src) : src, isModule, toBuffer(newOptions));
                            ^

Error: failed to handle: base_dir() must be absolute. Please ensure that `jsc.baseUrl` is specified correctly.
    at Compiler.transformSync (C:\Users\Chris\code-coyotes\node_modules\@swc\core\index.js:241:29)
    at Object.transformSync (C:\Users\Chris\code-coyotes\node_modules\@swc\core\index.js:348:21)
    at compile (C:\Users\Chris\code-coyotes\node_modules\@swc\register\lib\node.js:76:22)
    at compileHook (C:\Users\Chris\code-coyotes\node_modules\@swc\register\lib\node.js:91:16)
    at Module._compile (C:\Users\Chris\code-coyotes\node_modules\pirates\lib\index.js:113:29)
    at Module._extensions..js (node:internal/modules/cjs/loader:1166:10)
    at Object.newLoader [as .ts] (C:\Users\Chris\code-coyotes\node_modules\pirates\lib\index.js:121:7)
    at Module.load (node:internal/modules/cjs/loader:988:32)
    at Module._load (node:internal/modules/cjs/loader:834:12)
    at Module.require (node:internal/modules/cjs/loader:1012:19) {
  code: 'GenericFailure'
}

Node.js v18.4.0

swc error when using @payloadcms/next-payload

Link to reproduction

https://github.com/dottemechy/payload-reproduction

To Reproduce

Step 1: yarn create next-app .
Step 2: Select all default options

✔ Would you like to use TypeScript? … Yes
✔ Would you like to use ESLint? … Yes
✔ Would you like to use Tailwind CSS? … Yes
✔ Would you like to use `src/` directory? … No
✔ Would you like to use App Router? (recommended) … Yes
✔ Would you like to customize the default import alias? … No

Step 3: yarn add @payloadcms/next-payload payload

Step 4: yarn next-payload install

Step 5: create .env

MONGODB_URI=mongodb://localhost/create-next-app-serverless
PAYLOAD_SECRET=SOME_SECRET
PAYLOAD_CONFIG_PATH=payload/payload.config.ts

Step 6: update next.config.js

const path = require('path');
const { withPayload } = require('@payloadcms/next-payload');

module.exports = withPayload({
  // your Next config here
}, {
  configPath: path.resolve(__dirname, './payload/payload.config.ts'),
});

Step 7: yarn dev

Step 8: load http://localhost:3000/admin

Describe the Bug

When running the any version of payload 1.11.4 or newer, using @payloadcms/next-payload to run payload encounters an error.

I noticed this when updating payload from version 1.11.3 to 1.11.4. This problem persists in the latest version of payload (1.11.7).

After running yarn dev and then attempting to load http://localhost:3000/admin, the terminal outputs

- 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-minify-webpack-plugin/dist/index.mjs
./node_modules/payload/dist/bundlers/webpack/configs/prod.js
./node_modules/payload/dist/bundlers/webpack/scripts/build.js
./node_modules/payload/dist/bundlers/webpack/bundler.js
./node_modules/payload/dist/config/sanitize.js
./node_modules/payload/dist/config/build.js
./node_modules/payload/config.js
./payload/payload.config.ts
./node_modules/payload/dist/admin/Root.js
./src/app/(payload)/admin/page.tsx

I am using an M1 Macbook Air for this test.

Payload Version

1.11.7

Missing script: "next-payload"

Following the README installation instructions, installing @payloadcms/next-payload payload, then running npm run next-payload install gives the error Missing script: "next-payload"
Solution: npx next-payload install

Cannot delete items from any collection

When trying to delete any item from any collection, I'm getting the following error (example error for carts collection, but applies to others as well):

- error Failed to handle request for /api/carts?where%5Bid%5D%5Bin%5D%5B0%5D=64d89ae73bf13b4917ec939c&locale=en
TypeError: fetch failed
    at Object.fetch (node:internal/deps/undici/undici:11576:11)
    at async invokeRequest (/SYSTEM_PATH/node_modules/next/dist/server/lib/server-ipc/invoke-request.js:21:12)
    at async requestHandler (/SYSTEM_PATH/node_modules/next/dist/server/lib/start-server.js:336:33)
    at async Server.<anonymous> (/SYSTEM_PATH/node_modules/next/dist/server/lib/start-server.js:152:13) {
  cause: RequestContentLengthMismatchError: Request body length does not match content-length header
      at write (node:internal/deps/undici/undici:10059:41)
      at _resume (node:internal/deps/undici/undici:10037:33)
      at resume (node:internal/deps/undici/undici:9938:7)
      at connect (node:internal/deps/undici/undici:9927:7) {
    code: 'UND_ERR_REQ_CONTENT_LENGTH_MISMATCH'
  }
}

I tried with Node versions 16, 18, and 20, same error on all. Not sure where to begin with this error so if anyone can chime in, that'd be great. I'm using next-payload v0.0.33 and payload v1.13.4 for reference.

forgot-password throwing error

Any ideas what may be happening here?

ERROR (payload): TypeError: req.get is not a function
    at forgotPassword (webpack-internal:///(api)/./node_modules/payload/dist/auth/operations/forgotPassword.js:48:126)
    at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
    at async handler (webpack-internal:///(api)/./node_modules/@payloadcms/next-payload/dist/handlers/[collection]/forgot-password.js:27:9)

I am doing as follows:

const data = {email: '[email protected]'}
const response = await fetch(`${process.env.NEXT_PUBLIC_CMS_URL}/api/users/forgot-password`, {
			method: 'POST',
			body: JSON.stringify(data),
			headers: {
				'Content-Type': 'application/json',
			},
		})

Endpoints for Bulk operations are missing

The PATCH and DELETE Endpoints for Bulk operations are missing in the api/[collection]/index.ts handler.

Fully type "hander()" in the api routes

The parameters (req & res) of the api routes in the "pages" dir (which are autogenerated by next-payload) don't have types. This makes it hard to use with Typescript strict mode (which Next.js comes with by default).

SassError: Can't find stylesheet to import

I've tried adding this to a NextJS app by following the instructions in the README and I'm running into an error:

`error - ./node_modules/payload/dist/admin/scss/app.scss.webpack[javascript/auto]!=!./node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[2].oneOf[14].use[2]!./node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[2].oneOf[14].use[3]!./node_modules/next/dist/build/webpack/loaders/resolve-url-loader/index.js??ruleSet[1].rules[2].oneOf[14].use[4]!./node_modules/next/dist/compiled/sass-loader/cjs.js??ruleSet[1].rules[2].oneOf[14].use[5]!./node_modules/payload/dist/admin/scss/app.scss
SassError: Can't find stylesheet to import.
╷
180 │ @import '~payload-user-css';
│ ^^^^^^^^^^^^^^^^^^^
╵
node_modules/payload/dist/admin/scss/app.scss 180:9 root stylesheet

Import trace for requested module:
./node_modules/payload/dist/admin/scss/app.scss.webpack[javascript/auto]!=!./node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[2].oneOf[14].use[2]!./node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[2].oneOf[14].use[3]!./node_modules/next/dist/build/webpack/loaders/resolve-url-loader/index.js??ruleSet[1].rules[2].oneOf[14].use[4]!./node_modules/next/dist/compiled/sass-loader/cjs.js??ruleSet[1].rules[2].oneOf[14].use[5]!./node_modules/payload/dist/admin/scss/app.scss
./node_modules/payload/dist/admin/scss/app.scss
./node_modules/payload/dist/admin/Root.js
./app/(payload)/admin/page.tsx`

I was able to recreate the error using a completely clean Next JS app after performing the following steps:

yarn create next-app yarn create v1.22.19 [1/4] Resolving packages... [2/4] Fetching packages... [3/4] Linking dependencies... [4/4] Building fresh packages... success Installed "[email protected]" with binaries: - create-next-app ✔ What is your project named? … payload-module-test ✔ Would you like to use TypeScript with this project? … Yes ✔ Would you like to use ESLint with this project? … Yes ✔ Would you like to use Tailwind CSS with this project? … Yes ✔ Would you like to use src/directory with this project? … Yes ✔ Would you like to use experimentalapp/ directory with this project? … Yes ✔ What import alias would you like configured? … @/* Creating a new Next.js app in /home/dan/scratch/nextjs/payload-module-test.

yarn add @payloadcms/next-payload payload

yarn next-payload install yarn run v1.22.19 $ /home/dan/scratch/nextjs/payload-module-test/node_modules/.bin/next-payload install Done in 0.06s.

next.config.js:
`
/** @type {import('next').NextConfig} */
const nextConfig = {
reactStrictMode: true,
}

// next.config.js
const path = require('path');
const { withPayload } = require('@payloadcms/next-payload');

module.exports = withPayload(nextConfig, {
// The second argument to withPayload
// allows you to specify paths to your Payload dependencies.

// Point to your Payload config (Required)
configPath: path.resolve(__dirname, './payload/payload.config.ts'),

// Point to custom Payload CSS (optional)
cssPath: path.resolve(__dirname, './css/my-custom-payload-styles.css'),

// Point to your exported, initialized Payload instance (optional, default shown below) payloadPath: path.resolve(process.cwd(), './payload.ts'), });

yarn dev

Any help in troubleshooting this issue would be much appreciated. Please let me know if you require any more information.

Recommend Projects

React

A declarative, efficient, and flexible JavaScript library for building user interfaces.
Vue.js

🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
Typescript

TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
TensorFlow

An Open Source Machine Learning Framework for Everyone
Django

The Web framework for perfectionists with deadlines.
Laravel

A PHP framework for web artisans
D3

Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

javascript

JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
web

Some thing interesting about web. New door for the world.
server

A server is a program made to process requests and deliver data to clients.
Machine learning

Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Visualization

Some thing interesting about visualization, use data art
Game

Some thing interesting about game, make everyone happy.

Recommend Org

Facebook

We are working to build community through open source technology. NB: members must have two-factor auth.
Microsoft

Open source projects and samples from Microsoft.
Google

Google ❤️ Open Source for everyone.
Alibaba

Alibaba Open Source for everyone
D3

Data-Driven Documents codes.
Tencent

China tencent open source team.