环境变量未定义 NextJS

Question

我想用 in.env 中的密码设置一个简单的登录，但是当我尝试使用这个变量时，它需要未定义。

代码：

.env.local

REACT_APP_PASS_TOKEN=d61b100cacb60432f97b39b70d9ff5067242a5d9da1acad54738fc65562b8e1b

登录.js

（第一个日志正确打印值，但第二个不正确）

const pass = process.env.REACT_APP_PASS_TOKEN


console.log(`KEY: ${pass}`)

const handleLogin = () => {
    console.log(`KEY: ${pass}`)
  }

Answer 1

你需要一些机制来管理这个过程。 尝试使用 dotenv。 只需使用

npm i dotenv

之后，您需要将此模块附加到您的主应用程序。

require('dotenv').config();

尝试定义变量并为其分配 API 键。

const psw = process.env.REACT_APP_PASS_TOKEN;

然后只需交换 var 名称。 结果应该看起来像：

.env

REACT_APP_PASS_TOKEN=d61b100cacb60432f97b39b70d9ff5067242a5d9da1acad54738fc65562b8e1b

登录.js

const pass = process.env.REACT_APP_PASS_TOKEN;
require("dotenv").config();

const psw = process.env.REACT_APP_PASS_TOKEN;

console.log(`KEY: ${psw}`);

const handleLogin = () => {
  console.log(`KEY: ${psw}`);
};

handleLogin();