I am using node version 8.9.4,
npm version 5.6.0 I have no clue why this is happening the
ng build --dev
is generating vendor.bundle.js while ng build --prod
is not generating vendor.bundle.js here is the screenshot
output with ng build--prod
[
[output with ng-build --dev]
Here is my package.json
`{
"name": "app1",
"version": "0.0.0",
"license": "MIT",
"scripts": {
"ng": "ng",
"start": "ng serve",
"build": "ng build --prod",
"test": "ng test",
"lint": "ng lint",
"e2e": "ng e2e"
},
"private": true,
"dependencies": {
"@angular-devkit/core": "0.0.28",
"@angular/animations": "^5.0.0",
"@angular/common": "^5.0.0",
"@angular/compiler": "^5.0.0",
"@angular/core": "^5.0.0",
"@angular/forms": "^5.0.0",
"@angular/http": "^5.0.0",
"@angular/platform-browser": "^5.0.0",
"@angular/platform-browser-dynamic": "^5.0.0",
"@angular/router": "^5.0.0",
"core-js": "^2.4.1",
"rxjs": "^5.5.2",
"zone.js": "^0.8.14"
},
"devDependencies": {
"@angular/cli": "1.6.3",
"@angular/compiler-cli": "^5.0.0",
"@angular/language-service": "^5.0.0",
"@types/jasmine": "~2.5.53",
"@types/jasminewd2": "~2.0.2",
"@types/node": "~6.0.60",
"codelyzer": "^4.0.1",
"jasmine-core": "~2.6.2",
"jasmine-spec-reporter": "~4.1.0",
"karma": "~1.7.0",
"karma-chrome-launcher": "~2.1.1",
"karma-cli": "~1.0.1",
"karma-coverage-istanbul-reporter": "^1.2.1",
"karma-jasmine": "~1.1.0",
"karma-jasmine-html-reporter": "^0.2.2",
"protractor": "~5.1.2",
"ts-node": "~3.2.0",
"tslint": "~5.7.0",
"typescript": "~2.4.2"
}
}
`
The ng build command is intentionally for building the apps and deploying the build artifacts. The command does not generate an output folder. The output folder is – dist/. The ng serve builds artifacts from memory instead for a faster development experience.
Production is the new default When you create a new Angular project, the commands ng build and ng serve use the production build by default.
This file includes all libraries that you added into your project. If you build your app on production mode the file size will be smaller. After using Prod also my project size is 8Mb which getting more time to load.
For prod builds the vendor bundle is integrated in your main bundle, because it is using the build optimizer per default.
According to the angular-cli documentation:
Total bundle sizes with Build Optimizer are smaller if there is no separate vendor chunk because having vendor code in the same chunk as app code makes it possible for Uglify to remove more unused code.
ng build by default don't generate vendor-chunk but instead it is combined in one main-chunk for performance and optimization purposes, you will need to add a parameter to the build command like so in order to have your vendor-chunk separated:ng build --prod --vendor-chunk=true
see details here:
https://github.com/angular/angular-cli/wiki/build#--build-optimizer-and---vendor-chunk
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With