Deploying Nuxt to Pages - path errors
Hi,
During deployment, I get the following errors:
[error] [nitro] Error: Could not load /opt/buildhome/repo/dist/dist/server/styles.mjs (imported by node_modules/nuxt/dist/core/runtime/nitro/renderer.js): ENOENT: no such file or directory, open '/opt/buildhome/repo/dist/dist/server/styles.mjs'
[error] Could not load /opt/buildhome/repo/dist/dist/server/styles.mjs (imported by node_modules/nuxt/dist/core/runtime/nitro/renderer.js): ENOENT: no such file or directory, open '/opt/buildhome/repo/dist/dist/server/styles.mjs'
The folder structure is fine (double /dist/ folder) and the files are in GitHub. The site also works fine locally. Not really sure how to investigate it. Any pointers are appreciated.
50 Replies
If you're developing on Windows you can run into some funny issues because Linux is case sensitive while Windows isn't, worth a check
Thanks! Locally I am using a Mac though.
I also noticed I was getting additional errors when running different build commands. Though these path related erros always show
I've never used Mac before but Google says Mac is also case insensitive.
What I mean though is for example if you import a file as
style.mjs and the file is actually named Style.mjs, case insensitive FS is ok with that but case sensitive like Linux would throw, has caused these issues before.
I also noticed I was getting additional errors when running different build commands. Though these path related erros always showLocally?
No, not locally. Locally everything is looking good
Looks like it might be something with the build though and not with just imports:
https://github.com/nuxt/nuxt/issues/13901
I don't know enough about Nuxt to help more then just saying try googling for that error, perhaps someone else who uses Nuxt can chime in here and help more, there's some issues about it on their Github repos that may be worth exploring. You shouldn't be pushing up
dist if its the build output, should let Pages CI build thatGitHub
'nuxt dev' breaks on a fresh install with ssr: false · Issue #13901...
Environment Operating System: Windows_NT Node Version: v16.13.1 Nuxt Version: 3.0.0-rc.2 Package Manager: [email protected] Builder: vite User Config: ssr Runtime Modules: - Build Modules: - Reproductio...
Thanks. What do you mean by "You shouldn't be pushing up dist if its the build output, should let Pages CI build that"
Any sort of Build Artifacts, caching directories, build output, etc, should be excluded from Git
Instead Pages should run the build command and create the output anew
I run build then run generate and push the generated output to GitHub, and from there deploy to Cloudflare. Am I doing it wrong?
Generally, yes. Just in general it's best practice to only push the source to Git, the point of the Pages Build Environment CI/CD is that it has all of the tools/etc to build your application based on source
All right, thanks for the tip!
If you're pushing up the built version of the app though, why is nitro/build still running?
Yeah, I am not really sure
What's your build command?
locally?
npm run build
then npm run generate
then git commit -m
then git push
IN CF pages I tried npm run build and nuxt build
Under the Pages Project -> Settings -> Builds & Deplotments, you can edit your Build config.
You could select none and have it do nothing, if you're already building the app.
To clarify what I said above, the point of only having src in Git is that its easier to work with. espec with other people, they can push changes and not have to remember to rebuild the app, etc.
If it works though, it works. I am guilty of creating a Pages project just containing the output myself because getting ci/cd setup was too difficult and not worth it for that app. Ultimately whatever works best for you
IN CF pages I tried npm run build and nuxt buildThat sounds redundant? Also you're running generate locally, but build on pages? What do those commands actually run? (check package.json)
Yeah I need all the source files etc I think as I am using cf workers
Thanks! I will check that
"generate": "nuxt generate",
"build": "nuxt build",
Maybe I should run nuxt generate in Cloudflare actually. "Use the nuxi generate command to build and pre-render your application using the Nitro crawler."
generate is static and build is server-side rendering
Which is your intent? You're running generate locally and build twice on cf
The intent is to build it on CF, with all source files in GutHub
Right but as a fully static app (just uploading html/css/js to CF), or as a server-side rendered app?
server side rendered app
Then it sounds like to me you'd want to use nuxt build and not generate
yep, you are right
Like you said, generate pre-renders the app and outputs just the static assets
well, does nuxt build work locally?
no, it doesn't actually, locally I have to use npm run build
should be the same thing in the end, you just don't have nuxt in your path
but it does work and builds the ssr version of the app without issue?
yep
just to verify, in your
nuxt.config file, your target is static or server?there is no target specified, actually
should be fine, default is server
shall I add "target" : "server", ?
I see
nah you're fine, it says the default is server
if you replace your build command on Pages with just
npm run build, and then do another commit to cause another build, any chance that works and doesn't explode?There's a preset for nuxt you can select as well
I tried that, with no difference
What's the build environment version you're on?
Under the Pages Project -> Settings -> Builds & Deployments -> Build System Version
Should switch to v2 if you're not already on it. Otherwise the full build output log would be helpful
Build system version:
2 (latest)
Shall I just paste the log here?
If it's small enough, or download it and upload it
There are more errors here when I used that build command
but the path errors are still there
hmm those aren't the default, Nuxt's defaults are these:
trying to remember if Nuxt was the one who needed special settings for the latest version or if that got fixed
I have tried them too, let' me do again
trying to remember if Nuxt was the one who needed special settings for the latest version or if that got fixedI read that somewhere that it needed a file with a version, but that was an old issue
It looks like at one time if you had ssr: false it would fail to generate the server.mjs
https://github.com/nuxt/framework/pull/5773
.nvmrc file I think
.nvmrc is for node version
Page's old image was on a really old node version by default
v2 should be ok, and its better at autodetecting things
This is what it picked base on your env
Detected the following tools from environment: [email protected], [email protected]I will try now with ssr: false,
no difference 😦
Locally I have npm -v
10.2.4
node v21.4.0
You'll want to sync your node versions. You're running a non-stable node release locally and LTS on Pages
Thanks! Will sync them
That didn't help 😦
hmm you're at the edge of my limited nuxt knowledge lol
The error changed though, did it not?
At the start it was that it couldn't find the file, now it's
2023-12-06T17:35:01.595604Z [error] Cannot resolve "/opt/buildhome/repo/dist/dist/server/server.mjs" from "/opt/buildhome/repo/node_modules/nuxt/dist/core/runtime/nitro/renderer.js" and externals are not allowed!
That looks like a dependency issue or something else
If you want ssr on don't turn it off, after you updated your build config do you get that same error? Latest version of nuxt? Stop pushing up dist/or any build artifacts and delete them from Git.Yes, the erros change, except the path related error
I'll keep digging. Thanks for your help! 👍