Merge branch 'master' into feat/webpack5-polyfills

.github/ISSUE_TEMPLATE/bug_report.yaml

@@ -72,14 +72,14 @@ body:
         Provide information about your environment. Run
 
         ```shell
-        npx -y nativescript-envinfo
+        echo 'y' | npx nativescript-envinfo
         ```
 
         inside the project and paste the output directly without manual formatting.
       placeholder: |
         Paste the result of
 
-          npx -y nativescript-envinfo
+          echo 'y' | npx nativescript-envinfo
 
   - type: markdown
     attributes:

README.md

@@ -70,6 +70,6 @@ Outside the source centralized in this repo, NativeScript consists of a few othe
 	- This repo contains the NativeScript framework documentation, which is available at <http://docs.nativescript.org/>. The docs are written in Markdown.
 
 ## License
-[![License](https://img.shields.io/badge/License-Apache%202.0-blue.svg)](https://github.com/NativeScript/NativeScript/blob/master/LICENSE)
+[![License](https://img.shields.io/badge/License-MIT-blue.svg)](https://github.com/NativeScript/NativeScript/blob/master/LICENSE)
 
 <h3 align="center">Made with ❤️</h3>

packages/core/timer/Readme.md

@@ -1,4 +1,4 @@
-Timer module. Functions also can be availble in the global context if you require *globals* module.
+Timer module. Functions also can be available in the global context if you require *globals* module.
 ```js
     require("globals");
 

packages/webpack/helpers/moduleid-compat-loader.js

@@ -6,11 +6,11 @@
 module.exports = function (source, map) {
     this.cacheable();
 
-    // Strips occurences of `moduleId: module.id,`, since it is no longer needed for webpack builds
+    // Strips occurrences of `moduleId: module.id,`, since it is no longer needed for webpack builds
     const noModuleIdsSource = source.replace(/moduleId\:\s*module\.id\s*(\,)?/g, result =>
         // Try to preserve char count so sourcemaps may remain intact
         "/*" + result.substring(2, result.length - 2) + "*/"
     );
 
     this.callback(null, noModuleIdsSource, map);
-};
+};

packages/webpack5/__tests__/configuration/__snapshots__/angular.spec.ts.snap

@@ -400,7 +400,8 @@ exports[`angular configuration for android 1`] = `
     new AngularWebpackPlugin(
       {
         tsconfig: '__jest__/tsconfig.json',
-        directTemplateLoading: false
+        directTemplateLoading: false,
+        jitMode: false
       }
     )
   ],
@@ -816,7 +817,8 @@ exports[`angular configuration for ios 1`] = `
     new AngularWebpackPlugin(
       {
         tsconfig: '__jest__/tsconfig.json',
-        directTemplateLoading: false
+        directTemplateLoading: false,
+        jitMode: false
       }
     )
   ],

packages/webpack5/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@nativescript/webpack",
-	"version": "5.0.2-alpha.1",
+	"version": "5.0.4",
 	"private": false,
 	"main": "dist/index.js",
 	"files": [
@@ -56,6 +56,7 @@
 		"webpack-virtual-modules": "^0.4.0"
 	},
 	"devDependencies": {
+		"@angular-devkit/build-angular": "^13.1.2",
 		"@types/css": "0.0.33",
 		"@types/jest": "27.0.1",
 		"@types/loader-utils": "2.0.3",

packages/webpack5/src/configuration/angular.ts

@@ -1,10 +1,12 @@
-import { ScriptTarget } from 'typescript';
 import { extname, resolve } from 'path';
 import Config from 'webpack-chain';
 import { existsSync } from 'fs';
 
+import { getTypescript, readTsConfig } from '../helpers/typescript';
+import { getDependencyPath } from '../helpers/dependencies';
 import { getProjectFilePath } from '../helpers/project';
 import { env as _env, IWebpackEnv } from '../index';
+import { warnOnce } from '../helpers/log';
 import {
 	getEntryDirPath,
 	getEntryPath,
@@ -22,6 +24,8 @@ export default function (config: Config, env: IWebpackEnv = _env): Config {
 		getProjectFilePath('tsconfig.json'),
 	].find((path) => existsSync(path));
 
+	const disableAOT = !!env.disableAOT;
+
 	// remove default ts rule
 	config.module.rules.delete('ts');
 
@@ -158,6 +162,7 @@ export default function (config: Config, env: IWebpackEnv = _env): Config {
 			{
 				tsconfig: tsConfigPath,
 				directTemplateLoading: false,
+				jitMode: disableAOT,
 			},
 		]);
 
@@ -169,23 +174,41 @@ export default function (config: Config, env: IWebpackEnv = _env): Config {
 				.use('angular-hot-loader')
 				.loader('angular-hot-loader');
 		});
-		// zone + async/await
-		config.module
-			.rule('angular-webpack-loader')
-			.test(/\.[cm]?[tj]sx?$/)
-			.exclude.add(
-				/[/\\](?:core-js|@babel|tslib|web-animations-js|web-streams-polyfill)[/\\]/
-			)
-			.end()
-			.resolve.set('fullySpecified', false)
-			.end()
-			.before('angular')
-			.use('webpack-loader')
-			.loader('@angular-devkit/build-angular/src/babel/webpack-loader')
-			.options({
-				scriptTarget: ScriptTarget.ESNext,
-				aot: true,
-			});
+
+		const buildAngularPath = getDependencyPath('@angular-devkit/build-angular');
+		if (buildAngularPath) {
+			const tsConfig = readTsConfig(tsConfigPath);
+			const { ScriptTarget } = getTypescript();
+			const scriptTarget = tsConfig.options.target ?? ScriptTarget.ESNext;
+			const buildAngularOptions: any = {
+				scriptTarget,
+				aot: !disableAOT,
+			};
+			if (disableAOT) {
+				buildAngularOptions.optimize = false;
+			}
+			// zone + async/await
+			config.module
+				.rule('angular-webpack-loader')
+				.test(/\.[cm]?[tj]sx?$/)
+				.exclude.add(
+					/[/\\](?:core-js|@babel|tslib|web-animations-js|web-streams-polyfill)[/\\]/
+				)
+				.end()
+				.resolve.set('fullySpecified', false)
+				.end()
+				.before('angular')
+				.use('webpack-loader')
+				.loader('@angular-devkit/build-angular/src/babel/webpack-loader')
+				.options(buildAngularOptions);
+		} else {
+			warnOnce(
+				'build-angular-missing',
+				`
+				@angular-devkit/build-angular is missing! Some features may not work as expected. Please install it manually to get rid of this warning.
+				`
+			);
+		}
 	}
 
 	// look for platform specific polyfills first

packages/webpack5/src/helpers/index.ts

@@ -26,6 +26,7 @@ import {
 	getPlatform,
 	getPlatformName,
 } from './platform';
+import { readTsConfig } from './typescript';
 
 // intentionally populated manually
 // as this generates nicer typings
@@ -75,4 +76,7 @@ export default {
 		addVirtualEntry,
 		addVirtualModule,
 	},
+	tsconfig: {
+		readTsConfig,
+	},
 };

packages/webpack5/src/helpers/typescript.ts

@@ -0,0 +1,54 @@
+import { dirname } from 'path';
+import { env } from '..';
+
+import { warnOnce } from './log';
+
+/**
+ * @internal
+ */
+let typescript: typeof import('typescript');
+
+/**
+ * Helper used to import typescript.
+ *
+ * The reason this exists is that not all flavors use Typescript, and
+ * in those cases just importing this helper will throw an exception.
+ */
+export function getTypescript(): typeof import('typescript') {
+	if (typescript) {
+		return typescript;
+	}
+
+	try {
+		typescript = require('typescript');
+		return typescript;
+	} catch (err) {
+		warnOnce(
+			'typescript-missing',
+			`TypeScript is not installed in this project, but a config is trying to use it.`,
+			env.verbose
+				? new Error().stack
+				: 'Run with --env.verbose to log a stack trace to help debug this further.'
+		);
+
+		return {} as any;
+	}
+}
+
+export function readTsConfig(path: string) {
+	const { readConfigFile, parseJsonConfigFileContent, sys } = getTypescript();
+	const f = readConfigFile(path, sys.readFile);
+
+	const parsed = parseJsonConfigFileContent(
+		f.config,
+		{
+			fileExists: sys.fileExists,
+			readFile: sys.readFile,
+			readDirectory: sys.readDirectory,
+			useCaseSensitiveFileNames: true,
+		},
+		dirname(path)
+	);
+
+	return parsed;
+}