时间戳

首页 > 解决方案 > 反应在开发中工作的环境变量，而不是在部署到 netlify

reactjs - 反应在开发中工作的环境变量，而不是在部署到 netlify

问题描述

在我的 PC 上一切正常，但在我部署到 netlify 后，我的环境变量未定义。这就是我在该州所拥有的。

let apikey;

if(process.env.NODE_ENV !== 'production') {
    apikey = process.env.REACT_APP_APIKEY;
    console.log(apikey);
} else {
    apikey = process.env.APIKEY;
    console.log(apikey);
}

网络化设置

然而仍然不确定:)

Console.log 告诉我变量未定义

标签： reactjsenvironment-variablesnetlify

解决方案

在 netlify 中，除非您在构建期间将它们构建到脚本中，否则您将无法访问客户端的环境变量。这就是为什么您不应该在客户端脚本的构建中存储密钥的原因。

Netlify 上没有服务器端，除非使用函数。如果您使用的是 Netlify 函数（lambda 函数），那么通过管理 UI 访问环境变量设置不会有问题。

在大多数情况下，只有构建环境知道并且可以使用环境变量，因为它们是在构建过程中在 shell 中设置的，但是您的代码不是从构建环境提供的 - 它在构建后无需修改即可提供。

将您的 REACT_APP_APIKEY 存储在 Netlify 构建环境变量中，并在运行构建命令之前使用脚本构建 .env。

脚本/create-env.js

const fs = require('fs')
fs.writeFileSync('./.env',`REACT_APP_APIKEY=${process.env.REACT_APP_APIKEY}`)

将脚本作为构建的一部分运行

node ./scripts/create-env.js

推荐阅读