nuxtjs 上推荐的动态运行时配置技术（dotenv 除外）

Question

我一直在尝试使用publicRuntimeConfig / privateRuntimeConfig 在 nuxt 2.4.1 上，我在 nuxt.config.js

上定义了我的运行时配置如下

publicRuntimeConfig: {
    DATA_API_HOST_URL: process.env.VUE_APP_DATA_API_HOST_URL,
  },
  privateRuntimeConfig: {
    AUTH_APP_CLIENT_SECRET: process.env.VUE_APP_AUTH_APP_CLIENT_SECRET,
  },

并在我的 login.vue

上按如下方式调用它

asyncData( ctx ) {
  console.log(ctx.$config.DATA_API_HOST_URL)
  //some activity
}

密钥显示在 $config 上 asyncData 内。我调试了 chrome 开发工具。但是值不是从 process.env.VUE_APP_DATA_API_HOST_URL 读取的。该值显示为 undefined。但是，process.env.VUE_APP_DATA_API_HOST_URL 显示值 OK。重点是远离 process.env.
this.$config.DATA_API_HOST_URL 也不访问值。
'${DATA_API_HOST_URL}' 显示在示例中，但我相信它仅适用于 asyncData[=42= 的显式参数声明] 喜欢 asyncData( { $config : {DATA_API_HOST_URL}).

当我使用 DATA_API_HOST_URL: process.env.VUE_APP_DATA_API_HOST_URL || 'https://test.api.com' 传递值时，它似乎可以使用 ctx.$config.DATA_API_HOST_URL![=50= 很好地复制值]

看我复制process.env到*RuntimeConfig有问题！

导入和使用运行时配置的推荐方式是什么？

Answer 1

我认为您应该使用 Docker 来设置动态运行时配置，例如下面的 link：

https://dev.to/frontendfoxes/dockerise-your-nuxt-ssr-app-like-a-boss-a-true-vue-vixens-story-4mm6

Answer 2

根据您标记的 Nuxt 博客 post 中的文档，您尝试使用的功能已在 2.13 中发布（如果我没有误解的话，您正在使用 2.4）。这可能是您所看到的行为背后的原因。我建议更新您的项目依赖项或尝试其他方法。

nuxtjs 上推荐的动态运行时配置技术（dotenv 除外）

Recommended dynamic runtime configuration technique on nuxtjs (other than dotenv)

vue.js

runtime-configuration

nuxt.js