Admin panel unreachable after ^3.27.0 due to import map generation failure with: `RangeError: Maximum call stack size exceeded`
Describe the Bug
After upgrading to 3.27.0 (and now to 3.29.0) from 3.20.0, i'm no longer able to reach the admin panel in dev/prod.
Based on my testing, 3.26.0 is the last version that works, - 3.27.0 onwards introduces the call stack size error.
Doesn't work with either pnpm or bun ( used to work with bun)
Following files use lexical:
Blocks:
ArchiveBlock
Banner
CallToAction
Content
Form
PricesBlock
Collections:
Media
Posts
Products
RichText
Fields:
defaultLexical
src/heros/index.ts
tried cleaning the repo and reinstalling everything as well.
GET /admin 200 in 321ms
○ Compiling /api/[...slug] ...
✓ Compiled /api/[...slug] in 802ms (5098 modules)
GET /api/payload-preferences/nav 200 in 2070ms
GET /api/users/me 200 in 2094ms
getFromImportMap: PayloadComponent not found in importMap {
key: '@payloadcms/storage-s3/client#S3ClientUploadHandler',
PayloadComponent: {
clientProps: {
collectionSlug: 'media',
enabled: false,
extra: undefined,
prefix: undefined,
serverHandlerPath: '/storage-s3-generate-signed-url'
},
path: '@payloadcms/storage-s3/client#S3ClientUploadHandler'
},
schemaPath: ''
} You may need to run the `payload generate:importmap` command to generate the importMap ahead of runtime.
GET /admin 200 in 374ms
(base) ➜ payload-project git:(main) ✗ bun run generate:importmap
$ cross-env NODE_OPTIONS=--no-deprecation payload generate:importmap
Generating import map
RangeError: Maximum call stack size exceeded
at Object.generateImportMap (file:///Users/user/Projects/payload-project/node_modules/@payloadcms/richtext-lexical/dist/utilities/generateImportMap.js?tsx-namespace=1742565751435:4:1)
at genImportMapIterateFields (file:///Users/user/Projects/payload-project/node_modules/payload/dist/bin/generateImportMap/iterateFields.js?tsx-namespace=1742565751435:42:30)
at genImportMapIterateFields (file:///Users/user/Projects/payload-project/node_modules/payload/dist/bin/generateImportMap/iterateFields.js?tsx-namespace=1742565751435:14:13)
at genImportMapIterateFields (file:///Users/user/Projects/payload-project/node_modules/payload/dist/bin/generateImportMap/iterateFields.js?tsx-namespace=1742565751435:14:13)
at genImportMapIterateFields (file:///Users/user/Projects/payload-project/node_modules/payload/dist/bin/generateImportMap/iterateFields.js?tsx-namespace=1742565751435:23:13)
at Object.generateImportMap (file:///Users/user/Projects/payload-project/node_modules/@payloadcms/richtext-lexical/dist/utilities/generateImportMap.js?tsx-namespace=1742565751435:48:11)
at genImportMapIterateFields (file:///Users/user/Projects/payload-project/node_modules/payload/dist/bin/generateImportMap/iterateFields.js?tsx-namespace=1742565751435:42:30)
at genImportMapIterateFields (file:///Users/user/Projects/payload-project/node_modules/payload/dist/bin/generateImportMap/iterateFields.js?tsx-namespace=1742565751435:14:13)
at genImportMapIterateFields (file:///Users/user/Projects/payload-project/node_modules/payload/dist/bin/generateImportMap/iterateFields.js?tsx-namespace=1742565751435:14:13)
at genImportMapIterateFields (file:///Users/user/Projects/payload-project/node_modules/payload/dist/bin/generateImportMap/iterateFields.js?tsx-namespace=1742565751435:23:13)
error: script "generate:importmap" exited with code 1
(base) ➜ payload-project git:(main) ✗ bun run generate:types
$ cross-env NODE_OPTIONS=--no-deprecation payload generate:types
[15:09:43] INFO: Compiling TS types for Collections and Globals...
RangeError: Maximum call stack size exceeded
at Object.outputSchema (file:///Users/user/Projects/payload-project/node_modules/@payloadcms/richtext-lexical/dist/index.js?tsx-namespace=1742566182894:670:28)
at file:///Users/user/Projects/payload-project/node_modules/payload/dist/utilities/configToJSONSchema.js?tsx-namespace=1742566182894:561:49
at Array.reduce (<anonymous>)
at fieldsToJSONSchema (file:///Users/user/Projects/payload-project/node_modules/payload/dist/utilities/configToJSONSchema.js?tsx-namespace=1742566182894:213:47)
at file:///Users/user/Projects/payload-project/node_modules/payload/dist/utilities/configToJSONSchema.js?tsx-namespace=1742566182894:236:36
at Array.reduce (<anonymous>)
at fieldsToJSONSchema (file:///Users/user/Projects/payload-project/node_modules/payload/dist/utilities/configToJSONSchema.js?tsx-namespace=1742566182894:213:47)
at file:///Users/user/Projects/payload-project/node_modules/payload/dist/utilities/configToJSONSchema.js?tsx-namespace=1742566182894:264:63
at Array.map (<anonymous>)
at file:///Users/user/Projects/payload-project/node_modules/payload/dist/utilities/configToJSONSchema.js?tsx-namespace=1742566182894:257:80
error: script "generate:types" exited with code 1
package.json:
"dependencies": {
"@marsidev/react-turnstile": "^1.1.0",
"@opennextjs/cloudflare": "^0.3.10",
"@openpanel/nextjs": "^1.0.7",
"@payloadcms/db-sqlite": "latest",
"@payloadcms/email-resend": "latest",
"@payloadcms/live-preview-react": "latest",
"@payloadcms/next": "latest",
"@payloadcms/payload-cloud": "latest",
"@payloadcms/plugin-form-builder": "latest",
"@payloadcms/plugin-nested-docs": "latest",
"@payloadcms/plugin-redirects": "latest",
"@payloadcms/plugin-search": "latest",
"@payloadcms/plugin-seo": "latest",
"@payloadcms/richtext-lexical": "^3.29.0",
"@payloadcms/storage-s3": "latest",
"@payloadcms/ui": "latest",
"@radix-ui/react-checkbox": "^1.1.3",
"@radix-ui/react-label": "^2.1.1",
"@radix-ui/react-select": "^2.1.5",
"@radix-ui/react-slot": "^1.1.1",
"@react-email/components": "^0.0.32",
"@t3-oss/env-nextjs": "^0.11.1",
"class-variance-authority": "^0.7.1",
"clsx": "^2.1.1",
"cross-env": "^7.0.3",
"embla-carousel-autoplay": "^8.5.2",
"embla-carousel-react": "^8.5.2",
"geist": "^1.3.1",
"graphql": "^16.10.0",
"jsonwebtoken": "9.0.2",
"lucide-react": "^0.378.0",
"next": "^15.2.2",
"next-sitemap": "^4.2.3",
"payload": "^3.29.0",
"payload-admin-bar": "^1.0.6",
"payload-blurhash-plugin": "^3.1.0",
"prism-react-renderer": "^2.4.1",
"react": "^19.0.0",
"react-dom": "^19.0.0",
"react-hook-form": "7.45.4",
"sharp": "0.33.5",
"tailwind-merge": "^2.6.0",
"tailwindcss-animate": "^1.0.7",
"vercel": "^41.3.2",
"zod": "^3.24.1"
},
"devDependencies": {
"@eslint/eslintrc": "^3.2.0",
"@tailwindcss/typography": "^0.5.16",
"@types/escape-html": "^1.0.4",
"@types/jsonwebtoken": "^9.0.8",
"@types/node": "22.5.4",
"@types/react": "19.0.1",
"@types/react-dom": "19.0.1",
"autoprefixer": "^10.4.20",
"copyfiles": "^2.4.1",
"eslint": "^9.19.0",
"eslint-config-next": "15.1.4",
"postcss": "^8.5.1",
"prettier": "^3.4.2",
"tailwindcss": "^3.4.17",
"typescript": "5.7.2",
"wrangler": "^3.106.0"
},
"engines": {
"node": "^18.20.2 || >=20.9.0"
}
}
payload.config.ts, with lexical part
import {
lexicalEditor,
BlocksFeature,
EXPERIMENTAL_TableFeature,
} from '@payloadcms/richtext-lexical'
...
editor: lexicalEditor({
features: ({ defaultFeatures, rootFeatures }) => [
...defaultFeatures,
EXPERIMENTAL_TableFeature(),
BlocksFeature({
blocks: [MediaBlock, Code, Content],
}),
],
}),
I have collections and blocks importing lexical as well.
i.e Media.ts in collections
import type { CollectionConfig } from 'payload'
import {
FixedToolbarFeature,
HeadingFeature,
InlineToolbarFeature,
lexicalEditor,
} from '@payloadcms/richtext-lexical'
import path from 'path'
import { fileURLToPath } from 'url'
import { anyone } from '../access/anyone'
import { authenticated } from '../access/authenticated'
const filename = fileURLToPath(import.meta.url)
const dirname = path.dirname(filename)
export const Media: CollectionConfig = {
slug: 'media',
access: {
create: authenticated,
delete: authenticated,
read: anyone,
update: authenticated,
},
fields: [
{
name: 'alt',
type: 'text',
},
{
name: 'caption',
type: 'richText',
editor: lexicalEditor({
features: ({ rootFeatures }) => {
return [...rootFeatures, FixedToolbarFeature(), InlineToolbarFeature()]
},
}),
},
{
name: 'contentPosition',
type: 'select',
defaultValue: 'right',
options: [
{
label: 'Content Left',
value: 'left',
},
{
label: 'Content Right',
value: 'right',
},
{
label: 'Content Bottom',
value: 'bottom',
},
{
label: 'Banner Style',
value: 'banner',
},
],
},
{
name: 'isOrderPage',
type: 'checkbox',
defaultValue: false,
label: 'Order Page',
},
{
name: 'content',
type: 'richText',
editor: lexicalEditor({
features: ({ rootFeatures }) => {
return [
...rootFeatures,
HeadingFeature({ enabledHeadingSizes: ['h1', 'h2', 'h3', 'h4'] }),
FixedToolbarFeature(),
InlineToolbarFeature(),
]
},
}),
},
],
upload: {
staticDir: path.resolve(dirname, '../../public/media'),
adminThumbnail: 'thumbnail',
imageSizes: [
{
name: 'thumbnail',
width: 300,
},
{
name: 'square',
width: 500,
height: 500,
},
{
name: 'small',
width: 600,
},
{
name: 'medium',
width: 900,
},
{
name: 'large',
width: 1400,
},
{
name: 'xlarge',
width: 1920,
},
],
},
}
...
### Link to the code that reproduces this issue
-
### Reproduction Steps
Nothing has changes aside from version number, so reproduction steps are just being on the latest payload.
### Which area(s) are affected? (Select all that apply)
area: core
### Environment Info
```text
Binaries:
Node: 23.10.0
npm: 8.11.0
Yarn: 1.22.22
pnpm: 9.14.2
Relevant Packages:
payload: 3.29.0
next: 15.2.3
@payloadcms/email-nodemailer: 3.29.0
@payloadcms/email-resend: 3.29.0
@payloadcms/graphql: 3.29.0
@payloadcms/live-preview: 3.29.0
@payloadcms/live-preview-react: 3.29.0
@payloadcms/next/utilities: 3.29.0
@payloadcms/payload-cloud: 3.29.0
@payloadcms/plugin-cloud-storage: 3.29.0
@payloadcms/plugin-form-builder: 3.29.0
@payloadcms/plugin-nested-docs: 3.29.0
@payloadcms/plugin-redirects: 3.29.0
@payloadcms/plugin-search: 3.29.0
@payloadcms/plugin-seo: 3.29.0
@payloadcms/richtext-lexical: 3.29.0
@payloadcms/storage-s3: 3.29.0
@payloadcms/translations: 3.29.0
@payloadcms/ui/shared: 3.29.0
react: 19.0.0
react-dom: 19.0.0
Operating System:
Platform: darwin
Arch: arm64
Version: Darwin Kernel Version 24.3.0: Thu Jan 2 20:24:22 PST 2025; root:xnu-11215.81.4~3/RELEASE_ARM64_T6041
Available memory (MB): 65536
Available CPU cores: 16
Please add a reproduction in order for us to be able to investigate.
Depending on the quality of reproduction steps, this issue may be closed if no reproduction is provided.
Why was this issue marked with the invalid-reproduction label?
To be able to investigate, we need access to a reproduction to identify what triggered the issue. We prefer a link to a public GitHub repository created with create-payload-app@latest -t blank or a forked/branched version of this repository with tests added (more info in the reproduction-guide).
To make sure the issue is resolved as quickly as possible, please make sure that the reproduction is as minimal as possible. This means that you should remove unnecessary code, files, and dependencies that do not contribute to the issue. Ensure your reproduction does not depend on secrets, 3rd party registries, private dependencies, or any other data that cannot be made public. Avoid a reproduction including a whole monorepo (unless relevant to the issue). The easier it is to reproduce the issue, the quicker we can help.
Please test your reproduction against the latest version of Payload to make sure your issue has not already been fixed.
I added a link, why was it still marked?
Ensure the link is pointing to a codebase that is accessible (e.g. not a private repository). "example.com", "n/a", "will add later", etc. are not acceptable links -- we need to see a public codebase. See the above section for accepted links.
Useful Resources
The error you're encountering is related to the @payloadcms/storage-s3 plugin:
key: '@payloadcms/storage-s3/client#S3ClientUploadHandler'
One thing I noticed from what you shared is that you're mixing both "latest" and a specific version string:
"@payloadcms/plugin-seo": "latest",
"@payloadcms/richtext-lexical": "^3.29.0",
So I wonder if there's something old hanging around in your installation. I'd update your package.json to be consistent with whatever versioning you prefer.
Then remove your lock file, node_modules but also your .next folder as well.
Reinstall dependencies to ensure a clean and consistent state.
Run payload generate:types and check if it works first.
Then, try payload generate:importmap again.
If the error relating to S3 persists, update your payload.config.ts to comment out the S3 plugin in your plugins list and see if the error goes away. Then you know it's an issue with the plugin and you're in a clean state (with everything built with the same version).
Hope this helps!
After you've verified that you're using all the same versions of Payload, I would create a minimum reproduction that can be used to troubleshoot and identify the issue.
You may have circular function calls in your code guessing from the error.
I'm seeing a similar issue using version 3.31.0 after upgrading from 3.17.1. I tried running generate:importmap, but there was no difference. The importMap seems to be very problematic and somewhat neglected. I raised a slightly unrelated issue related to importMap back on December 2024, but unfortunately, it seems the core team is focusing on other parts of the CMS. 🫠😕
getFromImportMap: PayloadComponent not found in importMap {
key: '@payloadcms/storage-vercel-blob/client#VercelBlobClientUploadHandler',
PayloadComponent: {
clientProps: {
collectionSlug: 'media',
enabled: false,
extra: [Object],
prefix: undefined,
serverHandlerPath: '/vercel-blob-client-upload-route'
},
path: '@payloadcms/storage-vercel-blob/client#VercelBlobClientUploadHandler'
},
schemaPath: ''
} You may need to run the `payload generate:importmap` command to generate the importMap ahead of runtime.
Thanks @BlainMaguire / @DanRibbens, that was really just cosmetic, I've always been on the same version across all payload packages, but since then I've been forcing versions.
Tried commenting out S3 as well, but the stack error is still present in every version past 3.26.0.
Will try to get a repro out within the next few days.
I had the same issue as @edtorba in my project updated to payload 3.31.0. The problem was in the way the vercelBlobStorage plugin was conditionally initialized in the payload config file. Once I removed the condition that appends the plugin to the plugins array and used the enabled prop instead, the importMap was actually changed after running payload generate:importMap again:
@@ -127,16 +127,15 @@ export default buildConfig({
globals: [Header, Footer, Settings],
plugins: [
...plugins,
- ...(process.env.BLOB_READ_WRITE_TOKEN
- ? [
+ ...[
vercelBlobStorage({
+ enabled: !!process.env.BLOB_READ_WRITE_TOKEN,
collections: {
[Media.slug]: true,
},
token: process.env.BLOB_READ_WRITE_TOKEN || '',
}),
- ]
- : []),
+ ],
],
I believe it's the same configuration issue as with S3 storage plugin, see #11438
@tomasbarej legend, that fixed my problem
Hey, I have similar problem to @edtorba had, but I don't use any plugins conditionally. After updating to v3.31.0 i can't generate importmap and types.
> [email protected] generate:types /Volumes/External/Documents/Projects/payload-ecommerce
> cross-env NODE_OPTIONS=--no-deprecation payload generate:types
[09:38:25] INFO: Compiling TS types for Collections and Globals...
/Volumes/External/Documents/Projects/payload-ecommerce/node_modules/.pnpm/[email protected][email protected][email protected]/node_modules/payload/src/utilities/flattenAllFields.ts:38
for (const field of fields) {
^
RangeError: Maximum call stack size exceeded
at Array.values (<anonymous>)
at flattenAllFields (/Volumes/External/Documents/Projects/payload-ecommerce/node_modules/.pnpm/[email protected][email protected][email protected]/node_modules/payload/src/utilities/flattenAllFields.ts:38:23)
at flattenAllFields (/Volumes/External/Documents/Projects/payload-ecommerce/node_modules/.pnpm/[email protected][email protected][email protected]/node_modules/payload/src/utilities/flattenAllFields.ts:42:50)
at block (/Volumes/External/Documents/Projects/payload-ecommerce/node_modules/.pnpm/@[email protected]_@[email protected][email protected]_re_7a559f66345463abcdb93368f27f7434/node_modules/@payloadcms/richtext-lexical/src/features/blocks/server/index.ts:101:36)
at Array.map (<anonymous>)
at modifyOutputSchema (/Volumes/External/Documents/Projects/payload-ecommerce/node_modules/.pnpm/@[email protected]_@[email protected][email protected]_re_7a559f66345463abcdb93368f27f7434/node_modules/@payloadcms/richtext-lexical/src/features/blocks/server/index.ts:98:36)
at outputSchema (/Volumes/External/Documents/Projects/payload-ecommerce/node_modules/.pnpm/@[email protected]_@[email protected][email protected]_re_7a559f66345463abcdb93368f27f7434/node_modules/@payloadcms/richtext-lexical/src/index.ts:843:26)
at <anonymous> (/Volumes/External/Documents/Projects/payload-ecommerce/node_modules/.pnpm/[email protected][email protected][email protected]/node_modules/payload/src/utilities/configToJSONSchema.ts:612:33)
at Array.reduce (<anonymous>)
at fieldsToJSONSchema (/Volumes/External/Documents/Projects/payload-ecommerce/node_modules/.pnpm/[email protected][email protected][email protected]/node_modules/payload/src/utilities/configToJSONSchema.ts:259:14)
generate:importmap /Volumes/External/Documents/Projects/payload-ecommerce
> cross-env NODE_OPTIONS=--no-deprecation payload generate:importmap
Generating import map
/Volumes/External/Documents/Projects/payload-ecommerce/node_modules/.pnpm/[email protected][email protected][email protected]/node_modules/payload/src/bin/generateImportMap/index.ts:72
const addToImportMap: AddToImportMap = (payloadComponent) => {
^
RangeError: Maximum call stack size exceeded
at addToImportMap (/Volumes/External/Documents/Projects/payload-ecommerce/node_modules/.pnpm/[email protected][email protected][email protected]/node_modules/payload/src/bin/generateImportMap/index.ts:72:42)
at Object.generateImportMap (/Volumes/External/Documents/Projects/payload-ecommerce/node_modules/.pnpm/@[email protected]_@[email protected][email protected]_re_7a559f66345463abcdb93368f27f7434/node_modules/@payloadcms/richtext-lexical/src/utilities/generateImportMap.tsx:11:5)
at genImportMapIterateFields (/Volumes/External/Documents/Projects/payload-ecommerce/node_modules/.pnpm/[email protected][email protected][email protected]/node_modules/payload/src/bin/generateImportMap/iterateFields.ts:70:22)
at genImportMapIterateFields (/Volumes/External/Documents/Projects/payload-ecommerce/node_modules/.pnpm/[email protected][email protected][email protected]/node_modules/payload/src/bin/generateImportMap/iterateFields.ts:37:7)
at genImportMapIterateFields (/Volumes/External/Documents/Projects/payload-ecommerce/node_modules/.pnpm/[email protected][email protected][email protected]/node_modules/payload/src/bin/generateImportMap/iterateFields.ts:46:7)
at Object.generateImportMap (/Volumes/External/Documents/Projects/payload-ecommerce/node_modules/.pnpm/@[email protected]_@[email protected][email protected]_re_7a559f66345463abcdb93368f27f7434/node_modules/@payloadcms/richtext-lexical/src/utilities/generateImportMap.tsx:54:13)
at genImportMapIterateFields (/Volumes/External/Documents/Projects/payload-ecommerce/node_modules/.pnpm/[email protected][email protected][email protected]/node_modules/payload/src/bin/generateImportMap/iterateFields.ts:70:22)
at genImportMapIterateFields (/Volumes/External/Documents/Projects/payload-ecommerce/node_modules/.pnpm/[email protected][email protected][email protected]/node_modules/payload/src/bin/generateImportMap/iterateFields.ts:37:7)
at genImportMapIterateFields (/Volumes/External/Documents/Projects/payload-ecommerce/node_modules/.pnpm/[email protected][email protected][email protected]/node_modules/payload/src/bin/generateImportMap/iterateFields.ts:46:7)
at Object.generateImportMap (/Volumes/External/Documents/Projects/payload-ecommerce/node_modules/.pnpm/@[email protected]_@[email protected][email protected]_re_7a559f66345463abcdb93368f27f7434/node_modules/@payloadcms/richtext-lexical/src/utilities/generateImportMap.tsx:54:13)
Node.js v22.14.0
I've tried to update on 2 different projects and both had the same issue, no idea what is causing this.
I'm also having a ton of issues with this, freshly generated project. Anyone know the last stable version because this seems to have been a problem for a while?
Or just anything that would get me unstuck to just go to production?
Everything was fine until I added s3storage then everything went to heck.
S3 config
plugins: [
payloadCloudPlugin(),
s3Storage({
collections: {
media: true,
},
config: {
endpoint: process.env.S3_ENDPOINT_URL,
region: process.env.S3_REGION,
credentials: {
accessKeyId: process.env.S3_ACCESS_KEY_ID || '',
secretAccessKey: process.env.S3_SECRET_ACCESS_KEY || '',
},
forcePathStyle: true,
},
bucket: process.env.S3_BUCKET_NAME || '',
}),
],
Runtime error
website | getFromImportMap: PayloadComponent not found in importMap {
website | key: "@payloadcms/storage-s3/client#S3ClientUploadHandler",
website | PayloadComponent: {
website | clientProps: {
website | collectionSlug: "media",
website | enabled: false,
website | extra: undefined,
website | prefix: undefined,
website | serverHandlerPath: "/storage-s3-generate-signed-url",
website | },
website | path: "@payloadcms/storage-s3/client#S3ClientUploadHandler",
website | },
website | schemaPath: "",
website | } You may need to run the `payload generate:importmap` command to generate the importMap ahead of runtime.
payload generate:importmap output
$ payload generate:importmap
node:internal/process/promises:394
triggerUncaughtException(err, true /* fromPromise */);
^
Error [ERR_MODULE_NOT_FOUND]: Cannot find module '/Users/nicolasdabreo/dev/websites/thetowerarray.com/src/collections/Users' imported from /Users/nicolasdabreo/dev/websites/thetowerarray.com/src/payload.config.ts
at finalizeResolution (node:internal/modules/esm/resolve:275:11)
at moduleResolve (node:internal/modules/esm/resolve:860:10)
at defaultResolve (node:internal/modules/esm/resolve:984:11)
at nextResolve (node:internal/modules/esm/hooks:748:28)
at resolve (file:///Users/nicolasdabreo/dev/websites/thetowerarray.com/node_modules/.pnpm/[email protected]/node_modules/tsx/dist/esm/index.mjs?1743447101392:2:4365)
at nextResolve (node:internal/modules/esm/hooks:748:28)
at Hooks.resolve (node:internal/modules/esm/hooks:240:30)
at handleMessage (node:internal/modules/esm/worker:199:24)
at Immediate.checkForMessages (node:internal/modules/esm/worker:141:28)
at process.processImmediate (node:internal/timers:511:21) {
code: 'ERR_MODULE_NOT_FOUND',
url: 'file:///Users/nicolasdabreo/dev/websites/thetowerarray.com/src/collections/Users'
}
Node.js v23.6.0
I cannot stress this enough, I have made zero changes to the generated codebase outside of adding the s3storage package and adding this plugin config.
same problem but without any plugins
@nicolasdabreo until it's fixed, you can use 3.26.0, that's the version I defined in my original post after testing where it breaks.
Same problem after adding @payloadcms/storage-s3 with 3.34.0.
getFromImportMap: PayloadComponent not found in importMap {
key: '@payloadcms/storage-s3/client#S3ClientUploadHandler',
PayloadComponent: {
clientProps: {
collectionSlug: 'media',
enabled: false,
extra: undefined,
prefix: undefined,
serverHandlerPath: '/storage-s3-generate-signed-url'
},
path: '@payloadcms/storage-s3/client#S3ClientUploadHandler'
},
schemaPath: ''
} You may need to run the `payload generate:importmap` command to generate the importMap ahead of runtime.
Commenting out the s3Storage plugin returns everything to normal.
Downgraded just the @payloadcms/storage-s3 package to 3.26.0 then back to 3.34.0 and magically it is working. I realize that is probably not helpful.
I did find the importMap.js in the `app/(payload)/admin/importMap.js and it looks like it has it:
import { RscEntryLexicalCell as RscEntryLexicalCell_44fe37237e0ebf4470c9990d8cb7b07e } from '@payloadcms/richtext-lexical/rsc'
import { RscEntryLexicalField as RscEntryLexicalField_44fe37237e0ebf4470c9990d8cb7b07e } from '@payloadcms/richtext-lexical/rsc'
import { LexicalDiffComponent as LexicalDiffComponent_44fe37237e0ebf4470c9990d8cb7b07e } from '@payloadcms/richtext-lexical/rsc'
import { HeadingFeatureClient as HeadingFeatureClient_e70f5e05f09f93e00b997edb1ef0c864 } from '@payloadcms/richtext-lexical/client'
import { BoldFeatureClient as BoldFeatureClient_e70f5e05f09f93e00b997edb1ef0c864 } from '@payloadcms/richtext-lexical/client'
import { ItalicFeatureClient as ItalicFeatureClient_e70f5e05f09f93e00b997edb1ef0c864 } from '@payloadcms/richtext-lexical/client'
import { LinkFeatureClient as LinkFeatureClient_e70f5e05f09f93e00b997edb1ef0c864 } from '@payloadcms/richtext-lexical/client'
import { FixedToolbarFeatureClient as FixedToolbarFeatureClient_e70f5e05f09f93e00b997edb1ef0c864 } from '@payloadcms/richtext-lexical/client'
import { InlineToolbarFeatureClient as InlineToolbarFeatureClient_e70f5e05f09f93e00b997edb1ef0c864 } from '@payloadcms/richtext-lexical/client'
import { S3ClientUploadHandler as S3ClientUploadHandler_f97aa6c64367fa259c5bc0567239ef24 } from '@payloadcms/storage-s3/client'
export const importMap = {
"@payloadcms/richtext-lexical/rsc#RscEntryLexicalCell": RscEntryLexicalCell_44fe37237e0ebf4470c9990d8cb7b07e,
"@payloadcms/richtext-lexical/rsc#RscEntryLexicalField": RscEntryLexicalField_44fe37237e0ebf4470c9990d8cb7b07e,
"@payloadcms/richtext-lexical/rsc#LexicalDiffComponent": LexicalDiffComponent_44fe37237e0ebf4470c9990d8cb7b07e,
"@payloadcms/richtext-lexical/client#HeadingFeatureClient": HeadingFeatureClient_e70f5e05f09f93e00b997edb1ef0c864,
"@payloadcms/richtext-lexical/client#BoldFeatureClient": BoldFeatureClient_e70f5e05f09f93e00b997edb1ef0c864,
"@payloadcms/richtext-lexical/client#ItalicFeatureClient": ItalicFeatureClient_e70f5e05f09f93e00b997edb1ef0c864,
"@payloadcms/richtext-lexical/client#LinkFeatureClient": LinkFeatureClient_e70f5e05f09f93e00b997edb1ef0c864,
"@payloadcms/richtext-lexical/client#FixedToolbarFeatureClient": FixedToolbarFeatureClient_e70f5e05f09f93e00b997edb1ef0c864,
"@payloadcms/richtext-lexical/client#InlineToolbarFeatureClient": InlineToolbarFeatureClient_e70f5e05f09f93e00b997edb1ef0c864,
"@payloadcms/storage-s3/client#S3ClientUploadHandler": S3ClientUploadHandler_f97aa6c64367fa259c5bc0567239ef24
}
@DanRibbens I also didn't have the s3 plugin, but managed to get rid of the error by commenting out the links feature from my lexical config.
Here's a repo reproducing the error: https://github.com/christopherpickering/payload-3-max-callstack-bug/commit/05f37a1c0b269ca3af1ef79bc519960313285d90
Any tips for resolving it are appreciated as I don't want to stay on vacation 3.26 :)
Edited to show the potential problem-
Commenting out "Banner" from the defaultLexical.ts blocks feature removes the error. I realized that banner also had a lexical component. So it seems like having lexical editors nested in lexical blocks isn't going to work. It seems to be related to https://github.com/payloadcms/payload/issues/5101.
Just FYI @DanRibbens , this issue still exists with the latest release.
@DanRibbens I also didn't have the s3 plugin, but managed to get rid of the error by commenting out the links feature from my lexical config.
Here's a repo reproducing the error: christopherpickering/payload-3-max-callstack-bug@05f37a1
Any tips for resolving it are appreciated as I don't want to stay on vacation 3.26 :)
Edited to show the potential problem-
Commenting out "Banner" from the
defaultLexical.tsblocks feature removes the error. I realized that banner also had a lexical component. So it seems like having lexical editors nested in lexical blocks isn't going to work. It seems to be related to #5101.
can confirm that this is the issue. Cant have another block with lexical inside lexical (weird it worked on 3.2)
and to @christopherpickering, thank you like 3000 <3
I had the same issue as @edtorba in my project updated to payload 3.31.0. The problem was in the way the vercelBlobStorage plugin was conditionally initialized in the payload config file. Once I removed the condition that appends the plugin to the plugins array and used the enabled prop instead, the importMap was actually changed after running
payload generate:importMapagain:@@ -127,16 +127,15 @@ export default buildConfig({ globals: [Header, Footer, Settings], plugins: [ ...plugins,
- ...(process.env.BLOB_READ_WRITE_TOKEN
? [
- ...[ vercelBlobStorage({
enabled: !!process.env.BLOB_READ_WRITE_TOKEN, collections: { [Media.slug]: true, }, token: process.env.BLOB_READ_WRITE_TOKEN || '', }),
]: []),
], I believe it's the same configuration issue as with S3 storage plugin, see #11438],
This has saved me HOURS of work! Thank you!
(I can't believe this even happens?!)
I'm seeing the same issue as @christopherpickering and it does seem to be related to nested Lexical editors. I have loads of inline blocks that use RichText, if I comment all of them out, I can generate importmap with no errors. Uncomment any of them and it errors with call stack size. Even if I completely strip out all of the features it still doesnt generate without erroring.
I am on 3.56.0
@Rhys97W could you provide a minimal reproduction that uses lexical inline blocks and causes an importmap generation error?