
angualr搭建差异化架构流程
使用angualr和ng-alain搭建差异化架构,提高开发效率,降低维护成本。
pg_li
这个作者很懒,什么都没留下…
展开
-
angualr编译打包时,删除冗余的代码。
目录一、背景:二、问题:三、解决思路:一、背景:项目使用差异化管理,一个项目里面有多个产品形态的项目。公用组件和其他公共代码,只有业务模块进行分离。在加载的时候使用懒加载。二、问题:在执行编译时,由于在路由中配置了懒加载,在打包时会把其他产品形态业务代码也打进去。三、解决思路:在编译时,使用nodejs读取自己的路由模块,将这部分代码读出来,...原创 2019-04-12 17:27:13 · 512 阅读 · 0 评论 -
angular使用自定义命令来启动不同的proxy.conf配置
一、背景项目做归一化架构,需要同时启动不同的项目,由于后台映射的是不同的服务器,频繁切换时需要经常修改proxy.conf.json文件。因此希望有个方法能解决这个困扰。二、解决方式1、安装脚手架npm install -g @angular/cli@6.2.9 // 可根据自己的需要安装,已经安装的可忽略2、创建自定义命令// 在package.json 创建一个bi...原创 2019-04-04 17:13:46 · 997 阅读 · 0 评论 -
angualr6 差异化本地环境管理。
1、背景使用angular6 ng-alain搭建的项目。 项目对应多个客户,每个客户都有自己定制的模块及功能。 再修改公共模块时需要频繁切换到其他项目下验证下修改是否有影响。2、解决思路搭建差异化架构见angualr项目——差异化架构搭建(公共组件及模块复用) 管理不同环境。方案设计:在header上增加一个选择菜单,切换菜单时加载不同的配置,显示不同的产品形态。1)增...原创 2018-11-09 17:35:33 · 434 阅读 · 0 评论 -
angular使用动态加载的方式,处理差异化
一、背景有些功能是差异化的,某些场景下需要,某些场景下不需要,因此想使用动态加载的方式处理这种场景。二、解决方式主要通过angular提供的ViewContainerRef, ComponentFactoryResolver来实现。1、提供app-dynamic-add-components组件import {Component, Input, ViewContaine...原创 2018-09-21 16:09:29 · 782 阅读 · 0 评论 -
angualr项目——差异化架构搭建(公共组件及模块复用)
目录一、背景二、解决方案1、动态注入必要的配置参数2、路由重置3、webpack分包配置 一、背景1、俩个不同项目,但是系统菜单及系统菜单下的模块都是一样的。2、其他图形化模块也基本一致。3、首页地图相关模块也是一致的。为了方便后期维护,使公共组件和相同模块能够复用,因此想用差异化管理的形式来进行架构搭建,及代码管理。二、解决方案1、动态注入必...原创 2018-09-07 17:46:33 · 641 阅读 · 0 评论 -
angular6 启动前注入一些配置参数
一、背景同一个项目,卖给不同的公司,需要进行OEM定制化开发。产品的logo、名称、及配置地址都不相同,因此在项目中处理这个问题。二、解决方案1、在项目启动时加载不同的配置文件,将固定不变的logo等信息动态注入到项目服务中去。1)、在src/environments中新建自定义的配置文件2)、在main.ts中注入配置的参数(DYNAMICENVIRONMENT 方便开...原创 2018-09-06 16:27:38 · 3752 阅读 · 0 评论