VUE依赖webpack分别给开发环境和生产环境配置不同的常量值并在项目中动态引用
当在开发和产品上线的时候,我们经常会遇到在同一个地方由于环境的不同而地址也不同的情况,这时候如果在代码中将该地址写死,那势必会造成上线时手动改动,多人开发及多处使用该地址难以维护等一系列问题,为避免这一问题,我们需在配置文件中分别配置该常量。
一、找到VUE项目中的配置文件:
1.dev.env.js(开发环境);
2.prod.env.js(生产环境)。
二、打开文件后配置参数(该处以分别配置两个环境下的参数'ROOT'为例):
1.在dev.env.js文件中
2.在prod.env.js文件中
配置好之后,我们就可以在项目中引用了。
三、打开项目中的文件,就可使用该参数,
var root=process.env.ROOT;
四、重启项目。
VUE依赖webpack分别给开发环境和生产环境配置不同的常量值并在项目中动态引用的更多相关文章
- Webpack配置区分开发环境和生产环境
在项目开发的时候,我们通常会将程序分为开发环境和生产环境(或者叫线上环境),开发环境通常指的是我们正在开发的这个阶段所需要的一些环境配置,也就是方便我们开发人员调试开发的一种环境:生产环境通常指的是我 ...
- 分离Webpack开发环境与生产环境的配置
这是Webpack+React系列配置过程记录的第五篇.其他内容请参考: 第一篇:使用webpack.babel.react.antdesign配置单页面应用开发环境 第二篇:使用react-rout ...
- webpack深入场景——开发环境和生产环境配置
以前自己写一小项目时,webpack的配置基本就是一套配置,没有考虑生产环境和开发环境的区分,最近在做一个复杂的商城项目接触到了webpack的高级配置,经过两天的研究,写出了一份目前来说比叫满意的配 ...
- webpack开发环境和生产环境切换原理
在package.json中有如下设置: "scripts": { "dev": "node build/dev-server.js" ...
- vue开发环境和生产环境里面解决跨域的几种方法
什么是跨域 跨域指浏览器不允许当前页面的所在的源去请求另一个源的数据.源指协议,端口,域名.只要这个3个中有一个不同就是跨域. 这里列举一个经典的列子: #协议跨域 http://a.baidu. ...
- webpack-dev-middleware 和 webpack-hot-middleware 配置开发环境和生产环境;webpack脚手架;仿vue-cli
webpack-dev-server更新后自带express服务器,已经不需要自己搭建.vue-cli从17年底左右也换成了最新的webpack-dev-server,而不是用webpack-dev- ...
- 从开发一款基于Vue技术栈的全栈热重载生产环境脚手架,我学到了什么
浏览文章前 这一期,我分享给大家三点看源码的小技巧,这也是从别的大佬那总结的. 被反复使用的代码 这样的代码是一个软件的重点函数,一个大神的写法有很多精华值得学习. 穿越时间的代码 如果一段代码10年 ...
- 手把手教你用webpack3搭建react项目(开发环境和生产环境)(一)
开发环境和生产环境整个配置源码在github上,源码地址:github-webpack-react 如果觉得有帮助,点个Star谢谢!! (一)是开发环境,(二)是生产环境. 一.首先创建packag ...
- Webpack4 学习笔记八 开发环境和生产环境配置
webpack resolve属性 webpack 区分开发环境和生产环境 webpack resolve属性 该选项的作用是设置模块如何被解析. resolve.alias: 设置别名, 在vue中 ...
随机推荐
- 用 config drive 配置网络 - 每天5分钟玩转 OpenStack(173)
上一节最后问了大家一个问题:如果 subnet 没有开 DHCP,会是怎样一个情况? 在其他条件不变的情况下,cloud-init 依然会完成那 3 个步骤,也就是说网卡还是会被配置成 dhcp 模式 ...
- 解决eclipse中文字很小
新下载的eclipse4.2.1版本,显示中文字体很小,但是英文比较正常.网上查看要更改字体大小,但是更改后英文也变大了,不是想要的结果. window – preferences – general ...
- ViewPager—01引导页的制作
布局文件 <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:t ...
- 移植 DeepinQQ 到 Fedora 中
本着自由/开源软件的分享精神创作此文,如有任何权力侵害请联系我,我将积极配合. 移植 DeepinQQ 到 Fedora 中 --也不知道是用移植还是迁移更合适 写在前面 首先,在这里要感谢武汉深之度 ...
- 静态链表实现(A-B)+(B-A)【代码】
-----------------------------------------------第一次发代码,写在前面------------------------------------------ ...
- Azure WAF防火墙工作原理分析和配置向导
Azure WAF工作原理分析和配置向导 本文博客地址为:http://www.cnblogs.com/taosha/p/6716434.html ,转载请保留出处,多谢! 本地数据中心往云端迁移的的 ...
- Linux嵌入式开发中常用的两个工具
TFTP 全称:Trivial File Transfer Protocol(简单文件传输协议) 进行小文件传输 在ubuntu下设置TFTP服务器 $ sudo apt-get install tf ...
- 【R】正态检验与R语言
正态检验与R语言 1.Kolmogorov–Smirnov test 统计学里, Kolmogorov–Smirnov 检验(亦称:K–S 检验)是用来检验数据是否符合某种分布的一种非参数检验,通过比 ...
- mpu6050参数获取
MPU6050其实就是一个 I2C 器件,里面有很多寄存器(但是我们用到的只有几个),我们通过读写寄存器来操作这个芯片.所以首要问题就是 STM32 和 MPU6050 的 I2C 通信.1.配置 S ...
- 使用vue-cli构建多页面应用+vux(一)
众所皆知,vue对于构建单页面应该相当方便,但是在项目中难免遇到有多个页面的情况. 1.先安装vue-cli脚手架,具体步骤看vue-cli的官方github地址 https://github.com ...