Skip to content

useUploadHandlers must be used within UploadHandlersProvider. @payloadcms/storage-s3 #11717

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
fahadsaleemfd opened this issue Mar 15, 2025 · 17 comments
Labels
invalid-reproduction status: needs-triage Possible bug which hasn't been reproduced yet v2

Comments

@fahadsaleemfd
Copy link

Link to reproduction

No response

Describe the Bug

After a few days, nothing changes in the code that causes this error, but on a new instance on payload cloud s3, everything is operating as it should.
Visit this link and please check the issue
https://documentation-cms.payloadcms.app/admin/login

I have tried @payloadcms/storage-s3 different versions of this plugin.
Without using this plugin I can see my payload UI.

To Reproduce

After a few days just triggered a redeploy, nothing changes in the code that causes this error, but on a new instance on payload cloud s3, everything is operating as it should.

Payload Version

latest

Adapters and Plugins

@payloadcms/storage-s3

@fahadsaleemfd fahadsaleemfd added status: needs-triage Possible bug which hasn't been reproduced yet v2 labels Mar 15, 2025
@JarrodMFlesch
Copy link
Contributor

Are all of your payload plugins on the latest version? 3.28.1? What does your package.json file say?

@fahadsaleemfd
Copy link
Author

Image this is package.json file

@fahadsaleemfd
Copy link
Author

I uninstalled the s3 plugin and deleted the associated code, yet I'm still encountering this problem on one instance. However, the newly created instance is functioning properly.

@okonet
Copy link

okonet commented Mar 20, 2025

I have the same problem. I'm just following the setup guide.

    "@payloadcms/db-mongodb": "^3.28.1",
    "@payloadcms/next": "^3.28.1",
    "@payloadcms/payload-cloud": "^3.28.1",
    "@payloadcms/richtext-lexical": "^3.28.1",
    "@payloadcms/storage-vercel-blob": "^3.28.1",

My config:

import { mongooseAdapter } from "@payloadcms/db-mongodb"
import { lexicalEditor } from "@payloadcms/richtext-lexical"
import { vercelBlobStorage } from "@payloadcms/storage-vercel-blob"
import path from "path"
import { buildConfig } from "payload"
import { fileURLToPath } from "url"
import sharp from "sharp"

import { Users } from "./collections/Users"
import { Media } from "./collections/Media"

const filename = fileURLToPath(import.meta.url)
const dirname = path.dirname(filename)

export default buildConfig({
  admin: {
    user: Users.slug,
    importMap: {
      baseDir: path.resolve(dirname),
    },
  },
  collections: [Users, Media],
  editor: lexicalEditor(),
  secret: process.env.PAYLOAD_SECRET || "",
  typescript: {
    outputFile: path.resolve(dirname, "payload-types.ts"),
  },
  db: mongooseAdapter({
    url: process.env.MONGODB_URI || "",
  }),
  sharp,
  plugins: [
    vercelBlobStorage({
      collections: {
        media: true,
      },
      token: process.env.BLOB_READ_WRITE_TOKEN || "",
    }),
  ],
})

I'm also seeing TS errors in the payload.config:

TS2322: Type
import("/ Users/ okonet/ Projects/ danielamulle. at/ node_modules/ payload/ dist/ config/ types").Plugin
is not assignable to type
import("/ Users/ okonet/ Projects/ danielamulle. at/ apps/ web/ node_modules/ payload/ dist/ config/ types").Plugin
Types of parameters config and config are incompatible.
Type 'import("/ Users/ okonet/ Projects/ danielamulle. at/ apps/ web/ node_modules/ payload/ dist/ config/ types").Config' is not assignable to type 'import("/ Users/ okonet/ Projects/ danielamulle. at/ node_modules/ payload/ dist/ config/ types").Config'.
Types of property admin are incompatible.
Type '{ autoLogin?: false | { email?: string | undefined; password?: string | undefined; prefillOnly?: boolean | undefined; username?: string | undefined; } | undefined; avatar?: "default" | "gravatar" | { ...; } | undefined; ... 12 more ...; user?: string | undefined; } | undefined' is not assignable to type '{ autoLogin?: false | { email?: string | undefined; password?: string | undefined; prefillOnly?: boolean | undefined; username?: string | undefined; } | undefined; avatar?: "default" | "gravatar" | { ...; } | undefined; ... 12 more ...; user?: string | undefined; } | undefined'. Two different types with this name exist, but they are unrelated.
Type
{   autoLogin?: false | {     email?: string | undefined;     password?: string | undefined;     prefillOnly?: boolean | undefined;     username?: string | undefined;   } | undefined;   avatar?: "default" | "gravatar" | { ...; } | undefined;   ... 12 more ...;   user?: string | undefined; }
is not assignable to type
{   autoLogin?: false | {     email?: string | undefined;     password?: string | undefined;     prefillOnly?: boolean | undefined;     username?: string | undefined;   } | undefined;   avatar?: "default" | "gravatar" | { ...; } | undefined;   ... 12 more ...;   user?: string | undefined; }
. Two different types with this name exist, but they are unrelated.
Types of property importMap are incompatible.
Type '{ autoGenerate?: boolean | undefined; baseDir?: string | undefined; generators?: ((props: { addToImportMap: import("/ Users/ okonet/ Projects/ danielamulle. at/ apps/ web/ node_modules/ payload/ dist/ bin/ generateImportMap/ index").AddToImportMap; baseDir: string; config: import("/ Users/ okonet/ Projects/ danielamulle. at/ apps/ web/...' is not assignable to type '{ autoGenerate?: boolean | undefined; baseDir?: string | undefined; generators?: ((props: { addToImportMap: import("/ Users/ okonet/ Projects/ danielamulle. at/ node_modules/ payload/ dist/ bin/ generateImportMap/ index").AddToImportMap; baseDir: string; config: import("/ Users/ okonet/ Projects/ danielamulle. at/ node_modules/ paylo...'.
Type '{ autoGenerate?: boolean | undefined; baseDir?: string | undefined; generators?: ((props: { addToImportMap: import("/ Users/ okonet/ Projects/ danielamulle. at/ apps/ web/ node_modules/ payload/ dist/ bin/ generateImportMap/ index").AddToImportMap; baseDir: string; config: import("/ Users/ okonet/ Projects/ danielamulle. at/ apps/ web/...' is not assignable to type '{ autoGenerate?: boolean | undefined; baseDir?: string | undefined; generators?: ((props: { addToImportMap: import("/ Users/ okonet/ Projects/ danielamulle. at/ node_modules/ payload/ dist/ bin/ generateImportMap/ index").AddToImportMap; baseDir: string; config: import("/ Users/ okonet/ Projects/ danielamulle. at/ node_modules/ paylo...'.
Types of property generators are incompatible.
Type '((props: { addToImportMap: import("/ Users/ okonet/ Projects/ danielamulle. at/ apps/ web/ node_modules/ payload/ dist/ bin/ generateImportMap/ index").AddToImportMap; baseDir: string; config: import("/ Users/ okonet/ Projects/ danielamulle. at/ apps/ web/ node_modules/ payload/ dist/ config/ types").SanitizedConfig; importMap: import("/ Use...' is not assignable to type '((props: { addToImportMap: import("/ Users/ okonet/ Projects/ danielamulle. at/ node_modules/ payload/ dist/ bin/ generateImportMap/ index").AddToImportMap; baseDir: string; config: import("/ Users/ okonet/ Projects/ danielamulle. at/ node_modules/ payload/ dist/ config/ types").SanitizedConfig; importMap: import("/ Users/ okonet/ Projects...'.
Type '((props: { addToImportMap: import("/ Users/ okonet/ Projects/ danielamulle. at/ apps/ web/ node_modules/ payload/ dist/ bin/ generateImportMap/ index").AddToImportMap; baseDir: string; config: import("/ Users/ okonet/ Projects/ danielamulle. at/ apps/ web/ node_modules/ payload/ dist/ config/ types").SanitizedConfig; importMap: import("/ Use...' is not assignable to type '((props: { addToImportMap: import("/ Users/ okonet/ Projects/ danielamulle. at/ node_modules/ payload/ dist/ bin/ generateImportMap/ index").AddToImportMap; baseDir: string; config: import("/ Users/ okonet/ Projects/ danielamulle. at/ node_modules/ payload/ dist/ config/ types").SanitizedConfig; importMap: import("/ Users/ okonet/ Projects...'.
Type '(props: { addToImportMap: import("/ Users/ okonet/ Projects/ danielamulle. at/ apps/ web/ node_modules/ payload/ dist/ bin/ generateImportMap/ index").AddToImportMap; baseDir: string; config: import("/ Users/ okonet/ Projects/ danielamulle. at/ apps/ web/ node_modules/ payload/ dist/ config/ types").SanitizedConfig; importMap: import("/ User...' is not assignable to type '(props: { addToImportMap: import("/ Users/ okonet/ Projects/ danielamulle. at/ node_modules/ payload/ dist/ bin/ generateImportMap/ index").AddToImportMap; baseDir: string; config: import("/ Users/ okonet/ Projects/ danielamulle. at/ node_modules/ payload/ dist/ config/ types").SanitizedConfig; importMap: import("/ Users/ okonet/ Projects/...'.
Types of parameters props and props are incompatible.
Type '{ addToImportMap: import("/ Users/ okonet/ Projects/ danielamulle. at/ node_modules/ payload/ dist/ bin/ generateImportMap/ index").AddToImportMap; baseDir: string; config: import("/ Users/ okonet/ Projects/ danielamulle. at/ node_modules/ payload/ dist/ config/ types").SanitizedConfig; importMap: import("/ Users/ okonet/ Projects/ danielam...' is not assignable to type '{ addToImportMap: import("/ Users/ okonet/ Projects/ danielamulle. at/ apps/ web/ node_modules/ payload/ dist/ bin/ generateImportMap/ index").AddToImportMap; baseDir: string; config: import("/ Users/ okonet/ Projects/ danielamulle. at/ apps/ web/ node_modules/ payload/ dist/ config/ types").SanitizedConfig; importMap: import("/ Users/ okonet...'.
Types of property config are incompatible.
Type 'import("/ Users/ okonet/ Projects/ danielamulle. at/ node_modules/ payload/ dist/ config/ types").SanitizedConfig' is not assignable to type 'import("/ Users/ okonet/ Projects/ danielamulle. at/ apps/ web/ node_modules/ payload/ dist/ config/ types").SanitizedConfig'.
Type SanitizedConfig is not assignable to type
{ admin: { timezones: SanitizedTimezoneConfig; } & { autoLogin: false | { email: string; password: string; prefillOnly: boolean; username: string; }; avatar: "default" | "gravatar" | { ...; };  ... 12 more ...; user: string; };  ... 9 more ...; upload: { ...; } & ... 1 more ... & Partial<...>; }
Types of property admin are incompatible.
Type
{   timezones: SanitizedTimezoneConfig; } & {   autoLogin: false | {     email: string;     password: string;     prefillOnly: boolean;     username: string;   };   avatar: "default" | "gravatar" | { ...; };   ... 12 more ...;   user: string; }
is not assignable to type
{   timezones: SanitizedTimezoneConfig; } & {   autoLogin: false | {     email: string;     password: string;     prefillOnly: boolean;     username: string;   };   avatar: "default" | "gravatar" | { ...; };   ... 12 more ...;   user: string; }
. Two different types with this name exist, but they are unrelated.
Type '{ timezones: SanitizedTimezoneConfig; } & { autoLogin: false | { email: string; password: string; prefillOnly: boolean; username: string; }; avatar: "default" | "gravatar" | { ...; }; ... 12 more ...; user: string; }' is not assignable to type '{ autoLogin: false | { email: string; password: string; prefillOnly: boolean; username: string; }; avatar: "default" | "gravatar" | { Component: string | false | { clientProps: object | { ...; }; exportName: string; path: string; serverProps: object | { ...; }; }; }; ... 12 more ...; user: string; }'.
The types of importMap.generators are incompatible between these types.
Type '((props: { addToImportMap: import("/ Users/ okonet/ Projects/ danielamulle. at/ node_modules/ payload/ dist/ bin/ generateImportMap/ index").AddToImportMap; baseDir: string; config: import("/ Users/ okonet/ Projects/ danielamulle. at/ node_modules/ payload/ dist/ config/ types").SanitizedConfig; importMap: import("/ Users/ okonet/ Projects...' is not assignable to type '((props: { addToImportMap: import("/ Users/ okonet/ Projects/ danielamulle. at/ apps/ web/ node_modules/ payload/ dist/ bin/ generateImportMap/ index").AddToImportMap; baseDir: string; config: import("/ Users/ okonet/ Projects/ danielamulle. at/ apps/ web/ node_modules/ payload/ dist/ config/ types").SanitizedConfig; importMap: import("/ Use...'.
Type '(props: { addToImportMap: import("/ Users/ okonet/ Projects/ danielamulle. at/ node_modules/ payload/ dist/ bin/ generateImportMap/ index").AddToImportMap; baseDir: string; config: import("/ Users/ okonet/ Projects/ danielamulle. at/ node_modules/ payload/ dist/ config/ types").SanitizedConfig; importMap: import("/ Users/ okonet/ Projects/...' is not assignable to type '(props: { addToImportMap: import("/ Users/ okonet/ Projects/ danielamulle. at/ apps/ web/ node_modules/ payload/ dist/ bin/ generateImportMap/ index").AddToImportMap; baseDir: string; config: import("/ Users/ okonet/ Projects/ danielamulle. at/ apps/ web/ node_modules/ payload/ dist/ config/ types").SanitizedConfig; importMap: import("/ User...'.
Types of parameters props and props are incompatible.
Type '{ addToImportMap: import("/ Users/ okonet/ Projects/ danielamulle. at/ apps/ web/ node_modules/ payload/ dist/ bin/ generateImportMap/ index").AddToImportMap; baseDir: string; config: import("/ Users/ okonet/ Projects/ danielamulle. at/ apps/ web/ node_modules/ payload/ dist/ config/ types").SanitizedConfig; importMap: import("/ Users/ okonet...' is not assignable to type '{ addToImportMap: import("/ Users/ okonet/ Projects/ danielamulle. at/ node_modules/ payload/ dist/ bin/ generateImportMap/ index").AddToImportMap; baseDir: string; config: import("/ Users/ okonet/ Projects/ danielamulle. at/ node_modules/ payload/ dist/ config/ types").SanitizedConfig; importMap: import("/ Users/ okonet/ Projects/ danielam...'.
Types of property config are incompatible.
Type 'import("/ Users/ okonet/ Projects/ danielamulle. at/ apps/ web/ node_modules/ payload/ dist/ config/ types").SanitizedConfig' is not assignable to type 'import("/ Users/ okonet/ Projects/ danielamulle. at/ node_modules/ payload/ dist/ config/ types").SanitizedConfig'.
Type SanitizedConfig is not assignable to type
{ admin: { timezones: SanitizedTimezoneConfig; } & { autoLogin: false | { email: string; password: string; prefillOnly: boolean; username: string; }; avatar: "default" | "gravatar" | { ...; };  ... 12 more ...; user: string; };  ... 9 more ...; upload: { ...; } & ... 1 more ... & Partial<...>; }
Types of property admin are incompatible.
Type
{   timezones: SanitizedTimezoneConfig; } & {   autoLogin: false | {     email: string;     password: string;     prefillOnly: boolean;     username: string;   };   avatar: "default" | "gravatar" | { ...; };   ... 12 more ...;   user: string; }
is not assignable to type
{   timezones: SanitizedTimezoneConfig; } & {   autoLogin: false | {     email: string;     password: string;     prefillOnly: boolean;     username: string;   };   avatar: "default" | "gravatar" | { ...; };   ... 12 more ...;   user: string; }
. Two different types with this name exist, but they are unrelated.
Type '{ timezones: SanitizedTimezoneConfig; } & { autoLogin: false | { email: string; password: string; prefillOnly: boolean; username: string; }; avatar: "default" | "gravatar" | { ...; }; ... 12 more ...; user: string; }' is not assignable to type '{ autoLogin: false | { email: string; password: string; prefillOnly: boolean; username: string; }; avatar: "default" | "gravatar" | { Component: string | false | { clientProps: object | { ...; }; exportName: string; path: string; serverProps: object | { ...; }; }; }; ... 12 more ...; user: string; }'.
The types of importMap.generators are incompatible between these types.
Type '((props: { addToImportMap: import("/ Users/ okonet/ Projects/ danielamulle. at/ apps/ web/ node_modules/ payload/ dist/ bin/ generateImportMap/ index").AddToImportMap; baseDir: string; config: import("/ Users/ okonet/ Projects/ danielamulle. at/ apps/ web/ node_modules/ payload/ dist/ config/ types").SanitizedConfig; importMap: import("/ Use...' is not assignable to type '((props: { addToImportMap: import("/ Users/ okonet/ Projects/ danielamulle. at/ node_modules/ payload/ dist/ bin/ generateImportMap/ index").AddToImportMap; baseDir: string; config: import("/ Users/ okonet/ Projects/ danielamulle. at/ node_modules/ payload/ dist/ config/ types").SanitizedConfig; importMap: import("/ Users/ okonet/ Projects...'.
Type '(props: { addToImportMap: import("/ Users/ okonet/ Projects/ danielamulle. at/ apps/ web/ node_modules/ payload/ dist/ bin/ generateImportMap/ index").AddToImportMap; baseDir: string; config: import("/ Users/ okonet/ Projects/ danielamulle. at/ apps/ web/ node_modules/ payload/ dist/ config/ types").SanitizedConfig; importMap: import("/ User...' is not assignable to type '(props: { addToImportMap: import("/ Users/ okonet/ Projects/ danielamulle. at/ node_modules/ payload/ dist/ bin/ generateImportMap/ index").AddToImportMap; baseDir: string; config: import("/ Users/ okonet/ Projects/ danielamulle. at/ node_modules/ payload/ dist/ config/ types").SanitizedConfig; importMap: import("/ Users/ okonet/ Projects/...'.
Types of parameters props and props are incompatible.
Type '{ addToImportMap: import("/ Users/ okonet/ Projects/ danielamulle. at/ node_modules/ payload/ dist/ bin/ generateImportMap/ index").AddToImportMap; baseDir: string; config: import("/ Users/ okonet/ Projects/ danielamulle. at/ node_modules/ payload/ dist/ config/ types").SanitizedConfig; importMap: import("/ Users/ okonet/ Projects/ danielam...' is not assignable to type '{ addToImportMap: import("/ Users/ okonet/ Projects/ danielamulle. at/ apps/ web/ node_modules/ payload/ dist/ bin/ generateImportMap/ index").AddToImportMap; baseDir: string; config: import("/ Users/ okonet/ Projects/ danielamulle. at/ apps/ web/ node_modules/ payload/ dist/ config/ types").SanitizedConfig; importMap: import("/ Users/ okonet...'.
Types of property config are incompatible.
Type 'import("/ Users/ okonet/ Projects/ danielamulle. at/ node_modules/ payload/ dist/ config/ types").SanitizedConfig' is not assignable to type 'import("/ Users/ okonet/ Projects/ danielamulle. at/ apps/ web/ node_modules/ payload/ dist/ config/ types").SanitizedConfig'.
Type 'SanitizedConfig' is not assignable to type 'Omit<{ admin: { autoLogin: false | { email: string; password: string; prefillOnly: boolean; username: string; }; avatar: "default" | "gravatar" | { Component: string | false | { clientProps: object | { ...; }; exportName: string; path: string; serverProps: object | { ...; }; }; }; ... 12 more ...; user: string; }; ....'.
Types of property email are incompatible.
Type 'import("/ Users/ okonet/ Projects/ danielamulle. at/ node_modules/ payload/ dist/ email/ types").EmailAdapter | Promise<import("/ Users/ okonet/ Projects/ danielamulle. at/ node_modules/ payload/ dist/ email/ types").EmailAdapter>' is not assignable to type 'import("/ Users/ okonet/ Projects/ danielamulle. at/ apps/ web/ node_modules/ payload/ dist/ email/ types").EmailAdapter | Promise<import("/ Users/ okonet/ Projects/ danielamulle. at/ apps/ web/ node_modules/ payload/ dist/ email/ types").EmailAdapter>'.
Type EmailAdapter is not assignable to type EmailAdapter | Promise<EmailAdapter>
Type
import("/ Users/ okonet/ Projects/ danielamulle. at/ node_modules/ payload/ dist/ email/ types").EmailAdapter
is not assignable to type
import("/ Users/ okonet/ Projects/ danielamulle. at/ apps/ web/ node_modules/ payload/ dist/ email/ types").EmailAdapter
Types of parameters __0 and __0 are incompatible.
Type '{ payload: import("/ Users/ okonet/ Projects/ danielamulle. at/ apps/ web/ node_modules/ payload/ dist/ index").BasePayload; }' is not assignable to type '{ payload: import("/ Users/ okonet/ Projects/ danielamulle. at/ node_modules/ payload/ dist/ index").BasePayload; }'.
The types of payload.auth are incompatible between these types.
Type '(options: import("/ Users/ okonet/ Projects/ danielamulle. at/ apps/ web/ node_modules/ payload/ dist/ auth/ operations/ auth").AuthArgs) => Promise<import("/ Users/ okonet/ Projects/ danielamulle. at/ apps/ web/ node_modules/ payload/ dist/ auth/ operations/ auth").AuthResult>' is not assignable to type '(options: import("/ Users/ okonet/ Projects/ danielamulle. at/ node_modules/ payload/ dist/ auth/ operations/ auth").AuthArgs) => Promise<import("/ Users/ okonet/ Projects/ danielamulle. at/ node_modules/ payload/ dist/ auth/ operations/ auth").AuthResult>'.
Types of parameters options and options are incompatible.
Type 'import("/ Users/ okonet/ Projects/ danielamulle. at/ node_modules/ payload/ dist/ auth/ operations/ auth").AuthArgs' is not assignable to type 'import("/ Users/ okonet/ Projects/ danielamulle. at/ apps/ web/ node_modules/ payload/ dist/ auth/ operations/ auth").AuthArgs'.
Types of property req are incompatible.
Type 'Omit<import("/ Users/ okonet/ Projects/ danielamulle. at/ node_modules/ payload/ dist/ types/ index").PayloadRequest, "user"> | undefined' is not assignable to type 'Omit<import("/ Users/ okonet/ Projects/ danielamulle. at/ apps/ web/ node_modules/ payload/ dist/ types/ index").PayloadRequest, "user"> | undefined'.
Type 'Omit<import("/ Users/ okonet/ Projects/ danielamulle. at/ node_modules/ payload/ dist/ types/ index").PayloadRequest, "user">' is not assignable to type 'Omit<import("/ Users/ okonet/ Projects/ danielamulle. at/ apps/ web/ node_modules/ payload/ dist/ types/ index").PayloadRequest, "user">'.
Types of property locale are incompatible.
Type string | null | undefined is not assignable to type "all" | null | undefined
Type string is not assignable to type "all"

@okonet
Copy link

okonet commented Mar 21, 2025

I went with a separate clean setup and it seemed to work at first until today I run yarn and I see the error again in the clean next.js setup in a turbo repo.

@ghill-xpanxion
Copy link

We were facing this issue but fixed it by downgrading the version number.

After inspecting our lockfile, I saw that all of our payload dependencies were on version 3.28.1 (which was latest) except for @payloadcms/storage-s3 which was on version 3.29.0.

After setting the following versions manually in package.json, the problem went away:

    "@payloadcms/db-postgres": "3.28.1",
    "@payloadcms/next": "3.28.1",
    "@payloadcms/payload-cloud": "3.28.1",
    "@payloadcms/richtext-lexical": "3.28.1",
    "@payloadcms/storage-s3": "3.28.1",
    "@payloadcms/translations": "3.28.1",

@neverether
Copy link

Seems to be an issue when the package manager is yarn. There's a thread in discord with potential solutions for non-yarn users who are running into this issue: https://discord.com/channels/967097582721572934/1345991094579626014

@lmo-wt
Copy link

lmo-wt commented Mar 25, 2025

Any news about this?
Even after using pinned versions, purging node_modules and yarn cache, and reinstalling everything, the problem still occurs.
This preventing us from updating post 3.24.
Here is our package.json dependencies (we also tried with the 3.29.0).

  "dependencies": {
    "@payloadcms/db-mongodb": "3.27.0",
    "@payloadcms/next": "3.27.0",
    "@payloadcms/payload-cloud": "3.27.0",
    "@payloadcms/plugin-search": "3.27.0",
    "@payloadcms/richtext-lexical": "3.27.0",
    "@payloadcms/storage-s3": "3.27.0",
    "date-fns": "^4.1.0",
    "jsdom": "^26.0.0",
    "lucide-react": "^0.475.0",
    "mime": "^4.0.6",
    "next": "15.2.1",
    "papaparse": "^5.5.2",
    "payload": "3.27.0",
    "qs": "^6.13.1",
    "react": "19.0.0-rc.1",
    "react-dom": "19.0.0-rc.1",
    "sharp": "0.32.6"
  },

@smoothdvd
Copy link

Try this: cleanup the importMap.js

@lmo-wt
Copy link

lmo-wt commented Mar 26, 2025

@smoothdvd just tried to clean it and regenerating it but sadly I still get the error.

@smoothdvd
Copy link

My package.json:

{
  "name": "api",
  "version": "1.0.0",
  "description": "A blank template to get started with Payload 3.0",
  "license": "MIT",
  "type": "module",
  "scripts": {
    "build": "cross-env NODE_OPTIONS=--no-deprecation next build",
    "dev": "cross-env NODE_OPTIONS=--no-deprecation next dev",
    "devsafe": "rm -rf .next && cross-env NODE_OPTIONS=--no-deprecation next dev",
    "generate:importmap": "cross-env NODE_OPTIONS=--no-deprecation payload generate:importmap",
    "generate:types": "cross-env NODE_OPTIONS=--no-deprecation payload generate:types",
    "lint": "cross-env NODE_OPTIONS=--no-deprecation next lint",
    "payload": "cross-env NODE_OPTIONS=--no-deprecation payload",
    "start": "cross-env NODE_OPTIONS=--no-deprecation next start",
    "test": "vitest"
  },
  "dependencies": {
    "@ai-sdk/openai": "^1.3.3",
    "@alicloud/alimt20181012": "^1.3.0",
    "@alicloud/dingtalk": "^2.1.94",
    "@alicloud/green20220302": "^2.20.4",
    "@alicloud/openapi-client": "^0.4.13",
    "@alicloud/tea-util": "^1.4.10",
    "@bull-board/api": "^6.7.10",
    "@bull-board/hono": "^6.7.10",
    "@bull-board/ui": "^6.7.10",
    "@date-fns/tz": "^1.2.0",
    "@hono/node-server": "^1.14.0",
    "@payloadcms/db-postgres": "3.31.0",
    "@payloadcms/next": "3.31.0",
    "@payloadcms/richtext-lexical": "3.31.0",
    "@payloadcms/storage-s3": "3.31.0",
    "@payloadcms/ui": "3.31.0",
    "ai": "^4.2.5",
    "bullmq": "^5.44.4",
    "cross-env": "^7.0.3",
    "date-fns": "^4.1.0",
    "file-type": "^20.4.1",
    "fluent-ffmpeg": "^2.1.3",
    "graphql": "^16.8.1",
    "hono": "^4.7.4",
    "inngest": "^3.34.0",
    "ioredis": "^5.6.0",
    "jsonpath-plus": "^10.3.0",
    "ky": "^1.7.5",
    "mammoth": "^1.9.0",
    "meilisearch": "^0.49.0",
    "nanoid": "^5.1.5",
    "next": "15.2.4",
    "officeparser": "^5.1.1",
    "payload": "3.31.0",
    "react": "19.0.0",
    "react-dom": "19.0.0",
    "sharp": "0.32.6",
    "weaviate-client": "^3.4.1",
    "zod": "^3.24.2"
  },
  "devDependencies": {
    "@eslint/eslintrc": "^3.2.0",
    "@swc/core": "^1.7.23",
    "@testing-library/dom": "^10.4.0",
    "@testing-library/react": "^16.0.1",
    "@types/fluent-ffmpeg": "^2.1.27",
    "@types/node": "^22.5.4",
    "@types/react": "^19",
    "@types/react-dom": "^19",
    "@vitejs/plugin-react": "^4.3.4",
    "dotenv": "^16.4.7",
    "eslint": "^9.16.0",
    "eslint-config-next": "15.2.4",
    "jsdom": "^26.0.0",
    "prettier": "^3.5.3",
    "typescript": "5.7.3",
    "vitest": "^3.0.9"
  },
  "engines": {
    "node": "^18.20.2 || >=20.9.0"
  },
  "trustedDependencies": [
    "@alicloud/openapi-core",
    "@swc/core",
    "protobufjs"
  ]
}

@okonet
Copy link

okonet commented Mar 31, 2025

I created a reproduction case: https://github.com/okonet/payload-repro-storage

  1. Run yarn after cloning
  2. Run yarn dev
  3. Go to admin console

Most specifically it's this commit: okonet/payload-repro-storage@1d457b2

@maxkrv
Copy link

maxkrv commented Apr 1, 2025

Fixed this issue by setting the identical versions for payload packages:

  "dependencies": {
    "payload": "3.31.0",
    "@payloadcms/db-postgres": "3.31.0",
    "@payloadcms/next": "3.31.0",
    "@payloadcms/payload-cloud": "3.31.0",
    "@payloadcms/plugin-nested-docs": "3.31.0",
    "@payloadcms/richtext-lexical": "3.31.0",
    "@payloadcms/storage-s3": "3.31.0",
  },

and adding overrides to package.json:

  "overrides": {
    "payload": "3.31.0"
  }

My config:

import { postgresAdapter } from '@payloadcms/db-postgres';
import { nestedDocsPlugin } from '@payloadcms/plugin-nested-docs';
import { lexicalEditor } from '@payloadcms/richtext-lexical';
import { s3Storage } from '@payloadcms/storage-s3';
import path from 'path';
import { buildConfig } from 'payload';
import sharp from 'sharp';
import { fileURLToPath } from 'url';

import { Categories } from './collections/Categories';
import { Media } from './collections/Media';
import { Products } from './collections/Products';
import { Users } from './collections/Users';
import { serverConfig } from './config/server.config';

const filename = fileURLToPath(import.meta.url);
const dirname = path.dirname(filename);

export default buildConfig({
  admin: {
    user: Users.slug,
    importMap: {
      baseDir: path.resolve(dirname)
    }
  },
  collections: [Users, Media, Categories, Products],
  editor: lexicalEditor(),
  secret: serverConfig.payload.secret,
  typescript: {
    outputFile: path.resolve(dirname, 'payload-types.ts')
  },
  db: postgresAdapter({
    pool: {
      connectionString: serverConfig.db.databaseUri
    }
  }),
  sharp,
  graphQL: {
    disable: true
  },
  plugins: [
    s3Storage({
      collections: {
        media: true
      },
      bucket: serverConfig.storage.bucketName,
      config: {
        credentials: {
          accessKeyId: serverConfig.storage.accessKeyId,
          secretAccessKey: serverConfig.storage.secretAccessKey
        },
        region: serverConfig.storage.region
      }
    }),
    nestedDocsPlugin({
      collections: ['categories']
    })
  ]
});

@mikexavier
Copy link

I solved this by pinning all payload packages.

I had all pinned to 3.32.0 except for @payloadcms/storage-s3 which was on ^3.32.0. After pinning the storage-s3 package, no error.

@lmo-wt
Copy link

lmo-wt commented Apr 7, 2025

Unfortunatly we tried to pin all payload packages versions but it did not fix the issue for us.
Here is our package.json dependencies :

{
  "name": "cms",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "@payloadcms/db-mongodb": "3.32.0",
    "@payloadcms/next": "3.32.0",
    "@payloadcms/payload-cloud": "3.32.0",
    "@payloadcms/plugin-search": "3.32.0",
    "@payloadcms/richtext-lexical": "3.32.0",
    "@payloadcms/storage-s3": "3.32.0",
    "@repo/common": "workspace:^",
    "@repo/eslint-config": "workspace:*",
    "@repo/typescript-config": "workspace:*",
    "@repo/ui": "workspace:*",
    "date-fns": "^4.1.0",
    "jsdom": "^26.0.0",
    "json-diff": "^1.0.6",
    "json-diff-kit": "^1.0.31",
    "lucide-react": "^0.475.0",
    "mime": "^4.0.6",
    "next": "15.1.4",
    "papaparse": "^5.5.2",
    "payload": "3.32.0",
    "qs": "^6.13.1",
    "react": "19.0.0-rc.1",
    "react-dom": "19.0.0-rc.1",
    "sharp": "0.32.6",
    "slugify": "^1.6.6"
  },
  "devDependencies": {
    "@types/jsdom": "^21.1.7",
    "@types/json-diff": "^1",
    "@types/node": "^20",
    "@types/papaparse": "^5",
    "@types/qs": "^6",
    "@types/react": "npm:[email protected]",
    "@types/react-dom": "npm:[email protected]",
    "autoprefixer": "^10.4.20",
    "cross-env": "^7.0.3",
    "eslint": "^9.15.0",
    "eslint-config-next": "^15.0.3",
    "graphql": "^16.8.1",
    "postcss": "^8.4.49",
    "tailwindcss": "^3.4.15",
    "typescript": "^5.6.3"
  },
  "overrides": {
    "payload": "3.32.0"
  }
}

We use yarn workspaces and we manage our monorepo with turbo.
Here is our root package.json dependencies:

{
  "name": "root",
  "private": true,
  "devDependencies": {
    "concurrently": "^9.1.2",
    "turbo": "^2.3.1",
    "typescript": "^5.6.3"
  },
  "engines": {
    "node": ">=20"
  },
  "workspaces": [
    "apps/*",
    "packages/*"
  ],
  "packageManager": "[email protected]"
}

@okonet
Copy link

okonet commented Apr 7, 2025

What helped me is to pin-point the dependencies that were deduped / hoisted.

Try running yarn list react. In my case on the sub-deps was installing an older version of React to the root.

Try using nohoist: https://classic.yarnpkg.com/blog/2018/02/15/nohoist/

@willemmulder
Copy link

I had the same issue with Vercel Blob Storage and NPM. I really had to remove all of these:

  1. lockfile
  2. .next
  3. node_modules

And that finally did the trick 👍

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
invalid-reproduction status: needs-triage Possible bug which hasn't been reproduced yet v2
Projects
None yet
Development

No branches or pull requests