javascript 如何在角度 2、4、6、7 中减小 vendor.js 的大小?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/51257879/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to decrease size of vendor.js in angular 2,4,6,7?
提问by Mohamad Shiralizadeh
Angular CLI creates vendor.jsand I don't know Why and What is the use of it?? Size of this file is about 3.2MBfor a new app!!
Angular CLI 创建vendor.js,我不知道为什么和它有什么用?对于新应用程序,此文件的大小约为3.2MB!
Does this file contains Angular 6 Javascript Source?
此文件是否包含Angular 6 Javascript 源代码?
Don't you think this is big file for loading on internet on low speed connections?
你不认为这是在低速连接上加载到互联网上的大文件吗?
回答by molikh
You mean how to decrease? This file includes all libraries that you added into your project. If you build your app on production mode it'll be much lower.
你是说怎么减?此文件包括您添加到项目中的所有库。如果您在生产模式下构建您的应用程序,它会低得多。
ng build --prod
ng build --prod
If it's not your answer, explain more what you are looking for.
如果这不是您的答案,请解释更多您正在寻找的内容。
回答by DV Singh
Try
尝试
ng build --prod --aot --vendor-chunk --common-chunk --delete-output-path --buildOptimizer
I reduced my vender.**.js fromm 12mb to 2mb
我将我的 vender.**.js 从 12mb 减少到 2mb
回答by Nanotron
Instead of decreasing it you can remove the file completely
By specifying the --build-optimizerflag, the cli will disable this file from the build output.
您可以通过指定--build-optimizer标志来完全删除文件,而不是减少它,cli 将从构建输出中禁用此文件。
The CLI will now bundle the vendor code into the main.js bundle, which will also enable uglification to reduce the size.
CLI 现在将供应商代码捆绑到 main.js 包中,这也将启用丑化以减少大小。
So you will see a small increase in the size of the main.js bundle which is minimal in comparison to the size of the vendor chunks
因此,您会看到 main.js 包的大小略有增加,与供应商块的大小相比,这是最小的
回答by Evan Kleiner
You may also want to update your build script in package.json to generate a prod build by default. I ran into this deploying to Heroku, since it runs 'npm build' automatically. By default, 'npm build' runs the following script:
您可能还想更新 package.json 中的构建脚本以默认生成 prod 构建。我遇到了这个部署到 Heroku 的问题,因为它会自动运行“npm build”。默认情况下,'npm build' 运行以下脚本:
ng build
If you update it to
如果您将其更新为
ng build --prod
in package.json, then Heroku/AWS/Azure will create a production build on deployment instead.
在 package.json 中,然后 Heroku/AWS/Azure 将在部署上创建生产构建。

