通过 100 多个技巧学习 Nuxt!

.env

.env 文件指定您的构建/开发时环境变量。
应将此文件添加到您的 .gitignore 文件中,以避免将密钥推送到您的存储库。

开发、构建和生成时

Nuxt CLI 在开发模式以及运行 nuxi buildnuxi generate 时内置了 dotenv 支持。

除了任何进程环境变量之外,如果您的项目根目录中有一个 .env 文件,它将在开发、构建和生成时自动加载。 您在其中设置的任何环境变量都可以在您的 nuxt.config 文件和模块中访问。

.env
MY_ENV_VARIABLE=hello
请注意,从 .env 中删除变量或完全删除 .env 文件不会取消已设置的值。

自定义文件

如果您想使用不同的文件 - 例如,使用 .env.local.env.production - 您可以通过在使用 nuxi 时传递 --dotenv 标志来实现。

终端
npx nuxi dev --dotenv .env.local

在开发模式下更新 .env 时,Nuxt 实例会自动重启,以将新值应用于 process.env

在您的应用程序代码中,您应该使用 运行时配置 而不是纯粹的环境变量。

生产环境

在您的服务器构建完成后,您负责在运行服务器时设置环境变量。

此时不会读取您的 .env 文件。 如何执行此操作因每个环境而异。

做出此设计决策是为了确保跨各种部署环境的兼容性,其中一些环境可能没有可用的传统文件系统,例如无服务器平台或 Cloudflare Workers 等边缘网络。

由于 .env 文件不会在生产环境中使用,因此您必须使用您的托管环境提供的工具和方法显式设置环境变量。 以下是一些常见方法

  • 您可以使用终端将环境变量作为参数传递
    $ DATABASE_HOST=mydatabaseconnectionstring node .output/server/index.mjs
  • 您可以在 shell 配置文件(例如 .bashrc.profile)中设置环境变量。
  • 许多云服务提供商(例如 Vercel、Netlify 和 AWS)都提供了通过其仪表板、CLI 工具或配置文件来设置环境变量的界面。

生产环境预览

出于本地生产环境预览的目的,我们建议使用 nuxi preview,因为使用此命令,为方便起见,.env 文件将加载到 process.env 中。 请注意,此命令需要将依赖项安装在包目录中。

或者,您可以使用终端将环境变量作为参数传递。 例如,在 Linux 或 macOS 上

终端
DATABASE_HOST=mydatabaseconnectionstring node .output/server/index.mjs

请注意,对于纯静态站点,在预渲染项目后无法设置运行时配置。

请在 文档 > 指南 > 深入学习 > 运行时配置 中了解更多信息。
如果您想使用在构建时设置的环境变量,但不关心后续更新(或仅需要在应用程序内部以反应式方式更新它们),则 appConfig 可能是一个更好的选择。 您可以在 nuxt.config 中(使用环境变量)以及项目中的 ~/app.config.ts 文件中定义 appConfig
请在 文档 > 指南 > 目录结构 > 应用配置 中了解更多信息。