环境变量

NextJs environment-variables

中文传送门

在 Next.js 中，可以通过在 .env.local 或 .env 文件中设置 NODE_ENV 变量来改变应用程序的环境。

Next.js 将在构建时会将 process.env.* 替换为对应的值。

因此你不能对其 使用 对象解构（object destructuring） 语法

将环境变量暴露给浏览器

默认情况下，环境变量仅在 Node.js 环境中可用，在浏览器端无法获取到

为了向浏览器暴露环境变量，你必须在变量前添加 NEXT_PUBLIC_ 前缀。

# .env.local
NEXT_PUBLIC_ANALYTICS_ID=abcdefghijk

另一种方法：

Next.js 支持使用环境变量插件，如 dotenv 或 next.config.js 配置来处理客户端访问环境变量的情况。

// 使用环境变量插件配置
// 在 next.config.js 中配置
module.exports = {
  env: {
    API_KEY: process.env.API_KEY,
  },
};