1、图片优化
在angular中使用background:url('../assets/pngs/cdss-no-data.png');
ng会将一份assets里面的图片拷贝一份到根目录下，会产生多余的资源，angular会将这种相对的路径打包后改变成绝对路径http://localhost:4200/cdss-no-data.1233452.png;解决方法改成相对路径就行了background:url('/assets/pngs/cdss-no-data.png');打包后图片地址是http://localhost:4200/assets/pngs/cdss-no-data.png;这是angular7报的bug github.com/angular/ang…
2、webpack打包第三方包优化
在angular中使用lodash,由于多人使用没人使用方式不一样 引用lodash有两种方式
- 第一种：
import sortBy from 'lodash/sortBy'; - 第二种：
import { sortBy } from 'lodash';
当两种都使用的时候会产生多余的包，建议使用第一种方式,这样只会打包需要引用的包
3、webpack打包svg
svg-sprite,会将所有svg转变为一个雪碧图,具体参考官网
4、路由懒加载
5、anguar7项目分层优化
- 一个组件最多对应一个service负责管理数据，但是可以对应多个service层的发布订阅
- 所有业务逻辑尽量在service处理好
- ts只是处理service的订阅subscribe，ts里面的数据不能直接直接修改其他组件的数据，但是可以通过next()，然后在service层修改数据
- 在项目启动前，有可能会需要一些列后台的配置，要在组件加载之前也就是在core.module提前渲染
- 一些配置数据，可以在startup或者启动前请求，统一放在config.service里面
6、angular7父子组件优化
- 场景，给子组件传递一个值，而子组件需要修改这个传入的值。
- 在angular中：由于子组件不能直接修改父组件的传入的属性的值这个原则;
- 一般可以用的情况是:发布订阅模式;service模式;EventEmitter;归结起来就是把子组件修改的临时值再传给父组件，然后再通过父组件传递给子组件,然后重新渲染。
- 但是如果我们传入一个对象的话，直接赋值是不行的，必须使用深拷贝，如果对象很大的话，还是比较消耗内存的
- 所以在angular中可以有这种情况，我们在父组件中使用该值只有两次，第一次初始化的时候，第二次是比如点击保存的时候获取改值就行。初始化的时候获取可以，如何保存的时候获取，在angular中提供了一个可以在父组件中调用子组件的方法，然后返回子组件的值就行了。
7、http请求后处理
- 后台返回的api数据，有可能不是我们所需要的，需要进行数据处理，在angular中统一放大service层，或者在加一个层次service-resolve来处理接口获取到数据的格式转换
--- 待续
