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 相关文章推荐
定义select的边框颜色
Apr 28 Javascript
JS Excel读取和写入操作(模板操作)实现代码
Apr 11 Javascript
Javascript获取HTML静态页面参数传递值示例
Aug 18 Javascript
toggle一个div显示或隐藏且可扩展成自定义下拉框
Sep 12 Javascript
JS截取字符串实例详解
Nov 24 Javascript
jquery ajax双击div可直接修改div中的内容
Mar 04 Javascript
jQuery实现图片局部放大镜效果
Mar 17 Javascript
jQuery实现页面点击后退弹出提示框的方法
Aug 24 Javascript
vue 巧用过渡效果(小结)
Sep 22 Javascript
微信小程序生成二维码的示例代码
Mar 29 Javascript
Emberjs 通过 axios 下载文件的方法
Sep 03 Javascript
Node.js API详解之 V8模块用法实例分析
Jun 05 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 tp验证表单与自动填充函数代码
2012/02/22 PHP
Yii2中多表关联查询hasOne hasMany的方法
2017/02/15 PHP
Laravel5.4框架使用socialite实现github登录的方法
2019/03/20 PHP
php 利用socket发送GET,POST请求的实例代码
2020/07/04 PHP
基于jquery的网站幻灯片切换效果焦点图代码
2013/09/15 Javascript
JS替换文本域内的回车示例
2014/02/18 Javascript
极力推荐一款小巧玲珑的可视化编辑器bootstrap-wysiwyg
2016/05/27 Javascript
Bootstrap框架安装使用详解
2017/01/21 Javascript
Vue.js实战之组件的进阶
2017/04/04 Javascript
JavaScrpt的面向对象全面解析
2017/05/09 Javascript
JS仿QQ好友列表展开、收缩功能(第二篇)
2017/07/07 Javascript
基于Vue过渡状态实例讲解
2017/09/14 Javascript
在Node.js下运用MQTT协议实现即时通讯及离线推送的方法
2019/01/24 Javascript
微信小程序实现手势滑动效果
2019/08/26 Javascript
微信小程序表单验证插件WxValidate的二次封装功能(终极版)
2019/09/03 Javascript
layui给下拉框、按钮状态、时间赋初始值的方法
2019/09/10 Javascript
[02:04]2014DOTA2国际邀请赛 BBC小组赛第三天总结
2014/07/12 DOTA
[01:15:45]DOTA2上海特级锦标赛B组小组赛#1 Alliance VS Spirit第一局
2016/02/26 DOTA
在Django的模型中执行原始SQL查询的方法
2015/07/21 Python
Python pass详细介绍及实例代码
2016/11/24 Python
python仿抖音表白神器
2019/04/08 Python
解决windows下python3使用multiprocessing.Pool出现的问题
2020/04/08 Python
Python 字典中的所有方法及用法
2020/06/10 Python
pymongo insert_many 批量插入的实例
2020/12/05 Python
HTML5 使用 sessionStorage 进行页面传值的方法
2018/07/02 HTML / CSS
英国领先的在线高尔夫商店:Gamola Golf
2019/11/16 全球购物
英国领先的电动可调床制造商:Laybrook
2019/12/26 全球购物
Hashtable 添加内容的方式有哪几种,有什么区别?
2012/04/08 面试题
自荐信格式的六要素
2013/09/21 职场文书
《花的勇气》教后反思
2014/02/12 职场文书
降消项目实施方案
2014/03/30 职场文书
离婚财产分配协议书
2014/10/21 职场文书
市直属机关2016年主题党日活动总结
2016/04/05 职场文书
Python基础之pandas数据合并
2021/04/27 Python
Spring mvc是如何实现与数据库的前后端的连接操作的?
2021/06/30 Java/Android
AngularJS实现多级下拉框
2022/03/25 Javascript