feat: allow extending webpack.config.js through env

In case you need to extend the webpack.config.js, currently you cannot extend everything and you need to write a lot of custom logic. This PR adds the possibility to extend the appComponents, entries and alias through `env`.
Also update demo applications to use latest CLI feature for extending webpack.config.js

Author: rosen-vladimirov

demo/AngularApp/app/App_Resources/Android/app.gradle

@@ -5,12 +5,11 @@
 //	compile 'com.android.support:recyclerview-v7:+'
 //}
 
-android {
- defaultConfig {
+android {
+ defaultConfig {
  generatedDensities = []
- applicationId ="org.nativescript.AngularApp"
- } 
- aaptOptions { 
- additionalParameters "--no-version-vectors"
- } 
-} 
+ }
+ aaptOptions {
+ additionalParameters "--no-version-vectors"
+ }
+}

demo/AngularApp/app/package.json

@@ -1,8 +1,9 @@
 {
 "android": {
-"v8Flags": "--expose_gc"
+"v8Flags": "--expose_gc",
+"markingMode": "none"
  },
 "main": "main.js",
 "name": "tns-template-hello-world-ng",
 "version": "3.3.0"
-}
+}

demo/AngularApp/custom-application-activity.webpack.config.js

@@ -0,0 +1,13 @@
+constwebpackConfig=require("./webpack.config");
+constpath=require("path");
+
+module.exports=env=>{
+env=env||{};
+env.appComponents=env.appComponents||[];
+env.appComponents.push(path.resolve(__dirname,"app/activity.android.ts"));
+
+env.entries=env.entries||{};
+env.entries.application="./application.android";
+constconfig=webpackConfig(env);
+returnconfig;
+};

demo/AngularApp/nsconfig.json

@@ -0,0 +1,3 @@
+{
+"webpackConfigPath": "custom-application-activity.webpack.config.js"
+}

demo/AngularApp/webpack.config.js

@@ -18,11 +18,11 @@ const hashSalt = Date.now().toString();
 
 module.exports=env=>{
 // Add your custom Activities, Services and other Android app components here.
-constappComponents=[
+constappComponents=env.appComponents||[];
+appComponents.push(...[
 "tns-core-modules/ui/frame",
 "tns-core-modules/ui/frame/activity",
-resolve(__dirname,"app/activity.android.ts")
-];
+]);
 
 constplatform=env&&(env.android&&"android"||env.ios&&"ios");
 if(!platform){
@@ -66,9 +66,8 @@ module.exports = env => {
 consthasRootLevelScopedModules=nsWebpack.hasRootLevelScopedModules({projectDir: projectRoot});
 consthasRootLevelScopedAngular=nsWebpack.hasRootLevelScopedAngular({projectDir: projectRoot});
 letcoreModulesPackageName="tns-core-modules";
-constalias={
-'~': appFullPath
-};
+constalias=env.alias||{};
+alias['~']=appFullPath;
 
 constcompilerOptions=getCompilerOptionsFromTSConfig(tsConfigPath);
 if(hasRootLevelScopedModules){
@@ -85,7 +84,9 @@ module.exports = env => {
 constappResourcesFullPath=resolve(projectRoot,appResourcesPath);
 constentryModule=`${nsWebpack.getEntryModule(appFullPath,platform)}.ts`;
 constentryPath=`.${sep}${entryModule}`;
-constentries={bundle: entryPath,application: "./application.android"};
+constentries=env.entries||{};
+entries.bundle=entryPath;
+
 constareCoreModulesExternal=Array.isArray(env.externals)&&env.externals.some(e=>e.indexOf("tns-core-modules")>-1);
 if(platform==="ios"&&!areCoreModulesExternal){
 entries["tns_modules/tns-core-modules/inspector_modules"]="inspector_modules";

demo/JavaScriptApp/app/package.json

@@ -1,8 +1,9 @@
 {
 "android": {
-"v8Flags": "--expose_gc"
+"v8Flags": "--expose_gc",
+"markingMode": "none"
  },
 "main": "app.js",
 "name": "tns-template-hello-world",
 "version": "3.3.0"
-}
+}

demo/JavaScriptApp/custom-application-activity.webpack.config.js

@@ -0,0 +1,13 @@
+constwebpackConfig=require("./webpack.config");
+constpath=require("path");
+
+module.exports=env=>{
+env=env||{};
+env.appComponents=env.appComponents||[];
+env.appComponents.push(path.resolve(__dirname,"app/activity.android.js"));
+
+env.entries=env.entries||{};
+env.entries.application="./application.android";
+constconfig=webpackConfig(env);
+returnconfig;
+};

demo/JavaScriptApp/nsconfig.json

@@ -0,0 +1,3 @@
+{
+"webpackConfigPath": "./custom-application-activity.webpack.config.js"
+}

demo/JavaScriptApp/webpack.config.js

@@ -12,11 +12,11 @@ const hashSalt = Date.now().toString();
 
 module.exports=env=>{
 // Add your custom Activities, Services and other android app components here.
-constappComponents=[
+constappComponents=env.appComponents||[];
+appComponents.push(...[
 "tns-core-modules/ui/frame",
 "tns-core-modules/ui/frame/activity",
-resolve(__dirname,"app/activity.android.js")
-];
+]);
 
 constplatform=env&&(env.android&&"android"||env.ios&&"ios");
 if(!platform){
@@ -56,9 +56,8 @@ module.exports = env => {
 constappFullPath=resolve(projectRoot,appPath);
 consthasRootLevelScopedModules=nsWebpack.hasRootLevelScopedModules({projectDir: projectRoot});
 letcoreModulesPackageName="tns-core-modules";
-constalias={
-'~': appFullPath
-};
+constalias=env.alias||{};
+alias['~']=appFullPath;
 
 if(hasRootLevelScopedModules){
 coreModulesPackageName="@nativescript/core";
@@ -68,7 +67,9 @@ module.exports = env => {
 
 constentryModule=nsWebpack.getEntryModule(appFullPath,platform);
 constentryPath=`.${sep}${entryModule}.js`;
-constentries={bundle: entryPath,application: "./application.android"};
+constentries=env.entries||{};
+entries.bundle=entryPath;
+
 constareCoreModulesExternal=Array.isArray(env.externals)&&env.externals.some(e=>e.indexOf("tns-core-modules")>-1);
 if(platform==="ios"&&!areCoreModulesExternal){
 entries["tns_modules/tns-core-modules/inspector_modules"]="inspector_modules";
@@ -82,6 +83,7 @@ module.exports = env => {
 itemsToClean.push(`${join(projectRoot,"platforms","android","app","build","configurations","nativescript-android-snapshot")}`);
 }
 
+
 nsWebpack.processAppComponents(appComponents,platform);
 constconfig={
 mode: production ? "production" : "development",
@@ -109,6 +111,8 @@ module.exports = env => {
 extensions: [".js",".scss",".css"],
 // Resolve {N} system modules from tns-core-modules
 modules: [
+resolve(__dirname,`node_modules/${coreModulesPackageName}`),
+resolve(__dirname,"node_modules"),
 `node_modules/${coreModulesPackageName}`,
 "node_modules",
 ],
@@ -272,4 +276,4 @@ module.exports = env => {
 
 
 returnconfig;
-};
+};

demo/TypeScriptApp/app/package.json

@@ -1,8 +1,9 @@
 {
 "android": {
-"v8Flags": "--expose_gc"
+"v8Flags": "--expose_gc",
+"markingMode": "none"
  },
 "main": "app.js",
 "name": "tns-template-hello-world-ts",
 "version": "3.3.0"
-}
+}