关于如何在部署环境修改process.env & 本地测试

missonce 发布于2019-08-23 12:12 / 2387人阅读

摘要：前言最近在搞一些监控的东西，需要根据不同的环境上报到不同的地址，中间遇到了一些问题，在这里简单总结分享下。关于假如你对相关的概念还不熟悉，请移步环境变量的那些事儿这篇文章总结的比较好。作为一个对象，它对于应用程序始终是可用的，故无需使用。

前言

最近在搞一些监控的东西，需要根据不同的环境上报到不同的地址，中间遇到了一些问题，在这里简单总结分享下。

关于process.env

假如你对process.env 相关的概念还不熟悉，请移步：
Node环境变量 process.env 的那些事儿 , 这篇文章总结的比较好。

webpack 在构建的时候，可以为process.env 赋值：

// Do this as the first thing so that any code reading it knows the right env.
process.env.BABEL_ENV = "development";
process.env.NODE_ENV = "development";


// Do this as the first thing so that any code reading it knows the right env.
process.env.BABEL_ENV = "production";
process.env.NODE_ENV = "production";

process 对象是一个 global （全局变量），提供有关信息，控制当前 Node.js 进程。作为一个对象，它对于 Node.js 应用程序始终是可用的，故无需使用 require()。

假如你需要根据不同的部署环境做一些区分，比如：

if (process.env.env === "test") {
  BASE_API_1 = "xxx
} else if (process.env.env === "uat") {
  BASE_API_1 = "xxx
} else if (process.env.env === "staging") {
  BASE_API_1 = "xxx
} else if (process.env.env === "live") {
  BASE_API_1 = "xxx"
} else {
  BASE_API_1 = "xxx";
}

比如用的是jenkins, 构建的时候会自动给环境变量加一个env 属性，也就是上面看到的env.env, 不同的环境会有不同的值，比如 uat, staging, live;

本地构建的时候，是取不到这个值的，因为没有这个环境。但是你也可以手动来赋值，比如给env.env 赋值为"test", 就可以在终端执行：

env=test yarn start

随便打印一下：

console.log(process.env.env);

这样就可以了 :)

希望对大家有所启发，谢谢。

GPU服务器海外云主机本地测试环境网站本地测试环境测试环境部署部署测试环境

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/98110.html

实战Vue简易项目（2）定制开发环境

摘要：至于，为什么跟踪文件因为这个功能是开发环境下独有的，要修改开发环境吖，必然找开发环境的配置文件进行跟踪。测试可行性重启项目后，在浏览器中输入是你本地，可通过查看能够访问，就说明局域网内的其他端可以访问。然而，这样并没有结束。本章内容包含上一章思考的解决，还有一些其它的定制... CSS预处理关于对.vue文件模块处理规则的配置依次可在build/webpack.base.conf....

woshicixide 2019-08-23 10:33 评论0 收藏0
Vue-项目从本地搭建到线上部署（wǒ shì biaō tí dǎng）

摘要：放置在目录下或通过绝对路径被引用。对于相关来说，我们推荐使用而不是直接链式指定。在不更改配置文件的情况下，前端页面迭代发布，不需要重启服务。作者：gauseen 0. 关于 Vuejs 简介：Vue (读音 /vjuː/，类似于 view) 是一套用于构建用户界面的渐进式框架，易用、灵活、高效。生态系统项目介绍 awesome-vue Vue.js 相关很棒的...

Arno 2019-08-26 13:49 评论0 收藏0
前端自动部署 - Shell脚本

前言前端部署服务器，需要经过打包、迁移、部署、回退操作，如果每次都手动处理，那么容易出错还浪费时间，自动化部署又比较复杂，那么选择shell脚本做自动化，也是一个不错的选择，具体实现如下：项目环境执行自动化构建的前端项目myweb项目通过命令构建测试环境文件或生产环境文件linux服务器，nginx部署项实现原理一、构建一个前端项目通过cra构建前端项目，修改配置文件，通过传递配置参数，配置测试环...

社区管理员 2022-10-08 14:51 评论0 收藏0
使用Docker-compose打包整个网站项目一键部署

一、前言我们常常见到很多比较棒的开源项目，但在本地安装运行的话就会很复杂，要配置不同的环境，安装不同的依赖，好一点的会用docker直接拉取，或者打包好。这些无疑都会增加初学者上手的成本，所以这篇文章总结了下目前比较常用的解决方法之一：使用docker-compose同时管理多个服务，只需要一行命令docker compose up -d，就可以启动一个包含后端项目、前端项目、数据库的完整服务。而...

社区管理员 2022-10-08 14:56 评论0 收藏0
业务代码如何判断生产/开发环境

摘要：开发环境和生产环境分离的原因在开发时，会产生或者是测试的代码，这些代码不应该出现在生产环境中。当项目部署时，往往会将代码进行一系列的压缩来优化它，如此会彻底破坏代码的可读性。方案二使用这个参数来辨别开发环境。开发环境和生产环境分离的原因在开发时，会产生 debug 或者是测试的代码，这些代码不应该出现在生产环境中。当项目部署时，往往会将代码进行一系列的压缩来优化它，如此会彻底破坏代...

Jackwoo 2019-08-23 11:34 评论0 收藏0