Search code examples
nuxt.jsserver-side-renderingnuxt3.js

Nuxt 3 without SSR except 1 route


My website doesn't require SSR except for the collection/** route.

nuxt.config.js

export default defineNuxtConfig({
  modules: ["@nuxtjs/tailwindcss", "nuxt-icon"],
  ssr: false,
  routeRules: {
    "collection/**": {
      ssr: true,
    },
  },

I'm hosting on firebase. When I build/deploy with npx nuxi generate all routes work without ssr. When I build/deploy with NITRO_PRESET=firebase npm run build I get a "Page not found - This file does not exist and there was no index.html found in the current directory or 404.html in the root directory." error.

firebase.json

"hosting": {
    "public": ".output/public",
    "site": "<my-site>",
    "ignore": [
      "firebase.json",
      "**/.*",
      "**/node_modules/**"
    ]
  },

How can I deploy a non-SSR Nuxt 3 app to Firebase hosting where one route has SSR enabled?


Solution

  • There is many ways to import your aplication on different hosting, some of them required specific ways to setup, so you need to inspect that correct way to deploy your aplication, or just try some other hosting.

    One more question i can ask you, is your domain set up correctly?

    Did you use npm run generate to get dist folder? If you have it then add this block in your firebase.json.

        "rewrites" : [
            {
              "source": "**",
              "destination":"/index.html"
            }
        ]
    

    And change public path to dist folder.

    "hosting": {
        "public": "dist",    
        "site": "<my-site>",
        "ignore": [
          "firebase.json",
          "**/.*",
          "**/node_modules/**"
        ]
      },