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 相关文章推荐
分享一个asp.net pager分页控件
Jan 04 Javascript
多种方法判断Javascript对象是否存在
Sep 22 Javascript
javascript实现des解密加密全过程
Apr 03 Javascript
jQuery/CSS3图片特效插件整理推荐
Dec 07 Javascript
30个经典的jQuery代码开发技巧
Dec 15 Javascript
jQuery实现点击图片翻页展示效果的方法
Feb 16 Javascript
深入理解JavaScript系列(47):对象创建模式(上篇)
Mar 04 Javascript
jQuery Ajax 实例代码 ($.ajax、$.post、$.get)
Apr 29 Javascript
jQuery返回定位插件详解
May 15 jQuery
Node.js 实现简单的无侵入式缓存框架的方法
Jul 21 Javascript
jQuery 隐藏/显示效果函数用法实例分析
May 20 jQuery
原生微信小程序开发中 redux 的使用详解
Feb 18 Javascript
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
在PHP中利用XML技术构造远程服务(上)
2006/10/09 PHP
php&java(二)
2006/10/09 PHP
php 验证码(倾斜,正弦干扰线,黏贴,旋转)
2013/06/29 PHP
如何通过Linux命令行使用和运行PHP脚本
2015/07/29 PHP
PHP信号量基本用法实例详解
2016/02/12 PHP
php编程中echo用逗号和用点号连接的区别
2016/03/26 PHP
详解PHP素材图片上传、下载功能
2019/04/12 PHP
tp5框架内使用tp3.2分页的方法分析
2019/05/05 PHP
基于jquery点击自以外任意处,关闭自身的代码
2012/02/10 Javascript
javascript实现日历控件(年月日关闭按钮)
2012/12/12 Javascript
Javascript实现真实字符串剩余字数提示的实例代码
2013/10/22 Javascript
javascript获取select的当前值示例代码(兼容IE/Firefox/Opera/Chrome)
2013/12/17 Javascript
js获取ajax返回值代码
2014/04/30 Javascript
网页禁用右键菜单和鼠标拖动选择方法小结
2015/02/25 Javascript
Vue过滤器的用法和自定义过滤器使用
2017/02/08 Javascript
微信小程序实现手指触摸画板
2018/07/09 Javascript
jQuery实现的自定义轮播图功能详解
2018/12/28 jQuery
小程序文字跑马灯效果
2018/12/28 Javascript
vue实现Input输入框模糊查询方法
2021/01/29 Javascript
node+vue实现文件上传功能
2020/05/28 Javascript
vue将data恢复到初始状态 && 重新渲染组件实例
2020/09/04 Javascript
[32:26]EG vs IG 2018国际邀请赛小组赛BO2 第一场 8.16
2018/08/17 DOTA
Python中异常重试的解决方案详解
2017/05/05 Python
基于Python实现的微信好友数据分析
2018/02/26 Python
Python实现读取机器硬件信息的方法示例
2018/06/09 Python
为什么str(float)在Python 3中比Python 2返回更多的数字
2018/10/16 Python
使用 PyTorch 实现 MLP 并在 MNIST 数据集上验证方式
2020/01/08 Python
Python识别验证码的实现示例
2020/09/30 Python
Pycharm 设置默认解释器路径和编码格式的操作
2021/02/05 Python
Pharmacy Online中文直邮网站:澳洲大型药房
2020/06/27 全球购物
英国最大的在线照明商店:Litecraft
2020/08/31 全球购物
大学生农村教师实习自我鉴定
2013/09/21 职场文书
电气工程师岗位职责
2014/01/01 职场文书
大学运动会通讯稿
2014/01/28 职场文书
教师党员个人总结
2015/02/10 职场文书
java.util.NoSuchElementException原因及两种解决方法
2022/06/28 Java/Android