Angular中使用bundle分析工具
在项目中安装:
npm install --save-dev webpack-bundle-analyzer
在package.json中添加
"bundle-report": "webpack-bundle-analyzer dist/stats.json"
用ng cli构建,注意加--stats-json
ng build --prod --stats-json
运行
npm run bundle-report
然后就会生成一张图,可以看到构建后的各个js文件包含的模块和大小
发现几个能优化的点:
+ 如果使用了moment.js 可以把里面local的各种语言删一删留着需要用的就行了,不然都会构建进去
+ 没用的模块一定要删了x3,app-component里引入了rxjs但是后来看发现完全没用(这种好像可以用摇树优化)
Comments