Cloudflare Developers•8mo ago

Cloudflare Pages: NextJS&VueJS Hybrid deployment failed

Hi, I am using NextJS functions and VueJS static files for a historical problem. My project arch is: src/pages/api/*.js for functions and fe/*.vue . My Pages framework is selected as NextJS. Before each build, I will use npm run prebuild to change directory to fe and build the static files to public.

{
        "prebuild": "cd fe && npm install && npm run build",
        "build": "next build",
}

{
        "prebuild": "cd fe && npm install && npm run build",
        "build": "next build",
}

But I found vite cannot be found in cloudflare pages' build phase. (More detailed log is attached)

12:12:35.773    ▲  config     [`cacache`](http://npm.im/cacache).
12:12:35.791    ▲  > qrcode-fe@0.0.1 build
12:12:35.791    ▲  > rm -rf ../public && vite build
12:12:35.814    ▲  sh: 1: vite: not found
12:12:35.841    ▲  Error: Command "npm run build" exited with 127

12:12:35.773    ▲  config     [`cacache`](http://npm.im/cacache).
12:12:35.791    ▲  > qrcode-fe@0.0.1 build
12:12:35.791    ▲  > rm -rf ../public && vite build
12:12:35.814    ▲  sh: 1: vite: not found
12:12:35.841    ▲  Error: Command "npm run build" exited with 127

I think vite should be installed by npm run install but unfortunately not. Thanks for your help. More info, if I build the fe locally, everything works fine. So the hybridzation deployment is technically possible.

multi-qrcode-backend...

2 Replies

Kent👋•8mo ago

Using node 20 works like a charm

Ayaan•8mo ago

move vite from devDependencies to dependencies in package.json and run npm install manually in your local and commit

Gaming

Programming

Cloudflare Pages: NextJS&VueJS Hybrid deployment failed