fix(AoT): stop using require.context in Angular apps (NativeScript#574)

Calling `require.context` for the app directory adds a `ContextDependency` in webpack for it. That causes every change inside the app/ directory to emit a change event for the whole directory.
There's a logic in the TypeScript compiler host (from
[@ngtools/webpack](https://github.com/angular/angular-cli/blob/master/packages/ngtools/webpack/src/compiler_host.ts#L235))
that invalidates all files in the changed directory. The invalidation
removes all cached information for the virtual files produced by the
Angular AoT compilation (ngfactory files, etc.). Since these files are
not in the cache anymore, webpack tries to resolve them from the
filesystem and fails. The solution is to remove the `ContextDependency`
for the `app` dir, which should also make the rebuilds much faster.

fixes NativeScript#566

Author: sis0k0

Diff for: bundle-config-loader.js

@@ -16,7 +16,11 @@ module.exports = function(source) {
 
     if (loadCss) {
         source = `
-            require("nativescript-dev-webpack/load-application-css")(${angular});
+            require("${
+                angular ?
+                    'nativescript-dev-webpack/load-application-css-angular' :
+                    'nativescript-dev-webpack/load-application-css-regular'
+            }")();
             ${source}
         `;
     }

Diff for: load-application-css-angular.js

@@ -0,0 +1,7 @@
+const loadCss = require("./load-application-css");
+
+module.exports = function() {
+    loadCss(function() {
+        global.registerModule("./app.css", () => require("~/app"));
+    });
+}

Diff for: load-application-css-regular.js

@@ -0,0 +1,8 @@
+const loadCss = require("./load-application-css");
+
+module.exports = function() {
+    loadCss(function() {
+        const appCssContext = require.context("~/", false, /^\.\/app\.(css|scss|less|sass)$/);
+        global.registerWebpackModules(appCssContext);
+    });
+}

Diff for: load-application-css.js

@@ -1,14 +1,8 @@
-module.exports = function(isAngular) {
+module.exports = function (loadModuleFn) {
     const application = require("tns-core-modules/application");
     require("tns-core-modules/ui/styling/style-scope");
 
-    if (isAngular) {
-        global.registerModule("./app.css", () => require("~/app"));
-    } else {
-        const appCssContext = require.context("~/", false, /^\.\/app\.(css|scss|less|sass)$/);
-        global.registerWebpackModules(appCssContext);
-    }
+    loadModuleFn();
 
     application.loadAppCss();
 }
-

Diff for: plugins/NativeScriptSnapshotPlugin/index.js

@@ -45,7 +45,13 @@ exports.NativeScriptSnapshotPlugin = (function() {
 
         let snapshotEntryContent = "";
         if (includeApplicationCss) {
-            snapshotEntryContent += `require("nativescript-dev-webpack/load-application-css")(${options.angular});`;
+            snapshotEntryContent += `
+            require("${
+                options.angular ?
+                    'nativescript-dev-webpack/load-application-css-angular' :
+                    'nativescript-dev-webpack/load-application-css-regular'
+            }")();
+            `;
         }
         snapshotEntryContent += [ ...requireModules, ...internalRequireModules]
             .map(mod => `require('${mod}')`).join(";");