netlify preset support for custom baseURL

[issue-up[bot]]

Forwarded from downstream issue: https://github.com/nuxt/nuxt/issues/22225 by @michaelvcolianna

Environment

---

• Operating System: Darwin
• Node Version: v20.2.0
• Nuxt Version: 3.6.3
• Nitro Version: 2.5.2
• Package Manager: [email protected]
• Builder: vite
• User Config: app, devtools
• Runtime Modules: -
• Build Modules: -

---

Reproduction

Works with dev OR build & preview: https://stackblitz.com/github/michaelvcolianna/nuxttest?file=nuxt.config.ts Deploy, not working: https://sparkling-mandazi-64484f.netlify.app/test Repo: https://github.com/michaelvcolianna/nuxttest

Edited to add a URL using npm run generate to illustrate the 404s: https://nuxt.mvcdev.net/

Describe the bug

This feels like this is a Nuxt configuration thing. I guess it could be Netlify but wanted to check here first.

I'm experiencing an error similar to https://github.com/nuxt/nuxt/issues/14817, but npm run build && npm run preview work fine locally and on Stackblitz. When deployed, though, either on Netlify or using npm run generate and serving the dist folder, an error shows up.

This is because the files don't exist. When building, the baseURL ("test" for now) is appended before the "_nuxt" part of the resource.

The Netlify deployment is looking for https://sparkling-mandazi-64484f.netlify.app/test/_nuxt/entry.624150a5.js, which is the MIME error because of the catchall serving it as a real page. It should be looking for https://sparkling-mandazi-64484f.netlify.app/_nuxt/entry.624150a5.js.

Serving from dist is looking for localhost:8081/test/_nuxt/entry.a65c34ed.js, which is a 404 since the SSG crawler doesn't create the file. It should be looking for localhost:8081/_nuxt/entry.a65c34ed.js.

(I know those file names aren't set in stone but hopefully they get the point across.)

Additional context

First, this issue happened prior to using the catchall. I tried a base Nuxt instance with the app.vue file, then converted that to use <NuxtPage> and made pages/index.vue but switched to the catchall to show the MIME error instance. Without the catchall the JS files 404 because root cause is they don't exist in the requested location. (Plus, down the line, the final site will need the catchall anyway.)

I've tried adjusting Nuxt config settings, like app.buildAssetsDir and vite.build.assetsDir. In either case, it wouldn't let me use a relative path - since I wanted to remove the baseURL from the request I tried ../ and just an empty string. I also tried adding "test" in there, but then it was looking for files in /test/test/_nuxt.

I've also tried adjusting stuff on the Netlify side. For serving after SSG, I've tried configuring aliases/etc. on the web server side.

I feel like this is a really simple solution I'm overlooking and someone will see it right away. I'm hoping it isn't put everything under the desired baseURL in the pages directory, but if that's the best way to achieve it then I'll do that. Thanks for any insight!

Logs

Browser console for Netlify deploy:
- Failed to load module script: Expected a JavaScript module script but the server responded with a MIME type of "text/html". Strict MIME type checking is enforced for module scripts per HTML spec. entry.624150a5.js:1
- Failed to load module script: Expected a JavaScript module script but the server responded with a MIME type of "text/html". Strict MIME type checking is enforced for module scripts per HTML spec. _...slug_.8187cdda.js:1

Browser console for SSG:
- Failed to load resource: the server responded with a status of 404 (Not Found) entry.a65c34ed.js:1
- Failed to load resource: the server responded with a status of 404 (Not Found) _...slug_.b619b6b1.js:1