vue、react项目设置多环境变量

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了vue、react项目设置多环境变量相关的知识,希望对你有一定的参考价值。

参考技术A vue-cli官方说明-模式和环境变量

https://www.jianshu.com/p/3bfa0a92a720

npm i cross-env dotenv dotenv-expand -S

根据实际项目场景添加对应 NODE_ENV 即可

根据上面设置的 NODE_ENV 设置对应的.env文件及内容,如:

.env[mode] 文件内容示例:

增加以上配置后重新启动即可在项目任意地方获取环境变量的值。除此之外也可以直接在 new webpack.DefinePlugin()方法里直接配置对应的环境变量,具体方法如下:
DefinePlugin插件使用说明

npm i cross-env -S

以上是关于vue、react项目设置多环境变量的主要内容,如果未能解决你的问题,请参考以下文章

构建 React 项目后如何设置节点环境变量(运行时)?

vue项目环境变量配置的实现方法

Vue 多环境配置方法

vue-cli项目配置多环境

Vue 环境变量和模式(设置通用baseUrl)

create-react-app多环境配置