如何在React应用程序中设置生产环境变量?(托管在Netlify上)

我想知道如何在React中设置环境变量来隐藏我的API密钥?

我在Netlify上托管该应用程序,因此不确定是否重要。我能够在开发中成功完成此操作,但是当它投入生产时,api密钥将变为未定义。

在我的.env文件中,当我有:

REACT_APP_API_KEY="my_api_key_etc"

在我的app.js中,我有:

const apiKey = process.env.REACT_APP_API_KEY

当我console.log(apiKey)在开发中(npm start)时:它可以很好地显示我的api,但是在生产模式下(npm run build):则显示未定义。

我已经尝试创建另外两个文件,例如.env.development.env.production,但是仍然行不通。

另外,我确保.env文件不在src文件夹中。

你们认为与Netlify有关吗?

提前致谢!

再见StackExchange

理想情况下,您应该在仪表板中设置这些变量。转到您的项目设置,并在环境中添加此变量以及任何其他变量:

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章

如何在Azure上为我的应用程序服务设置环境变量?

如何在heroku应用程序中为谷歌凭据设置环境变量

无法在Spark应用程序中设置环境变量

应用程序设置文件中的环境变量

如何在Circle CI中设置环境变量以在应用程序中用作process.env.FOO

在 Meteor/React 应用程序中访问环境变量

如何在 Netlify 中添加 .env 文件和托管 React 应用程序?

如何在React JS Web应用程序内访问环境变量?

如何在生产环境上设置ASP.NET 5环境变量

如何在我的Spring Boot应用程序中从AWS访问环境变量

如何在Linux for Rails应用程序中添加环境变量?

如何在使用create-react-app创建的应用中设置环境变量?

如何在React JS ..中设置环境变量?

如何在托管实例组级别的VM上设置环境变量

如何在Azure托管的React应用中使用环境变量

如何在Android应用程序中设置测试标志,以区分在测试环境和生产环境中运行该应用程序?

在哪里设置应用程序的环境变量?

应用程序特定的环境变量设置

Jboss,设置应用程序的环境变量

如何使用.bash_profile为OS X Mavericks中的GUI应用程序设置环境变量?

如何在Yeoman Ember应用程序中设置/获取特定于环境的变量

如何为Gnome终端仿真器应用程序设置TERM环境变量?

如何为特定Flatpak应用程序永久设置环境变量?

如何设置PATH或其他环境变量,以便X应用程序可以访问它?

在citrix中运行已发布的应用程序之前设置环境变量

在phoenix应用程序中设置和加载环境变量

在已部署的流应用程序中设置环境变量值

如何在 Windows 操作系统的 Python 应用程序中访问环境变量值

如何将连接字符串正确存储在环境变量中以供生产ASP.Net Core MVC应用程序检索