feat(@ngtools/webpack): adjust changed file extensions based on usage

clydin · clydin · commit 391bdf55dc18 · 2018-01-26T19:02:58.000-05:00
diff --git a/packages/@ngtools/webpack/src/angular_compiler_plugin.ts b/packages/@ngtools/webpack/src/angular_compiler_plugin.ts
@@ -103,6 +103,7 @@ export class AngularCompilerPlugin implements Tapable {
   private _platform: PLATFORM;
   private _JitMode = false;
   private _emitSkipped = true;
+  private _changedFileExtensions = new Set(['ts', 'html', 'css']);
 
   // Webpack plugin.
   private _firstRun = true;
@@ -292,9 +293,15 @@ export class AngularCompilerPlugin implements Tapable {
       .filter(k => this._compilerHost.fileExists(k));
   }
 
+  updateChangedFileExtensions(extensions: Set<string>) {
+    for (const ext of extensions) {
+      this._changedFileExtensions.add(ext[0] === '.' ? ext.substr(1) : ext);
+    }
+  }
+
   private _getChangedCompilationFiles() {
     return this._compilerHost.getChangedFilePaths()
-      .filter(k => /\.(?:ts|html|css|scss|sass|less|styl)$/.test(k));
+      .filter(k => new RegExp(`\\.(?:${[...this._changedFileExtensions].join('|')})$`).test(k));
   }
 
   private _createOrUpdateProgram() {
diff --git a/packages/@ngtools/webpack/src/loader.ts b/packages/@ngtools/webpack/src/loader.ts
@@ -581,6 +581,8 @@ export function ngcLoader(this: LoaderContext & { _compilation: any }, source: s
             result.sourceMap = sourceMap;
           }
 
+          const dependencyExtensions = new Set<string>();
+
           // Manually add the dependencies for TS files.
           // Type only imports will be stripped out by compilation so we need to add them as
           // as dependencies.
@@ -589,7 +591,12 @@ export function ngcLoader(this: LoaderContext & { _compilation: any }, source: s
           if (sourceFileName.endsWith('.ts')) {
             result.errorDependencies.forEach(dep => this.addDependency(dep));
             const dependencies = plugin.getDependencies(sourceFileName);
-            dependencies.forEach(dep => this.addDependency(dep));
+            dependencies.forEach(dep => {
+              if (path.extname(dep)) {
+                dependencyExtensions.add(path.extname(dep));
+              }
+              this.addDependency(dep);
+            });
           }
 
           // NgFactory files depend on the component template, but we can't know what that file
@@ -601,7 +608,12 @@ export function ngcLoader(this: LoaderContext & { _compilation: any }, source: s
             const originalFile = sourceFileName.replace(ngFactoryRe, '.ts');
             this.addDependency(originalFile);
             const origDependencies = plugin.getDependencies(originalFile);
-            origDependencies.forEach(dep => this.addDependency(dep));
+            origDependencies.forEach(dep => {
+              if (path.extname(dep)) {
+                dependencyExtensions.add(path.extname(dep));
+              }
+              this.addDependency(dep);
+            });
           }
 
           // NgStyle files depend on the style file they represent.
@@ -611,9 +623,16 @@ export function ngcLoader(this: LoaderContext & { _compilation: any }, source: s
           if (ngStyleRe.test(sourceFileName)) {
             const styleFile = sourceFileName.replace(ngStyleRe, '');
             const styleDependencies = plugin.getResourceDependencies(styleFile);
-            styleDependencies.forEach(dep => this.addDependency(dep));
+            styleDependencies.forEach(dep => {
+              if (path.extname(dep)) {
+                dependencyExtensions.add(path.extname(dep));
+              }
+              this.addDependency(dep);
+            });
           }
 
+          plugin.updateChangedFileExtensions(dependencyExtensions);
+
           timeEnd(timeLabel);
           cb(null, result.outputText, result.sourceMap);
         })
