fix(ngtools/webpack): move the generate directory to a separate dir (#3256)

Author: hansl

packages/webpack/src/reflector_host.ts

@@ -11,7 +11,7 @@ export function patchReflectorHost(codeGenerator: CodeGenerator) {
   reflectorHost.getImportPath = function(containingFile: string, importedFile: string): string {
     // Hack together SCSS and LESS files URLs so that they match what the default ReflectorHost
     // is expected. We only do that for shimmed styles.
-    const m = importedFile.match(/(.*)(\..+)(\.shim)(\..+)/);
+    const m = importedFile.match(/(.*)(\.css|\.scss|\.less|\.stylus)((?:\.shim)?)(\..+)/);
     if (!m) {
       return oldGIP.call(this, containingFile, importedFile);
     }
@@ -21,6 +21,6 @@ export function patchReflectorHost(codeGenerator: CodeGenerator) {
     const [, baseDirAndName, styleExt, shim, ext] = m;
     const result = oldGIP.call(this, containingFile, baseDirAndName + '.css' + shim + ext);
 
-    return result.replace(/\.css\./, styleExt + '.');
+    return result.replace(/\.css($|\.)/, styleExt + '$1');
   };
 }

tests/e2e/assets/webpack/test-app/app/app.component.ts

@@ -1,10 +1,10 @@
-// Code generated by angular2-stress-test
+import {Component, ViewEncapsulation} from '@angular/core';
 
-import { Component } from '@angular/core';
 
 @Component({
   selector: 'app-root',
   templateUrl: './app.component.html',
-  styleUrls: ['./app.component.scss']
+  styleUrls: ['./app.component.scss'],
+  encapsulation: ViewEncapsulation.None
 })
 export class AppComponent { }

tests/e2e/assets/webpack/test-app/app/app.module.ts

@@ -1,4 +1,3 @@
-// Code generated by angular2-stress-test
 import { NgModule, Component } from '@angular/core';
 import { BrowserModule  } from '@angular/platform-browser';
 import { RouterModule } from '@angular/router';