Not dropping @angular compiler.es.5.js from my vendor bundle

[rustylw]

• [x ] bug report -> please search issues before submitting
• [ ] feature request

Versions.

@angular/cli: 1.0.1 node: 6.9.2 os: win32 x64 @angular/animations: 4.0.3 @angular/common: 4.0.3 @angular/core: 4.0.3 @angular/forms: 4.0.3 @angular/http: 4.0.3 @angular/platform-browser: 4.0.3 @angular/platform-browser-dynamic: 4.0.3 @angular/platform-server: 4.0.3 @angular/router: 4.0.3 @angular/compiler: 4.0.3 @angular/compiler-cli: 4.0.3 @angular/cli: 1.0.1

Repro steps.

npm run build where this is in package.json: "scripts": { "build": "node --max_old_space_size=8192 node_modules/webpack/bin/webpack --progress --config ./webpack.config --env=prod --profile --colors", "build:dev": "node --max_old_space_size=8192 node_modules/webpack/bin/webpack --progress --config ./webpack.config --env=dev --profile --colors", }

The log given by the failure.

No failure, but when I run source-map-explorer dist\vendor.bundle.js, I see a 965KB payload for @angular/compiler

I have 5 lazy loaded modules (all loading correctly), and AOT is definitely working on my main bundle since my app load time went from 3.5 seconds to 1 second when I enabled AOT.

Desired functionality.

0 MB for @angular/compiler

Mention any other details that might be useful.

When I run the following command, the compiler is removed: node -max_old_space_size=8192 node_modules\@angular\cli\bin\ng build --aot

Relevant info from my webpack.config.js: "entry": { "main": [ "./src/main.ts" ], "polyfills": [ "./src/polyfills.ts" ], "vendor": [ "./src/vendor.ts" ], }

plugins = [ new NoEmitOnErrorsPlugin(), new GlobCopyWebpackPlugin({ "patterns": [ "assets/images", isProd ? "assets/scripts/yFiles.lib/production-license.js" : "assets/scripts/yFiles.lib/license.js", "favicon.ico", "web.config" ], "globOptions": { "cwd": path.join(process.cwd(), "src"), "dot": true, "ignore": "**/.gitkeep" } }), new ProgressPlugin(), new HtmlWebpackPlugin({ "template": "./src/index.html", "filename": "./index.html", "hash": false, "inject": true, "compile": true, "favicon": false, "minify": false, "cache": true, "showErrors": true, "chunks": "all", "excludeChunks": [], "title": "Monitor App", "xhtml": true, "chunksSortMode": function sort(left, right) { let leftIndex = entryPoints.indexOf(left.names[0]); let rightindex = entryPoints.indexOf(right.names[0]); if (leftIndex > rightindex) { return 1; } else if (leftIndex < rightindex) { return -1; } else { return 0; } } }), new BaseHrefWebpackPlugin({}), new CommonsChunkPlugin({ "name": "inline", "minChunks": null }), new CommonsChunkPlugin({ "name": "vendor", "minChunks": (module) => module.resource && module.resource.startsWith(nodeModules), "chunks": [ "main" ] }), new ExtractTextPlugin({ "filename": "[name].bundle.css", "disable": true }), new LoaderOptionsPlugin({ "sourceMap": false, "options": { "postcss": [ autoprefixer(), postcssUrl({ "url": (URL) => { // Only convert root relative URLs, which CSS-Loader won't process into require(). if (!URL.startsWith('/') || URL.startsWith('//')) { return URL; } if (deployUrl.match(/:\/\//)) { // If deployUrl contains a scheme, ignore baseHref use deployUrl as is. return ${deployUrl.replace(/\/$/, '')}${URL}; } else if (baseHref.match(/:\/\//)) { // If baseHref contains a scheme, include it as is. return baseHref.replace(/\/$/, '') + /${deployUrl}/${URL}.replace(/\/\/+/g, '/'); } else { // Join together base-href, deploy-url and the original URL. // Also dedupe multiple slashes into single ones. return /${baseHref}/${deployUrl}/${URL}.replace(/\/\/+/g, '/'); } } }) ], "sassLoader": { "sourceMap": false, "includePaths": [] }, "lessLoader": { "sourceMap": false }, "context": "" } }), new AotPlugin({ "mainPath": "main.ts", "hostReplacementPaths": { "environments/environment": environmentFiles[env] }, "exclude": [], "tsConfigPath": "src/tsconfig.app.json", "skipCodeGeneration": false }), new webpack.optimize.UglifyJsPlugin({ compress: { warnings: false, screw_ie8: true, conditionals: true, unused: true, comparisons: true, sequences: true, dead_code: true, evaluate: true, if_return: true, join_vars: true, drop_console: true }, output: { comments: false, }, sourceMap: false }) ];

ventor.ts: // Angular import '@angular/platform-browser'; import '@angular/platform-browser-dynamic'; import '@angular/core'; import '@angular/common'; import '@angular/router'; import '@angular/http'; import '@angular/forms'; import '@angular/animations';

// RxJS import 'rxjs';

// moment import 'moment';

// ng2-bootstrap import 'ng2-bootstrap';

// highcharts import 'angular2-highcharts/dist/HighchartsService'

[rustylw]

Well, I also took a look at the main.bundle.js in source-map-explorer and it had duplicates of all the stuff in the vendor bundle (with the exception of the compiler not being present). So, I just removed vendor from the webpack config file. Problem solved for now.

[rustylw]

BTW, I thought the CommonsChunkPlugin would prevent the duplicates mentioned above.

[andrewpmontgomery]

For anyone who lands on this bug, the solution (for me) was to remove the line: import "@angular/platform-browser-dynamic"; from vendor.ts

[RickyJiao]

@andrewpmontgomery Once I removed the line import "@angular/platform-browser-dynamic"; from vendor.ts, webpack will bundle compiler.es.5.js into main.js instead of vendor.js. How could we completely remove the compiler.es.5.js from front end? Any ideas are appreciated!

[angular-automatic-lock-bot[bot]]

This issue has been automatically locked due to inactivity. Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}