re-implement cache busting mechanism, add --disable-cache-bus / -dcb flag to disable it

Author: aegyed91

packages/angular-cli/commands/build.ts

@@ -17,6 +17,7 @@ export interface BuildOptions {
   i18nFormat?: string;
   locale?: string;
   deployUrl?: string;
+  disableCacheBust?: boolean;
 }
 
 const BuildCommand = Command.extend({
@@ -31,21 +32,22 @@ const BuildCommand = Command.extend({
       default: 'development',
       aliases: ['t', { 'dev': 'development' }, { 'prod': 'production' }]
     },
-    { name: 'environment',    type: String,  default: '', aliases: ['e'] },
-    { name: 'output-path',    type: 'Path',  default: null, aliases: ['o'] },
-    { name: 'watch',          type: Boolean, default: false, aliases: ['w'] },
-    { name: 'watcher',        type: String },
-    { name: 'suppress-sizes', type: Boolean, default: false },
-    { name: 'base-href',      type: String,  default: null, aliases: ['bh'] },
-    { name: 'aot',            type: Boolean, default: false },
-    { name: 'sourcemap',      type: Boolean, default: true, aliases: ['sm'] },
-    { name: 'vendor-chunk',   type: Boolean, default: true },
-    { name: 'verbose',        type: Boolean, default: false },
-    { name: 'progress',       type: Boolean, default: true },
-    { name: 'i18n-file',      type: String, default: null },
-    { name: 'i18n-format',    type: String, default: null },
-    { name: 'locale',         type: String, default: null },
-    { name: 'deploy-url',     type: String,  default: null, aliases: ['d'] }
+    { name: 'environment',            type: String,  default: '', aliases: ['e'] },
+    { name: 'output-path',            type: 'Path',  default: null, aliases: ['o'] },
+    { name: 'watch',                  type: Boolean, default: false, aliases: ['w'] },
+    { name: 'watcher',                type: String },
+    { name: 'suppress-sizes',         type: Boolean, default: false },
+    { name: 'base-href',              type: String,  default: null, aliases: ['bh'] },
+    { name: 'aot',                    type: Boolean, default: false },
+    { name: 'sourcemap',              type: Boolean, default: true, aliases: ['sm'] },
+    { name: 'vendor-chunk',           type: Boolean, default: true },
+    { name: 'verbose',                type: Boolean, default: false },
+    { name: 'progress',               type: Boolean, default: true },
+    { name: 'i18n-file',              type: String, default: null },
+    { name: 'i18n-format',            type: String, default: null },
+    { name: 'locale',                 type: String, default: null },
+    { name: 'deploy-url',             type: String,  default: null, aliases: ['d'] },
+    { name: 'disable-cache-bust',     type: Boolean,  default: false, aliases: ['dcb'], description: 'Disable webpack\'s [chunkhash] cache bust feature in prod build.' }
   ],
 
   run: function (commandOptions: BuildOptions) {

packages/angular-cli/models/webpack-build-production.ts

@@ -18,17 +18,18 @@ declare module 'webpack' {
 export const getWebpackProdConfigPartial = function(projectRoot: string,
                                                     appConfig: any,
                                                     sourcemap: boolean,
-                                                    verbose: any) {
+                                                    verbose: any,
+                                                    disableCacheBust: boolean) {
   const appRoot = path.resolve(projectRoot, appConfig.root);
 
   return {
     output: {
-      filename: '[name].bundle.js',
-      sourceMapFilename: '[name].bundle.map',
-      chunkFilename: '[id].chunk.js'
+      filename: disableCacheBust ? '[name].bundle.js' : '[name].[chunkhash].bundle.js',
+      sourceMapFilename: disableCacheBust ? '[name].bundle.map' : '[name].[chunkhash].bundle.map',
+      chunkFilename: disableCacheBust ? '[id].chunk.js' : '[id].[chunkhash].chunk.js'
     },
     plugins: [
-      new ExtractTextPlugin('[name].bundle.css'),
+      new ExtractTextPlugin(disableCacheBust ? '[name].bundle.css' : '[name].[chunkhash].bundle.css'),
       new webpack.DefinePlugin({
         'process.env.NODE_ENV': JSON.stringify('production')
       }),

packages/angular-cli/models/webpack-config.ts

@@ -32,7 +32,8 @@ export class NgCliWebpackConfig {
     vendorChunk = false,
     verbose = false,
     progress = true,
-    deployUrl?: string
+    deployUrl?: string,
+    disableCacheBust = false
   ) {
     const config: CliConfig = CliConfig.fromProject();
     const appConfig = config.config.apps[0];
@@ -51,7 +52,7 @@ export class NgCliWebpackConfig {
       progress
     );
     let targetConfigPartial = this.getTargetConfig(
-      this.ngCliProject.root, appConfig, sourcemap, verbose
+      this.ngCliProject.root, appConfig, sourcemap, verbose, disableCacheBust
     );
     const typescriptConfigPartial = isAoT
       ? getWebpackAotConfigPartial(this.ngCliProject.root, appConfig, i18nFile, i18nFormat, locale)
@@ -74,12 +75,12 @@ export class NgCliWebpackConfig {
     );
   }
 
-  getTargetConfig(projectRoot: string, appConfig: any, sourcemap: boolean, verbose: boolean): any {
+  getTargetConfig(projectRoot: string, appConfig: any, sourcemap: boolean, verbose: boolean, disableCacheBust: boolean): any {
     switch (this.target) {
       case 'development':
         return getWebpackDevConfigPartial(projectRoot, appConfig);
       case 'production':
-        return getWebpackProdConfigPartial(projectRoot, appConfig, sourcemap, verbose);
+        return getWebpackProdConfigPartial(projectRoot, appConfig, sourcemap, verbose, disableCacheBust);
       default:
         throw new Error("Invalid build target. Only 'development' and 'production' are available.");
     }

packages/angular-cli/tasks/build-webpack.ts

@@ -34,7 +34,8 @@ export default <any>Task.extend({
       runTaskOptions.vendorChunk,
       runTaskOptions.verbose,
       runTaskOptions.progress,
-      deployUrl
+      deployUrl,
+      runTaskOptions.disableCacheBust
     ).config;
 
     const webpackCompiler: any = webpack(config);