Support for Vinext (Vite-native Next.js on Cloudflare Workers)

[himanshu-ntml]

I a'm trying to run Payload CMS v3.79 on Vinext (Vite-native React Server Components on Cloudflare Workers). The admin panel mostly works, but we hit a few bundler-compatibility issues. These are all fixable with small changes and would improve Payload's compatibility with non-webpack bundlers.

1. 🐛 SyntaxError: Identifier 'cookies' has already been declared

File: @payloadcms/next/dist/layouts/Root/index.js

Vite's server action transform hoists 'use server' function bodies into the parent scope. This causes a collision between the destructured cookies from initReq() (line 26) and const cookies = await nextCookies() inside switchLanguageServerAction (line 59).

// Line 26 — outer scope
const { cookies, headers, languageCode, permissions, req } = await initReq({
  configPromise,
  importMap,
  key: 'RootLayout'
});

// Line 56 — server action (hoisted into same scope by Vite)
async function switchLanguageServerAction(lang) {
  'use server';
  const cookies = await nextCookies();  // ← COLLISION: 'cookies' already declared above
  cookies.set({
    name: `${config.cookiePrefix || 'payload'}-lng`,
    path: '/',
    value: lang
  });
}

Why this happens: Next.js/webpack extracts server actions into separate module-level functions with unique identifiers. Vite's RSC transform instead hoists the function body inline, keeping both const cookies declarations in the same scope → SyntaxError.

Fix: Rename the inner variable to avoid the collision:

  async function switchLanguageServerAction(lang) {
    'use server';
-   const cookies = await nextCookies();
-   cookies.set({
+   const cookieStore = await nextCookies();
+   cookieStore.set({
      name: `${config.cookiePrefix || 'payload'}-lng`,
      path: '/',
      value: lang
    });
  }

This is a one-line change. Happy to submit a PR.

---

2. ⚠️ isPlural is not a function — CJS interop

File: payload/dist/utilities/formatLabels.js

import pluralize from 'pluralize';
const { isPlural, singular } = pluralize;

pluralize is a UMD/CJS module. In non-webpack ESM contexts (Vite SSR, Cloudflare Workers/workerd), the default import may not resolve to the function — it can return an empty object or a module namespace. A defensive pattern would fix this:

- import pluralize from 'pluralize';
- const { isPlural, singular } = pluralize;
+ import pluralize from 'pluralize';
+ const _p = pluralize.default || pluralize;
+ const { isPlural, singular } = typeof _p === 'function' ? _p : pluralize;

---

3. ℹ️ CJS transitive dependencies need pre-bundling

Payload's dependencies (bson-objectid, ajv, deepmerge, http-status, md5, uuid, path-to-regexp, sanitize-filename, etc.) are CJS modules. When Payload is excluded from Vite's optimizeDeps (required for RSC), these transitive deps also skip pre-bundling, causing does not provide an export named 'default' errors in the browser.

Current workaround: Users must manually add all CJS deps to optimizeDeps.include:

optimizeDeps: {
  include: [
    "bson-objectid", "ajv", "deepmerge", "http-status",
    "pluralize", "md5", "object-to-formdata", "uuid",
    "dequal", "dequal/lite", "dataloader", "graphql",
    "jose", "path-to-regexp", "sanitize-filename", "qs-esm",
    "date-fns", "use-context-selector", "sonner",
  ],
  exclude: ["payload", "@payloadcms/next", "@payloadcms/ui", /* ... */],
}

Payload could help by either:

• Shipping ESM builds of core packages
• Documenting the required optimizeDeps.include list for Vite users
• Exporting a Vite plugin/config helper from @payloadcms/next

---

4. ℹ️ react/compiler-runtime CJS export detection

Payload v3.79 is compiled with React Compiler, which requires react/compiler-runtime to export c. The CJS file wraps exports.c inside a conditional IIFE that Vite's static analysis can't detect as a named ESM export:

// react/cjs/react-compiler-runtime.development.js
"production" !== process.env.NODE_ENV && (function () {
  exports.c = function (size) { /* ... */ };
})();

Workaround: Users create an ESM shim and alias react/compiler-runtime to it in vite.config.ts. This is a React packaging issue, not strictly Payload's, but worth noting for Vite users.

---

Environment

Package	Version
Payload CMS	3.79.0
@payloadcms/next	3.79.0
Vinext	0.0.24
Vite	7.3.1
@cloudflare/vite-plugin	1.26.1
React	19.2.1
Runtime	Cloudflare Workers (workerd)

Steps to Reproduce

1. Create a Vinext project with Cloudflare Workers
2. Install Payload CMS v3.79 and configure with @payloadcms/next
3. Run npm run dev
4. Navigate to /admin

Expected Behavior

Admin panel loads without errors.

Actual Behavior

1. SyntaxError: Identifier 'cookies' has already been declared — blocks admin panel entirely
2. isPlural is not a function — blocks admin panel
3. Multiple does not provide an export named 'default' — blocks client-side hydration

[paulpopus]

Hi there, thanks for testing as well! We have been to and we're getting to different points and bugs. Right now the plan is to wait for vinext to be a bit more mature while testing newer versions more often.

Will likely make a full thread about tracking progress here sometime soon

[nnWhisperer]

that would be great. Do you think like it would take 6 months for sufficient vinext maturity or what's your criteria, like github stars reaching 20k(7k as of end of March 2026) or hearing more about vinext from others in the industry or what?

[paulpopus]

Realistically it will be less than 6 months, they're moving fast on that. We're getting closer to support out of the box every week - that's all I can say right now but we will keep an eye on it