无法在nuxt.config.js中访问env [英] cannot access env inside nuxt.config.js

问题描述

我正在SPA模式下使用Nuxt v2.12.2，并希望在默认的 head 中使用env变量.我正在使用 @ nuxtjs/dotenv ，但是在呈现页面时， baseUrl 是未定义的.

I am using Nuxt v2.12.2 in SPA mode and want to use env variables within the default head. I am using @nuxtjs/dotenv however when the page is rendered the baseUrl is undefined.

我可以从页面布局内很好地访问 BaseUrl ，但不能从 nuxt.config.js 内部访问，如下所示.

I am able to access BaseUrl from within page layouts fine, but not from within nuxt.config.js like below.

.env

BASE_URL=https://example.com

nuxt.config.js

const env = import('dotenv')
env.config()

export default {
  mode: 'spa',

  generate: {
    fallback: true
  },

  env: {
    baseUrl: process.env.BASE_URL || 'http://localhost:3000'
  },

  head: {
    meta: [
      {
        hid: 'og:image',
        name: 'og:image',
        content: process.env.baseUrl + '/og/facebook.png'
      }
    ],
  },

  modules: [
    '@nuxtjs/dotenv'
  ]

  ...
}

设置 head 属性时，尚未设置

推荐答案

process.env.baseUrl .

一种解决方案是对 head 使用函数，该功能将在设置 env 后运行:

One solution is to use a function for head, which would be run after the env is setup:

export default {
  head() {
    return {
      title: this.$route?.title,
      meta: [
        {
          hid: 'og:image',
          name: 'og:image',
          content: process.env.baseUrl + '/og/facebook.png'
        }
      ]
    }
  }
}

这篇关于无法在nuxt.config.js中访问env的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！