angular6根据environments配置文件更改开发所需要的环境的方法


Posted in Javascript onMarch 06, 2019

前端开发过程中,我们常常需要根据需求去运行或者打包不同环境的代码,幸运的是,angular给我们提供了environments配置,但是angular6.x的配置方式和angular的其他版本的配置方式是有所不同的,下面我就分别介绍在测试test、预生产pre环境下实现environments配置。

一、angular6.x下environments的配置

首先,在environments文件夹下创建environment.test.ts和environment.pre.ts文件,如下图

angular6根据environments配置文件更改开发所需要的环境的方法

然后分别在里面添加如下内容

angular6根据environments配置文件更改开发所需要的环境的方法

angular6根据environments配置文件更改开发所需要的环境的方法

然后找到angular.json文件,在architect对象下的configurations下添加如下代码:

angular6根据environments配置文件更改开发所需要的环境的方法

然后在找到serve,添加如下的代码

angular6根据environments配置文件更改开发所需要的环境的方法

可以通过运行ng serve --configuration=test或者ng serve -c test课件在控制台打印:

{production: false, path: "https://test.webapi.sxmaps.com/"}
    path: "https://test.webapi.sxmaps.com/"
    production: false
  __proto__: Object

同理运行ng serve --configuration=pre或者ng serve -c pre可获取到预生产环境的域名,所以,你只需要在需要用到环境变量的地方引入即可,如

import {environment} from '../environments/environment';

二、angular其他版本environments的配置

同样的,首先在environments创建environment.test.ts和environment.pre.ts,然后按照上文的步骤,在里面添加相同的内容,然后去到angular-cli.json文件找到environments,在里面添加如何内容:

angular6根据environments配置文件更改开发所需要的环境的方法

然后通过运行ng s --env=test就可以运行测试环境了,在需要的地方引入environment即可。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
js实现图片拖动改变顺序附图
May 13 Javascript
超级简单的jquery操作表格方法
Dec 15 Javascript
jQuery的观察者模式详解
Dec 22 Javascript
在jQuery中处理XML数据的大致方法
Aug 14 Javascript
javascript事件模型介绍
May 31 Javascript
使用JQuery中的trim()方法去掉前后空格
Sep 16 Javascript
jQueryUI Sortable 应用Demo(分享)
Sep 07 jQuery
移动端效果之Swiper详解
Oct 09 Javascript
Spring Boot/VUE中路由传递参数的实现代码
Mar 02 Javascript
JavaScript设计模式之工厂模式和抽象工厂模式定义与用法分析
Jul 26 Javascript
用JS实现飞机大战小游戏
Jun 09 Javascript
vue实现列表垂直无缝滚动
Apr 08 Vue.js
vue项目前端埋点的实现
Mar 06 #Javascript
vue2.0结合Element-ui实战案例
Mar 06 #Javascript
JS使用JSON.parse(),JSON.stringify()实现对对象的深拷贝功能分析
Mar 06 #Javascript
jQuery使用$.extend(true,object1, object2);实现深拷贝对象的方法分析
Mar 06 #jQuery
微信小程序利用swiper+css实现购物车商品删除功能
Mar 06 #Javascript
JS实现数组深拷贝的方法分析
Mar 06 #Javascript
node.js中ws模块创建服务端和客户端,网页WebSocket客户端
Mar 06 #Javascript
You might like
异世界新番又来了,同样是从零开始,男主的年龄降到5岁
2020/04/09 日漫
php项目打包方法
2008/02/18 PHP
php循环语句 for()与foreach()用法区别介绍
2012/09/05 PHP
php按百分比生成缩略图的代码分享
2014/05/10 PHP
windows下配置php5.5开发环境及开发扩展
2014/12/25 PHP
php版微信自动获取收货地址api用法示例
2016/09/22 PHP
php简单生成一组与多组随机字符串的方法
2017/05/09 PHP
Laravel框架控制器的middleware中间件用法分析
2019/09/30 PHP
在for循环中length值是否需要缓存
2015/07/27 Javascript
JavaScript的Ext JS框架中的GridPanel组件使用指南
2016/05/21 Javascript
HTML5+jQuery插件Quicksand实现超酷的星际争霸2兵种分类展示效果(附demo源码下载)
2016/05/25 Javascript
ashx文件获取$.ajax()方法发送的数据
2016/05/26 Javascript
AngularJS 所有版本下载地址
2016/09/14 Javascript
JS实现touch 点击滑动轮播实例代码
2017/01/19 Javascript
微信小程序 Toast自定义实例详解
2017/01/20 Javascript
从零开始学习Node.js系列教程四:多页面实现的数学运算示例
2017/04/13 Javascript
JavaScript中常见内置函数用法示例
2018/05/14 Javascript
解决vue router组件状态刷新消失的问题
2018/08/01 Javascript
JavaScript ES6箭头函数使用指南
2018/12/30 Javascript
jQuery实现小火箭返回顶部特效
2020/02/03 jQuery
Vue数组响应式操作及高阶函数使用代码详解
2020/08/01 Javascript
[01:16:37]【全国守擂赛】第三周决赛 Dark Knight vs. 一个弱队
2020/05/04 DOTA
python OpenCV GrabCut使用实例解析
2019/11/11 Python
django admin后管定制-显示字段的实例
2020/03/11 Python
python 瀑布线指标编写实例
2020/06/03 Python
如何基于Python实现word文档重新排版
2020/09/29 Python
西班牙土拨鼠床垫公司,感觉在云端:Marmota
2019/03/18 全球购物
元旦晚会上单位领导演讲稿
2014/01/05 职场文书
上学迟到的检讨书
2014/01/11 职场文书
公共场所禁烟标语
2014/06/25 职场文书
品牌转让协议书
2014/08/20 职场文书
2015年学校体育工作总结
2015/04/22 职场文书
队名及霸气口号大全
2015/12/25 职场文书
Go语言切片前或中间插入项与内置copy()函数详解
2021/04/27 Golang
python 实现的截屏工具
2021/05/08 Python
你知道哪几种MYSQL的连接查询
2021/06/03 MySQL