Following documentation yields: Error: No such module "wrangler".

[tywenk]

Example URL(s)

https://developers.cloudflare.com/developer-spotlight/tutorials/fullstack-authentication-with-next-js-and-cloudflare-d1/

Actual Behavior

I get the following error when I run npm run preview after following the steps in this documentation (starting from the template, as provided at the start of the docs.)

Note that I also had to adjust the code provided by the documentation to get this to successfully build at all. I had to change each reference to getCloudflareContext to getCloudflareContext({ async: true }).

Here is the error using Node version running locally: 22.14.0

npm run preview

> walkandtalk@0.1.0 preview
> opennextjs-cloudflare && wrangler dev


┌─────────────────────────────┐
│ OpenNext — Cloudflare build │
└─────────────────────────────┘

App directory: /Users/tywen/Developer/walkandtalk
Next.js version : 15.2.3
@opennextjs/cloudflare version: 0.5.12
@opennextjs/aws version: https://pkg.pr.new/@opennextjs/aws@7e23eee

┌─────────────────────────────────┐
│ OpenNext — Building Next.js app │
└─────────────────────────────────┘


> walkandtalk@0.1.0 build
> next build

   ▲ Next.js 15.2.3
   - Environments: .env.local

Using vars defined in .dev.vars
Using vars defined in .dev.vars
   Creating an optimized production build ...
Using vars defined in .dev.vars
Using vars defined in .dev.vars
 ⚠ Compiled with warnings

./src/app/auth.ts
The generated code contains 'async/await' because this module is using "topLevelAwait".
However, your target environment does not appear to support 'async/await'.
As a result, the code may not run as expected or may cause runtime errors.

Import trace for requested module:
./src/app/auth.ts

Using vars defined in .dev.vars
 ✓ Compiled successfully
 ✓ Linting and checking validity of types    
   Collecting page data  ...Using vars defined in .dev.vars
Using vars defined in .dev.vars
 ✓ Collecting page data    
Using vars defined in .dev.vars
 ✓ Generating static pages (5/5)
 ✓ Collecting build traces    
 ✓ Finalizing page optimization    

Route (app)                                 Size  First Load JS    
┌ ƒ /                                     9.7 kB         110 kB
├ ○ /_not-found                            977 B         101 kB
└ ƒ /api/auth/[...nextauth]                135 B         101 kB
+ First Load JS shared by all             100 kB
  ├ chunks/4bd1b696-691ffa78c3a14e21.js  53.2 kB
  ├ chunks/684-b4018d476652862f.js       45.3 kB
  └ other shared chunks (total)          1.89 kB


ƒ Middleware                             89.1 kB

○  (Static)   prerendered as static content
ƒ  (Dynamic)  server-rendered on demand


┌──────────────────────────────┐
│ OpenNext — Generating bundle │
└──────────────────────────────┘

Bundling middleware function...
Bundling static assets...
Bundling cache assets...
Building server function: default...
# copyPackageTemplateFiles
⚙️ Bundling the OpenNext server...

Applying code patches:
 - patching require
 - patching cacheHandler
 - patching 'require(this.middlewareManifestPath)'
 - patching `patchAsyncStorage` call
 - patching `require.resolve` call
All 5 patches applied

Worker saved in `/Users/tywen/Developer/walkandtalk/.open-next/worker.js` 🚀

OpenNext build complete.

 ⛅️ wrangler 4.4.0
------------------

Using vars defined in .dev.vars
Your Worker and resources are simulated locally via Miniflare. For more information, see: https://developers.cloudflare.com/workers/testing/local-development.

Your worker has access to the following bindings:
- D1 Databases:
  - DB: walkandtalk-db (<OMITTED>) [simulated locally]
- Vars:
  - NEXTJS_ENV: "(hidden)"
  - AUTH_SECRET: "(hidden)"
  - AUTH_RESEND_KEY: "(hidden)"
  - AUTH_EMAIL_FROM: "(hidden)"
  - AUTH_URL: "(hidden)"
[wrangler:inf] Ready on http://localhost:8787
⎔ Starting local server...
✘ [ERROR] ⨯ Error: No such module "wrangler".

      at s (Users/tywen/Developer/walkandtalk/.wrangler/tmp/dev-V6QCuC/worker.js:148909:69)
      at a (Users/tywen/Developer/walkandtalk/.wrangler/tmp/dev-V6QCuC/worker.js:148901:26)
      at i (Users/tywen/Developer/walkandtalk/.wrangler/tmp/dev-V6QCuC/worker.js:148882:27)
      at e4 (Users/tywen/Developer/walkandtalk/.wrangler/tmp/dev-V6QCuC/worker.js:243998:39)
      at o (Users/tywen/Developer/walkandtalk/.wrangler/tmp/dev-V6QCuC/worker.js:244002:38)
      at <unknown> (Users/tywen/Developer/walkandtalk/.wrangler/tmp/dev-V6QCuC/worker.js:244005:73)
      at t.a (Users/tywen/Developer/walkandtalk/.wrangler/tmp/dev-V6QCuC/worker.js:154899:32)
      at 7285 (Users/tywen/Developer/walkandtalk/.wrangler/tmp/dev-V6QCuC/worker.js:243993:12)
      at t (Users/tywen/Developer/walkandtalk/.wrangler/tmp/dev-V6QCuC/worker.js:154865:15)
      at <unknown> (Users/tywen/Developer/walkandtalk/.wrangler/tmp/dev-V6QCuC/worker.js:243980:21)

For more context, here is my package.json:

{
  "name": "walkandtalk",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "dev": "next dev --turbopack",
    "build": "next build",
    "start": "next start",
    "lint": "next lint",
    "deploy": "opennextjs-cloudflare && wrangler deploy",
    "preview": "opennextjs-cloudflare && wrangler dev",
    "cf-typegen": "wrangler types --env-interface CloudflareEnv cloudflare-env.d.ts"
  },
  "dependencies": {
    "@auth/d1-adapter": "^1.8.0",
    "@radix-ui/react-avatar": "^1.1.3",
    "@radix-ui/react-label": "^2.1.2",
    "@radix-ui/react-slot": "^1.1.2",
    "class-variance-authority": "^0.7.1",
    "clsx": "^2.1.1",
    "lucide-react": "^0.483.0",
    "next": "15.2.3",
    "next-auth": "^5.0.0-beta.25",
    "react": "^19.0.0",
    "react-dom": "^19.0.0",
    "tailwind-merge": "^3.0.2",
    "tw-animate-css": "^1.2.4"
  },
  "devDependencies": {
    "@cloudflare/workers-types": "^4.20250321.0",
    "@eslint/eslintrc": "^3",
    "@opennextjs/cloudflare": "^0.5.12",
    "@tailwindcss/postcss": "^4",
    "@types/node": "^20",
    "@types/react": "^19",
    "@types/react-dom": "^19",
    "eslint": "^9",
    "eslint-config-next": "15.2.3",
    "tailwindcss": "^4",
    "typescript": "^5",
    "wrangler": "^4.4.0"
  }
}

Expected Behavior

I am able to follow this guide and build and deploy a simple Nextjs project in CF Workers.

Additional information

No response

[connorp987]

I have the exact same problem. Would love a fix

[leducmaxime]

I also had the exact same problem on the same tuto, this works :

src/app/auth.ts

import NextAuth from "next-auth";
import { D1Adapter } from "@auth/d1-adapter";
import Resend from "next-auth/providers/resend";
import { getCloudflareContext } from "@opennextjs/cloudflare";

export const { handlers, signIn, signOut, auth } = NextAuth(async () => {
  return {
    providers: [
      Resend({
        apiKey: (await getCloudflareContext({ async: true })).env
          .AUTH_RESEND_KEY,
        from: (await getCloudflareContext({ async: true })).env.AUTH_EMAIL_FROM,
      }),
    ],
    adapter: D1Adapter((await getCloudflareContext({ async: true })).env.DB),
  };
});