Angular 2/4:scripts.bundle.js和vendor.bundle.js有什么区别？

Question

Angular 4:运行命令后:ng build我有这个结构

0.chunk.js      favicon.ico           polyfills.bundle.js.map
0.chunk.js.map  index.html            scripts.bundle.js
1.chunk.js      inline.bundle.js      scripts.bundle.js.map
1.chunk.js.map  inline.bundle.js.map  styles.bundle.js
2.chunk.js      main.bundle.js        styles.bundle.js.map
2.chunk.js.map  main.bundle.js.map    vendor.bundle.js
assets          polyfills.bundle.js   vendor.bundle.js.map

是什么之间的差异scripts.bundle.js和vendor.bundle.js？

我认为区别在于,scripts.bundle.js保存所有外部.js文件并vendor.bundle.js保存所有创建的模块.

编辑

但我可以将.js文件导入node_modules到vendor.bundle.js和scripts.bundle.js.最好的方法是:将.js文件导入模块或将它们添加到.angular-cli.jsons scripts对象中？

〜非常感谢你的帮助!

Answer 1

scripts.bundle.js表示scripts您配置的部分.angular-cli.json
vendor.bundle.js包含npm modules您正在引用的部分app.module.

找出捆绑包内部内容的更好方法是使用 webpack-bundle-analyzer

添加"analyze": "ng build --prod --stats-json && webpack-bundle-analyzer dist/stats.json",到您的package.json,一旦您npm install webpack-bundle-analyzer运行npm run analyze

scripts部分的目的.angular-cli.json是处理遗留脚本,但您也可以使用它来改善您的延迟加载故事.只说你的块依赖于某些特定的东西npm module.在这种情况下,不需要将npm模块置于其中,vendor.bundle.js因为它可以在加载相关块之前加载.

有关脚本部分的更多详细信息,请访问https://github.com/angular/angular-cli/wiki/stories-global-scripts