[🐛 Bug]: npx @cloudflare/next-on-pages fails on windows

[thomas-desmond]

next-on-pages environment related information

PS C:\Users\tdesmond\Projects\cloudflare\temp\my-next-app> npx @cloudflare/next-on-pages --info EXIT WHEN NOT EXPECTED

SHELLAC COMMAND FAILED! Executing: npm --version in C:\Users\tdesmond\Projects\cloudflare\temp\my-next-app

STDOUT:

STDERR:

/bin/bash: line 1: cd: C:\Users\tdesmond\Projects\cloudflare\temp\my-next-app: No such file or directory

node:internal/process/promises:389 new UnhandledPromiseRejection(reason); ^

UnhandledPromiseRejection: This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). The promise rejected with the reason "#

[irvinebroque]

do you see this when just building the same app without next-on-pages?

[thomas-desmond]

npm run build passes. I deployed the app to Pages as well and it builds on Pages.

So definitely looking like a local setup issue. But I do not know what is missing locally.

[thomas-desmond]

I got one step further but still failing. The original error is saying the directory doesn't exist. But because I'm in WSL the directory locations changes and has /mnt/ in front and is formatted differently. So I created a symbolic link from where the CLI was expecting my app to be (C:\Users\tdesmond\Projects\cloudflare\temp\my-next-app) to where it actually lives in WSL (/mnt/c/Users/tdesmond/Projects/cloudflare/temp/my-next-app)

I get further but still run into an error.

[danbrownuk]

I was able to get this to run by fudging a few lines in index.js to play nicely with WSL. I'm sure there's a better way but this seems to work for now...

Update Command to format cwd to WSL format (/mnt/ at start, flipping slashes and lowercasing drive letter, removing ':', replacing usage of {cwd} with {this.cwd} ) var Command = class { shell; cmd; cwd; interactive; exec; runningState; pipe_logs; exit_expected; retCode; promiseResolve; promiseReject; promise; timer; stdout; stderr; constructor({ cwd, shell, cmd, interactive, pipe_logs = false, exit_expected = false }) { this.shell = shell; this.cmd = cmd; this.cwd = '/mnt/' + cwd.split('\:')[0].toLowerCase() + cwd.split(':')[1].replace(/\\/g, '/'); this.interactive = interactive; this.exit_expected = exit_expected; this.exec =cd "${this.cwd}" && ${this.cmd};echo __END_OFCOMMAND[$?]__ ;

Add shell: true to options of vercel build child process spawn async function getVercelBuildChildProcess(pm, additionalArgs = []) { console.log("trying vercel") const spawnCmd = await pm.getRunExecStruct("vercel", { args: ["build", ...additionalArgs], download: "prefer-if-needed" }); console.log(spawnCmd); if (!spawnCmd) { throw new Error("Error: Failed to generate vercel build command"); } return (0, import_child_process2.spawn)(spawnCmd.cmd, spawnCmd.cmdArgs, {shell: true}); }

After making these tweaks (inside node_modules\@cloudflare\next-on-pages\dist\index.js), run powershell/cmd prompt as Administrator and then the build should complete :)

[mackenly]

I'm getting this issue, too. I worked around it by running in WSL Ubuntu. It seems to be Windows specific.

[thomas-desmond]

Making the changes suggested by @danbrownuk I was able to get the npm run pages:build and npm run pages preview to successfully run for a brand new Next.js application created with npm create cloudflare@latest my-next-app -- --framework=next. After the changes I didn't even need WSL to get the Next.js app to finish building.

So at this time to do we not have out of the box support for Windows and Next.js development?

I'm planning to build a full-stack Next.js app that uses multiple Bindings so that will likely be a better test of building and preview environments on Windows.

[Puliczek]

Same problem on my Windows:

[gandli]

Similarly, I'm having this problem

[EdamAme-x]

same issue on WSL