通过 100+ 技巧学习 Nuxt!

运行时配置

了解如何从 Nuxt 2 迁移到 Nuxt 3 运行时配置。

如果您希望在您的 Nuxt 3 应用程序中引用环境变量,您需要使用运行时配置。

当在您的组件中引用这些变量时,您将需要在您的 setup 方法(或 Nuxt 插件)中使用 useRuntimeConfig 组合式函数。

在您应用程序的 server/ 部分,您可以直接使用 useRuntimeConfig,无需任何导入。

文档 > 指南 > 深入了解 > 运行时配置 中阅读更多信息。

迁移

  1. 将您在应用程序中使用的任何环境变量添加到 nuxt.config 文件的 runtimeConfig 属性中。
  2. 在您的应用程序的 Vue 部分,将 process.env 迁移到 useRuntimeConfig
export default defineNuxtConfig({
  runtimeConfig: {
    // Private config that is only available on the server
    apiSecret: '123',
    // Config within public will be also exposed to the client
    public: {
      apiBase: '/api'
    }
  },
})