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 相关文章推荐
让jQuery与其他JavaScript库并存避免冲突的方法
Dec 23 Javascript
JQuery入门基础小实例(1)
Sep 17 Javascript
跟我学习javascript的函数调用和构造函数调用
Nov 16 Javascript
jQuery实现鼠标经过像翻页和描点链接效果
Aug 08 Javascript
JavaScript中Math对象的方法介绍
Jan 05 Javascript
Bootstrap table 定制提示语的加载过程
Feb 20 Javascript
基于HTML5+JS实现本地图片裁剪并上传功能
Mar 24 Javascript
JavaScript中的回调函数实例讲解
Jan 27 Javascript
jQuery实现的点击显示隐藏下拉菜单功能完整示例
May 17 jQuery
如何解决js函数防抖、节流出现的问题
Jun 17 Javascript
jquery弹窗时禁止body滚动条滚动的例子
Sep 21 jQuery
使用npm命令提示: 'npm' 不是内部或外部命令,也不是可运行的程序的处理方法
May 14 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 处理TXT文件(打开/关闭/检查/读取)
2013/05/13 PHP
php+mysqli使用面向对象方式查询数据库实例
2015/01/29 PHP
ZendFramework2连接数据库操作实例
2017/04/18 PHP
实例讲解PHP表单验证功能
2019/02/15 PHP
top.location.href 没有权限 解决方法
2008/08/05 Javascript
javascript 面向对象编程  function是方法(函数)
2009/09/17 Javascript
JS设置cookie、读取cookie、删除cookie
2015/04/17 Javascript
js实现将选中值累加到文本框的方法
2015/08/12 Javascript
jQuery动画效果图片轮播特效
2016/01/12 Javascript
jQuery form插件之ajaxForm()和ajaxSubmit()的可选参数项对象
2016/01/23 Javascript
Bootstrap树形组件jqTree的简单封装
2016/01/25 Javascript
防止Node.js中错误导致进程阻塞的办法
2016/08/11 Javascript
EasyUI中的dataGrid的行内编辑
2017/06/22 Javascript
如何通过setTimeout理解JS运行机制详解
2019/03/23 Javascript
JS前端知识点 运算符优先级,URL编码与解码,String,Math,arguments操作整理总结
2019/06/27 Javascript
vue中filters 传入两个参数 / 使用两个filters的实现方法
2019/07/15 Javascript
[02:02]2018DOTA2亚洲邀请赛Mineski赛前采访
2018/04/04 DOTA
[15:07]lgd_OG_m2_BP
2019/09/10 DOTA
分数霸榜! python助你微信跳一跳拿高分
2018/01/08 Python
使用Py2Exe for Python3创建自己的exe程序示例
2018/10/31 Python
pycharm 实现显示project 选项卡的方法
2019/01/17 Python
Django用户认证系统 Web请求中的认证解析
2019/08/02 Python
python-序列解包(对可迭代元素的快速取值方法)
2019/08/24 Python
Python中Unittest框架的具体使用
2019/08/27 Python
openCV提取图像中的矩形区域
2020/07/21 Python
linux centos 7.x 安装 python3.x 替换 python2.x的过程解析
2020/12/14 Python
html5中canvas学习笔记1-画板的尺寸与实际显示尺寸
2013/01/06 HTML / CSS
HolidayLettings英国:预订最好的度假公寓、别墅和自助式住宿
2019/08/27 全球购物
中学教师岗位职责
2013/11/26 职场文书
技术学校毕业生求职信分享
2013/12/02 职场文书
秋季校运动会广播稿
2014/02/23 职场文书
少先队学雷锋活动月总结
2014/03/09 职场文书
工作鉴定评语
2014/05/04 职场文书
2014年最新大专生职业生涯规划书范文
2014/09/13 职场文书
opencv 分类白天与夜景视频的方法
2021/06/05 Python
Java由浅入深通关抽象类与接口(上篇)
2022/04/26 Java/Android