在 Nuxt.js 的 SPA 模式下 process.env 不可用

Question

I put ENV params in an individual env.json and require it in nuxt.config.js, then extract the content into the env property of nuxt.config.js.

Under Universal and Static mode, it works good. But under SPA mode, it bumps a TypeError with message:

Cannot read property 'name' of undefined

env.json:

{
  "site": {
    "name": "Site Name",
    "slogan": "Some Cool Line",
    "description": "..."
  }
}

nuxt.config.js:

const env = require('./env')

export default {
  mode: 'spa',

  env: {
    ...env
  },

  head: {
    titleTemplate: (page_title) => {
      return page_title
          ? page_title + ' | ' + process.env.site.name
          : process.env.site.name + ' - ' + process.env.site.slogan
    },

...

Any sparks on how this problem can be solved?

Answer 1

I was trying to do the similar thing and this is what I did

env: {
  ...env
},

// Global page headers (https://go.nuxtjs.dev/config-head)
head: {
  // titleTemplate: '%s - nuxt-https',
  titleTemplate: (page_title) => {
    return this
      ? page_title + ' | ' + this.default.env.site.name // process.env.site.name
      : process.env.site.name + ' - ' + process.env.site.slogan
  },
  title: 'Initial Title',
  ...
},