Router base work on locale but not on Vercel

[DidoMarchet]

Hi, I need to run all my Nuxt app under /blog/:

In local development I set router base:

export default {
  router: {
    trailingSlash: true,
    base: '/blog/',
  },
}

Running the build (ssr mode) and trying it in locale it works as aspected:

• http://localhost:3000/blog/_nuxt/842c692.modern.js modules exist
• http://localhost:3000/blog/business/ page exist

If I deploy on Vercel this ocnfiguration:

• https://www.myurl.app/blog/_nuxt/842c692.modern.js modules doesn't exist (but in root, without /blog/ https://www.myurl.app/_nuxt/842c692.modern.js exist)
• https://www.myurl.app/blog/business/ still exist:

My vercel.json configuration is:

{
  "version": 2,
  "builds": [
    {
      "src": "app/package.json",
      "use": "@vercel/node"
    },
    {
      "src": "app/nuxt.config.js",
      "use": "@nuxtjs/vercel-builder",
      "config": {
        "serverFiles": ["package.json", "library/node_modules/**", "configuration/**", "server-middleware/**", "translation/**", "static/**", ".nuxt/dist/sitemap-routes.json"]
      }
    }
  ],
  "routes": [
    {
      "src": "/blog/sw.js",
      "continue": true,
      "headers": {
        "Cache-Control": "public, max-age=0, must-revalidate",
        "Service-Worker-Allowed": "/blog/"
      }
    }
  ]
}

This is the url: https://it-pixartprinting-blog.vercel.app/blog/ (all assets and scripts return 404).

Have you any idea hot to solve this? We need to use subfolder because a reverse proxy must be pointed.

Thanks in advance and kind regards,

Davide

[KerneggerTim]

I think changing line 154 in build.ts should fix this but I'm not sure if that affects other things

From:

  let publicPath = ((nuxtConfigFile.build && nuxtConfigFile.build.publicPath) ? nuxtConfigFile.build.publicPath : '/_nuxt/').replace(/^\//, '')

To:

  let publicPath = ((nuxtConfigFile.build && nuxtConfigFile.build.publicPath) ? nuxtConfigFile.build.publicPath : (nuxtConfigFile.router && nuxtConfigFile.router.base) ? `/${nuxtConfigFile.router.base.split('/').filter(Boolean).join('/')}/_nuxt/` : '/_nuxt/').replace(/^\//, '')

i created a PR for this issue https://github.com/nuxt/vercel-builder/pull/682

[KerneggerTim]

@DidoMarchet A solution for this problem is to use redirects in vercel.json.

Here's an example:

{
  "redirects": [
    {
      "source": "/",
      "destination": "/blog",
      "permanent": true
    },
    {
      "source": "/blog/_nuxt/(.*)",
      "destination": "/_nuxt/$1",
      "permanent": true
    }
  ],
}

Using redirects and routes at the same time in vercel.json is not possible. Here is the documentation mentioning how to upgrade https://vercel.com/docs/project-configuration#legacy/routes/upgrading

[simonmaass]

I just encontered this problem... cannot get the service worker to work... with nuxt/pwa.... any ideas @KerneggerTim <3

[KerneggerTim]

@simonmaass did you check the nuxt deployment docs for nuxt/pwa on vercel?

https://nuxtjs.ir/faq/now-deployment#service-worker-with-nuxt-pwa-module

[simonmaass]

@KerneggerTim yeah i did - thank you!

The problem is the following:

Nuxt pwa is generating the following code in the workbox:

const workbox = new Workbox('/blog/sw.js', {
    scope: '/blog/'
  })

But when deploying to vercel the service worker is availble under '/sw.js'

If i add this to the vercel.json config:

"redirects": [
    {
      "source": "/",
      "destination": "/blog",
      "permanent": true
    },
    {
      "source": "/blog/sw.js",
      "destination": "/sw.js",
      "permanent": true
    },
    {
      "source": "/blog/_nuxt/(.*)",
      "destination": "/_nuxt/$1",
      "permanent": true
    }
  ]

Then i get the following error in the browser: The script resource is behind a redirect, which is disallowed.

[kjellski]

Did anyone find a solution to this? I'm currently having a problem that when I deploy to vercel, and only then, router.locale is undefined.

[terwer]

face the same issue.

https://siyuan-blog-agsveapjd-terwergreen.vercel.app/s/test

this is not rendered as ssr in vercel.But it works in local