当在开发和产品上线的时候,我们经常会遇到在同一个地方由于环境的不同而地址也不同的情况,这时候如果在代码中将该地址写死,那势必会造成上线时手动改动,多人开发及多处使用该地址难以维护等一系列问题,为避免这一问题,我们需在配置文件中分别配置该常量。

一、找到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分别给开发环境和生产环境配置不同的常量值并在项目中动态引用的更多相关文章

  1. Webpack配置区分开发环境和生产环境

    在项目开发的时候,我们通常会将程序分为开发环境和生产环境(或者叫线上环境),开发环境通常指的是我们正在开发的这个阶段所需要的一些环境配置,也就是方便我们开发人员调试开发的一种环境:生产环境通常指的是我 ...

  2. 分离Webpack开发环境与生产环境的配置

    这是Webpack+React系列配置过程记录的第五篇.其他内容请参考: 第一篇:使用webpack.babel.react.antdesign配置单页面应用开发环境 第二篇:使用react-rout ...

  3. webpack深入场景——开发环境和生产环境配置

    以前自己写一小项目时,webpack的配置基本就是一套配置,没有考虑生产环境和开发环境的区分,最近在做一个复杂的商城项目接触到了webpack的高级配置,经过两天的研究,写出了一份目前来说比叫满意的配 ...

  4. webpack开发环境和生产环境切换原理

    在package.json中有如下设置: "scripts": {    "dev": "node build/dev-server.js" ...

  5. vue开发环境和生产环境里面解决跨域的几种方法

    什么是跨域   跨域指浏览器不允许当前页面的所在的源去请求另一个源的数据.源指协议,端口,域名.只要这个3个中有一个不同就是跨域. 这里列举一个经典的列子: #协议跨域 http://a.baidu. ...

  6. webpack-dev-middleware 和 webpack-hot-middleware 配置开发环境和生产环境;webpack脚手架;仿vue-cli

    webpack-dev-server更新后自带express服务器,已经不需要自己搭建.vue-cli从17年底左右也换成了最新的webpack-dev-server,而不是用webpack-dev- ...

  7. 从开发一款基于Vue技术栈的全栈热重载生产环境脚手架,我学到了什么

    浏览文章前 这一期,我分享给大家三点看源码的小技巧,这也是从别的大佬那总结的. 被反复使用的代码 这样的代码是一个软件的重点函数,一个大神的写法有很多精华值得学习. 穿越时间的代码 如果一段代码10年 ...

  8. 手把手教你用webpack3搭建react项目(开发环境和生产环境)(一)

    开发环境和生产环境整个配置源码在github上,源码地址:github-webpack-react 如果觉得有帮助,点个Star谢谢!! (一)是开发环境,(二)是生产环境. 一.首先创建packag ...

  9. Webpack4 学习笔记八 开发环境和生产环境配置

    webpack resolve属性 webpack 区分开发环境和生产环境 webpack resolve属性 该选项的作用是设置模块如何被解析. resolve.alias: 设置别名, 在vue中 ...

随机推荐

  1. Win7+CentOS双系统(二)

    在之前的文章中我们实现了Win7+CentOS6.3双系统的安装和使用,不过比较不幸的是在CentOS6.4版本时其安装文件大小已经超过了FAT文件系统所能容纳的单个文件大小4G.我们使用FAT文件系 ...

  2. c# 逆波兰式实现计算器

    语文不好,不太会组织语言,希望不要太在意. 如题,先简要介绍一下什么是逆波兰式  通常我们在写数学公式的时候  就是a+b+c这样,这种表达式称为中缀表达式,逆波兰式又称为后缀表达式,例如a+b 后缀 ...

  3. flowJS源码个人分析

    刚刚在腾讯云技术社区前端专栏中看到一篇腾讯高级前端工程师写的<一个只有99行代码的js流程框架>觉得很屌,感觉是将后台的简单的工作流思维搬到了前端js实现,本人不才在这里拜读解析下源码,而 ...

  4. Load 数据1

    Druid 的load 数据分为两类 :批量load(历史数据) 和实时load(新数据) ,本文介绍批量load 数据 indexing 服务 批量load 数据需要用到indexing 服务,它是 ...

  5. Eclipse 中 Java 项目中 .settings 文件夹作用

    今天工作时,因对 .settings 文件夹误操作,耗时 6 个多小时,才了解到原因就出在 .settings 文件夹.经查阅资料,对 .settings 做如下整理: 就如setting这个名字,就 ...

  6. contos 7/redhat 7 安装mysql

    1.给网卡配置ip.掩码.网关   2.添加dns,编辑文件:/etc/resolve.conf nameserver 202.96.209.133       //上海本地dns nameserve ...

  7. Linux - PCB之task_struct结构体

     task_struct结构描述  1. 进程状态(State) 进程执行时,它会根据具体情况改变状态 .进程状态是调度和对换的依据.Linux中的进程主要有如下状态,如表4.1所示. 内核表示 含义 ...

  8. Java设计模式:代理模式(一)

    问题的提出 现在生活中,常常在微信朋友圈里面看到代购的信息,你想在国外买什么,香港买什么,但是又懒得自己过去,于是常常委托别人帮忙买奶粉买那啥的.这类问题的缘由是因为客户和原产地没有直接的接触,所以需 ...

  9. 对象Equals相等性比较的通用实现

    最近编码的过程中,使用了对象本地内存缓存,缓存用了Dictionary<string,object>, ConcurrentDictionary<string,oject>,还 ...

  10. 由CODEVS笨小猴1053引发的一些思考

    #include<cstdio> #include<cstring> ]; ]; int check(int n) { ||n==) ; ;m*m<=n;++m) ) ; ...