From 0375de2edbb4c72445dd056831ccee14ef31335b Mon Sep 17 00:00:00 2001 From: Vasil Chimev Date: Mon, 11 Feb 2019 13:31:27 +0200 Subject: [PATCH 01/10] docs: breaking changes/migration to 0.20.0 --- CHANGELOG.md | 10 ++++++++-- 1 file changed, 8 insertions(+), 2 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 740be1b0..8842832c 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -13,12 +13,18 @@ * **Angular:** apply changes in application styles at runtime with HMR ([#748](https://github.com/NativeScript/nativescript-dev-webpack/issues/748)) ([fe4abfb](https://github.com/NativeScript/nativescript-dev-webpack/commit/fe4abfb)) * **snapshot:** the parameters passed to mksnapshot are now retrieved… ([#789](https://github.com/NativeScript/nativescript-dev-webpack/issues/789)) ([cb68dac](https://github.com/NativeScript/nativescript-dev-webpack/commit/cb68dac)) - -### Migration +### BREAKING CHANGES This version enables *Hot Module Replacement* feature in NativeScript Angular projects by default. There is no need to manually accept *hot* changes and you could safely remove the `module["hot"]` code inside your entry module. +### Migration + +Steps: +- update the plugin by `npm i -D nativescript-dev-webpack@0.20.0` +- update the `webpack.config.js` file by `./node_modules/.bin/update-ns-webpack --configs --deps` +- remove any `module["hot"]` code inside your entry module. + Please, refer to [this](https://github.com/NativeScript/nativescript-angular/wiki/NativeScript-5.2-HMR-with-Angular) wiki page for detailed information. From ba557c51dee94111eeefb97944f19f6df8a37760 Mon Sep 17 00:00:00 2001 From: Vasil Chimev Date: Mon, 11 Feb 2019 15:54:56 +0200 Subject: [PATCH 02/10] docs: update breaking changes/migration (#795) --- CHANGELOG.md | 14 +++++++------- 1 file changed, 7 insertions(+), 7 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 8842832c..99a7a60d 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -15,15 +15,15 @@ ### BREAKING CHANGES -This version enables *Hot Module Replacement* feature in NativeScript Angular projects by default. -There is no need to manually accept *hot* changes and you could safely remove the `module["hot"]` code inside your entry module. +* Hot Module Replacement in NativeScript Angular Project -### Migration +This version enables the *Hot Module Replacement* feature in NativeScript Angular projects by default. + +So far it was required to add a snippet to enable HMR. With this release, you have to __remove__ any previous `module["hot"]` related code so HMR can work out of the box. -Steps: -- update the plugin by `npm i -D nativescript-dev-webpack@0.20.0` -- update the `webpack.config.js` file by `./node_modules/.bin/update-ns-webpack --configs --deps` -- remove any `module["hot"]` code inside your entry module. +However, if you want to continue handling *hot* changes manually, follow [these](https://github.com/NativeScript/nativescript-angular/wiki/NativeScript-5.2-HMR-with-Angular#how-to-manually-enable-hmr-in-nativescript-angular-projects-with-n-52) instructions. + +### Migration Please, refer to [this](https://github.com/NativeScript/nativescript-angular/wiki/NativeScript-5.2-HMR-with-Angular) wiki page for detailed information. From 25bfdcb606f0cba5340428824177f39db8400c51 Mon Sep 17 00:00:00 2001 From: Vasil Chimev Date: Mon, 11 Feb 2019 17:52:46 +0200 Subject: [PATCH 03/10] chore: bump version to 0.20.0 --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index f6cbcba3..f7fb425c 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "nativescript-dev-webpack", - "version": "0.21.0", + "version": "0.20.0", "main": "index", "description": "", "homepage": "http://www.telerik.com", From e2714f2bb1bd815b86f2b826e4c7bc0e58979b6c Mon Sep 17 00:00:00 2001 From: Dimitar Tachev Date: Wed, 13 Feb 2019 15:44:11 +0200 Subject: [PATCH 04/10] fix: add a typescript module resolution when searching for the main Angular module location (#800) --- templates/webpack.angular.js | 6 ++--- utils/ast-utils.ts | 49 +++++++++++++++++++++++++++++++++--- 2 files changed, 49 insertions(+), 6 deletions(-) diff --git a/templates/webpack.angular.js b/templates/webpack.angular.js index e8de5173..64d6087e 100644 --- a/templates/webpack.angular.js +++ b/templates/webpack.angular.js @@ -51,7 +51,7 @@ module.exports = env => { const externals = nsWebpack.getConvertedExternals(env.externals); const appFullPath = resolve(projectRoot, appPath); const appResourcesFullPath = resolve(projectRoot, appResourcesPath); - + const tsConfigName = "tsconfig.tns.json"; const entryModule = `${nsWebpack.getEntryModule(appFullPath)}.ts`; const entryPath = `.${sep}${entryModule}`; const ngCompilerTransformers = []; @@ -68,7 +68,7 @@ module.exports = env => { // directly from node_modules and the Angular modules loader won't be able to resolve the lazy routes // fixes https://github.com/NativeScript/nativescript-cli/issues/4024 if (env.externals && env.externals.indexOf("@angular/core") > -1) { - const appModuleRelativePath = getMainModulePath(resolve(appFullPath, entryModule)); + const appModuleRelativePath = getMainModulePath(resolve(appFullPath, entryModule), tsConfigName); if (appModuleRelativePath) { const appModuleFolderPath = dirname(resolve(appFullPath, appModuleRelativePath)); // include the lazy loader inside app module @@ -82,7 +82,7 @@ module.exports = env => { hostReplacementPaths: nsWebpack.getResolver([platform, "tns"]), platformTransformers: ngCompilerTransformers.map(t => t(() => ngCompilerPlugin, resolve(appFullPath, entryModule))), mainPath: resolve(appPath, entryModule), - tsConfigPath: join(__dirname, "tsconfig.tns.json"), + tsConfigPath: join(__dirname, tsConfigName), skipCodeGeneration: !aot, sourceMap: !!sourceMap, additionalLazyModuleResources: additionalLazyModuleResources diff --git a/utils/ast-utils.ts b/utils/ast-utils.ts index a98c53de..88660b86 100644 --- a/utils/ast-utils.ts +++ b/utils/ast-utils.ts @@ -14,19 +14,62 @@ // example of a working workaround by searching for content in each parent. // 4) Always test your transformer both single and in combinations with the other ones. -import { dirname, join } from "path"; +import { dirname, join, relative } from "path"; import * as ts from "typescript"; import { readFileSync, existsSync } from "fs"; import { collectDeepNodes } from "@ngtools/webpack/src/transformers"; -export function getMainModulePath(entryFilePath) { +export function getMainModulePath(entryFilePath: string, tsConfigName: string) { try { - return findBootstrappedModulePath(entryFilePath); + // backwards compatibility + tsConfigName = tsConfigName || "tsconfig.tns.json"; + + const tsModuleName = findBootstrappedModulePath(entryFilePath); + const result = tsResolve(tsModuleName, entryFilePath, tsConfigName); + + return result; } catch (e) { return null; } } +/** + * Returns the real path to the ts/d.ts of the specified `moduleName` relative to the specified `containingFilePath`. (e.g. `~/app/file` -> `./app/file.ts`) + * @param moduleName The name of the module to be resolved (e.g. `~/config.js`, `lodash`, `./already-relative.js`, `@custom-path/file`). + * @param containingFilePath An absolute path to the file where the `moduleName` is imported. The relative result will be based on this file. + * @param tsConfigName The name of the tsconfig which will be used during the module resolution (e.g. `tsconfig.json`). + * We need this config in order to get its compiler options into account (e.g. resolve any custom `paths` like `~` or `@src`). + */ +function tsResolve(moduleName: string, containingFilePath: string, tsConfigName: string) { + let result = moduleName; + try { + const parseConfigFileHost: ts.ParseConfigFileHost = { + getCurrentDirectory: ts.sys.getCurrentDirectory, + useCaseSensitiveFileNames: false, + readDirectory: ts.sys.readDirectory, + fileExists: ts.sys.fileExists, + readFile: ts.sys.readFile, + onUnRecoverableConfigFileDiagnostic: undefined + }; + + const tsConfig = ts.getParsedCommandLineOfConfigFile(tsConfigName, ts.getDefaultCompilerOptions(), parseConfigFileHost); + + const compilerOptions: ts.CompilerOptions = tsConfig.options || ts.getDefaultCompilerOptions(); + const moduleResolutionHost: ts.ModuleResolutionHost = { + fileExists: ts.sys.fileExists, + readFile: ts.sys.readFile + }; + + const resolutionResult = ts.resolveModuleName(moduleName, containingFilePath, compilerOptions, moduleResolutionHost); + + if (resolutionResult && resolutionResult.resolvedModule && resolutionResult.resolvedModule.resolvedFileName) { + result = relative(dirname(containingFilePath), resolutionResult.resolvedModule.resolvedFileName); + } + } catch (err) { } + + return result; +} + export function findBootstrapModuleCall(mainPath: string): ts.CallExpression | null { const source = getSourceFile(mainPath); From 4f3e8a640e502a76ef75435428db010d662e8de5 Mon Sep 17 00:00:00 2001 From: Ventsislav Georgiev Date: Fri, 15 Feb 2019 10:26:19 +0200 Subject: [PATCH 05/10] feat: allow angular resolver configuration via webpack.config --- host/resolver.ts | 15 +++++++-------- 1 file changed, 7 insertions(+), 8 deletions(-) diff --git a/host/resolver.ts b/host/resolver.ts index 30d8c7a0..f32fd50b 100644 --- a/host/resolver.ts +++ b/host/resolver.ts @@ -1,13 +1,12 @@ import { parse, join } from "path"; import { statSync } from "fs"; -export function getResolver(platforms: string[], explicitResolve: string[] = []) { - const platformSpecificExt = [".ts", ".js", ".scss", ".less", ".css", ".html", ".xml", ".vue", ".json"]; - const nsPackageFilters = [ - 'nativescript', - 'tns', - 'ns' - ]; +export function getResolver(platforms: string[], options: { nsPackageFilters?: string[], explicitResolve?: string[], platformSpecificExt?: string[] } = {}) { + options.nsPackageFilters = options.nsPackageFilters || ['nativescript', 'tns', 'ns']; + options.explicitResolve = options.explicitResolve || []; + options.platformSpecificExt = options.platformSpecificExt || [".ts", ".js", ".scss", ".less", ".css", ".html", ".xml", ".vue", ".json"]; + + const { nsPackageFilters, explicitResolve, platformSpecificExt } = options; return function (path: string) { const nmIndex = path.lastIndexOf('node_modules'); @@ -16,7 +15,7 @@ export function getResolver(platforms: string[], explicitResolve: string[] = []) const subPath = path.substr(nmIndex + 'node_modules'.length).replace(/\\/g, '/'); const shouldResolve = explicitResolve.length && explicitResolve.some(packageName => subPath.indexOf(packageName) !== -1); const pathParts = subPath.split(/[/\-_]/); - + if (!shouldResolve && pathParts.every(p => nsPackageFilters.every(f => f !== p))) { return path; } From c9fc73186a030bc2a2293ba012984ba8c8eb5098 Mon Sep 17 00:00:00 2001 From: Ventsislav Georgiev Date: Fri, 15 Feb 2019 11:41:35 +0200 Subject: [PATCH 06/10] feat: backwards compatible angular resolver options --- host/resolver.ts | 10 ++++------ 1 file changed, 4 insertions(+), 6 deletions(-) diff --git a/host/resolver.ts b/host/resolver.ts index f32fd50b..6cff232c 100644 --- a/host/resolver.ts +++ b/host/resolver.ts @@ -1,12 +1,10 @@ import { parse, join } from "path"; import { statSync } from "fs"; -export function getResolver(platforms: string[], options: { nsPackageFilters?: string[], explicitResolve?: string[], platformSpecificExt?: string[] } = {}) { - options.nsPackageFilters = options.nsPackageFilters || ['nativescript', 'tns', 'ns']; - options.explicitResolve = options.explicitResolve || []; - options.platformSpecificExt = options.platformSpecificExt || [".ts", ".js", ".scss", ".less", ".css", ".html", ".xml", ".vue", ".json"]; - - const { nsPackageFilters, explicitResolve, platformSpecificExt } = options; +export function getResolver(platforms: string[], explicitResolve?: string[], nsPackageFilters?: string[], platformSpecificExt?: string[]) { + explicitResolve = explicitResolve || []; + nsPackageFilters = nsPackageFilters || ['nativescript', 'tns', 'ns']; + platformSpecificExt = platformSpecificExt || [".ts", ".js", ".scss", ".less", ".css", ".html", ".xml", ".vue", ".json"]; return function (path: string) { const nmIndex = path.lastIndexOf('node_modules'); From 87cc59a3a976d4823f948be2eec849d79f804385 Mon Sep 17 00:00:00 2001 From: Manol Donev Date: Mon, 18 Feb 2019 13:48:01 +0200 Subject: [PATCH 07/10] chore: bump ng dependencies to match ns-angular (#801) --- package.json | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/package.json b/package.json index f7fb425c..f97b1def 100644 --- a/package.json +++ b/package.json @@ -74,7 +74,7 @@ "generate-android-snapshot": "./bin/generate-android-snapshot" }, "dependencies": { - "@angular-devkit/core": "~7.1.0", + "@angular-devkit/core": "~7.2.0", "clean-webpack-plugin": "~1.0.0", "copy-webpack-plugin": "~4.6.0", "css-loader": "~1.0.0", @@ -99,7 +99,7 @@ "webpack-sources": "~1.3.0" }, "devDependencies": { - "@ngtools/webpack": "~7.1.0", + "@ngtools/webpack": "~7.2.0", "@types/jasmine": "^3.3.7", "@types/node": "^10.12.12", "@types/proxyquire": "1.3.28", From 4328b4e3401524800598cd002002c4231a9d55f0 Mon Sep 17 00:00:00 2001 From: Svetoslav Date: Mon, 18 Feb 2019 19:03:45 +0200 Subject: [PATCH 08/10] cut the 0.20.1 release (#803) --- CHANGELOG.md | 16 ++++++++++++++++ package.json | 2 +- 2 files changed, 17 insertions(+), 1 deletion(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 99a7a60d..3f2087e5 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,3 +1,19 @@ + +## [0.20.1](https://github.com/NativeScript/nativescript-dev-webpack/compare/0.20.0...0.20.1) (2019-02-18) + + +### Bug Fixes + +* add a typescript module resolution when searching for the main Angular module location ([#800](https://github.com/NativeScript/nativescript-dev-webpack/issues/800)) ([e2714f2](https://github.com/NativeScript/nativescript-dev-webpack/commit/e2714f2)) + + +### Features + +* allow angular resolver configuration via webpack.config ([4f3e8a6](https://github.com/NativeScript/nativescript-dev-webpack/commit/4f3e8a6)) +* backwards compatible angular resolver options ([c9fc731](https://github.com/NativeScript/nativescript-dev-webpack/commit/c9fc731)) + + + # [0.20.0](https://github.com/NativeScript/nativescript-dev-webpack/compare/0.18.3...0.20.0) (2019-02-08) diff --git a/package.json b/package.json index f97b1def..a9436128 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "nativescript-dev-webpack", - "version": "0.20.0", + "version": "0.20.1", "main": "index", "description": "", "homepage": "http://www.telerik.com", From 203150417d757a9e525f1cef2a667faf35f08225 Mon Sep 17 00:00:00 2001 From: SvetoslavTsenov Date: Mon, 18 Feb 2019 19:18:53 +0200 Subject: [PATCH 09/10] docs: fix tag --- CHANGELOG.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 3f2087e5..693e7c43 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -15,7 +15,7 @@ -# [0.20.0](https://github.com/NativeScript/nativescript-dev-webpack/compare/0.18.3...0.20.0) (2019-02-08) +# [0.20.0](https://github.com/NativeScript/nativescript-dev-webpack/compare/0.19.2...0.20.0) (2019-02-08) ### Bug Fixes From 17ad93e6e8717b163c06869169db6ae21a45d34c Mon Sep 17 00:00:00 2001 From: SvetoslavTsenov Date: Mon, 18 Feb 2019 19:21:12 +0200 Subject: [PATCH 10/10] chore: fix version --- package.json | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/package.json b/package.json index a9436128..f6cbcba3 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "nativescript-dev-webpack", - "version": "0.20.1", + "version": "0.21.0", "main": "index", "description": "", "homepage": "http://www.telerik.com", @@ -74,7 +74,7 @@ "generate-android-snapshot": "./bin/generate-android-snapshot" }, "dependencies": { - "@angular-devkit/core": "~7.2.0", + "@angular-devkit/core": "~7.1.0", "clean-webpack-plugin": "~1.0.0", "copy-webpack-plugin": "~4.6.0", "css-loader": "~1.0.0", @@ -99,7 +99,7 @@ "webpack-sources": "~1.3.0" }, "devDependencies": { - "@ngtools/webpack": "~7.2.0", + "@ngtools/webpack": "~7.1.0", "@types/jasmine": "^3.3.7", "@types/node": "^10.12.12", "@types/proxyquire": "1.3.28",