search

Home  >  Q&A  >  body text

Nuxt 3 won't render in SSR

So I'm running into a problem, I'm trying to get my private environment variables. I know I can only get them if my page is ssr. The problem is I never disabled it. I logged console.log(process.server) in my page and it always returns false. I find this strange since I have never disabled ssr.

This is my nuxt.config.ts:

// https://nuxt.com/docs/api/configuration/nuxt-config
export default defineNuxtConfig({
    ssr: true,
    routeRules: {
        '/portal/**': { ssr: false },
        '/checkout/**': { ssr: false }
    },
    runtimeConfig: {
        stripeKey: '',
        public: {
            API_BASE_URL: process.env.API_BASE_URL || "http://192.168.1.100:8000/api",
        }
    },
    modules: [
        '@nuxtjs/i18n',
        '@pinia/nuxt',
    ],
    css: [
        '@/assets/css/main.css',
        '@/assets/css/colors.scss',
        'vuetify/lib/styles/main.sass',
        'primevue/resources/themes/lara-light-blue/theme.css',
        'primevue/resources/primevue.css',
        'primeicons/primeicons.css',
        '@fortawesome/fontawesome-svg-core/styles.css'
    ],
    build: {
        transpile: [
            'primevue',
            'vuetify'
        ]
    },
    postcss: {
        plugins: {
            tailwindcss: {},
            autoprefixer: {},
        },
    },
    app: {
        head: {
            script: [{ src: "https://js.stripe.com/v3/" }],
            title: '',
            meta: [

                {
                    name: 'color-scheme',
                    content: 'only light'
                }

            ],
            link: [
                {
                    href: 'https://fonts.googleapis.com/css?family=Material+Icons|Material+Icons+Outlined',
                    rel: 'stylesheet',
                }
            ]
        }
    },
    i18n: {
        lazy: true,
        langDir: "locales",
        strategy: "no_prefix",
        locales: [
            {
                code: 'en',
                iso: 'en',
                name: 'English',
                file: 'en.json'
            },
            {
                code: 'nl-Nl',
                iso: 'nl-NL',
                name: 'Dutch',
                file: 'nl-NL.json'
            }
        ]
    }
})
P粉193307465P粉193307465242 days ago3833

reply all(1)I'll reply

  • P粉684720851

    P粉6847208512024-04-06 11:36:10

    In your browser (also called the "client"), console.log(process.server) will always log false. Please check the server console in your terminal. There, it should also be logged as true unless you are logging in a "client only" component/plugin or in a lifecycle hook like onMounted

    reply
    0
  • Cancelreply