From 1025270fad8d682470349f0b88fb2d26243d5fcb Mon Sep 17 00:00:00 2001 From: Igor Randjelovic Date: Thu, 1 Apr 2021 17:00:19 +0200 Subject: [PATCH 1/8] fix: node_module resolution when using relative packages --- .../__snapshots__/angular.spec.ts.snap | 8 ++++++++ .../__snapshots__/base.spec.ts.snap | 8 ++++++++ .../__snapshots__/javascript.spec.ts.snap | 8 ++++++++ .../__snapshots__/react.spec.ts.snap | 16 ++++++++++++++++ .../__snapshots__/svelte.spec.ts.snap | 8 ++++++++ .../__snapshots__/typescript.spec.ts.snap | 8 ++++++++ .../configuration/__snapshots__/vue.spec.ts.snap | 8 ++++++++ packages/webpack5/src/configuration/base.ts | 6 ++++++ 8 files changed, 70 insertions(+) diff --git a/packages/webpack5/__tests__/configuration/__snapshots__/angular.spec.ts.snap b/packages/webpack5/__tests__/configuration/__snapshots__/angular.spec.ts.snap index c86b94d43f..bc695be4b3 100644 --- a/packages/webpack5/__tests__/configuration/__snapshots__/angular.spec.ts.snap +++ b/packages/webpack5/__tests__/configuration/__snapshots__/angular.spec.ts.snap @@ -49,6 +49,10 @@ exports[`angular configuration for android 1`] = ` mainFields: [ 'module', 'main' + ], + modules: [ + '__jest__/node_modules', + 'node_modules' ] }, resolveLoader: { @@ -349,6 +353,10 @@ exports[`angular configuration for ios 1`] = ` mainFields: [ 'module', 'main' + ], + modules: [ + '__jest__/node_modules', + 'node_modules' ] }, resolveLoader: { diff --git a/packages/webpack5/__tests__/configuration/__snapshots__/base.spec.ts.snap b/packages/webpack5/__tests__/configuration/__snapshots__/base.spec.ts.snap index 4955469d67..6d2f743327 100644 --- a/packages/webpack5/__tests__/configuration/__snapshots__/base.spec.ts.snap +++ b/packages/webpack5/__tests__/configuration/__snapshots__/base.spec.ts.snap @@ -43,6 +43,10 @@ exports[`base configuration for android 1`] = ` '.scss', '.android.json', '.json' + ], + modules: [ + '__jest__/node_modules', + 'node_modules' ] }, resolveLoader: { @@ -329,6 +333,10 @@ exports[`base configuration for ios 1`] = ` '.scss', '.ios.json', '.json' + ], + modules: [ + '__jest__/node_modules', + 'node_modules' ] }, resolveLoader: { diff --git a/packages/webpack5/__tests__/configuration/__snapshots__/javascript.spec.ts.snap b/packages/webpack5/__tests__/configuration/__snapshots__/javascript.spec.ts.snap index a35aeb83b7..e202175cdb 100644 --- a/packages/webpack5/__tests__/configuration/__snapshots__/javascript.spec.ts.snap +++ b/packages/webpack5/__tests__/configuration/__snapshots__/javascript.spec.ts.snap @@ -43,6 +43,10 @@ exports[`javascript configuration for android 1`] = ` '.scss', '.android.json', '.json' + ], + modules: [ + '__jest__/node_modules', + 'node_modules' ] }, resolveLoader: { @@ -367,6 +371,10 @@ exports[`javascript configuration for ios 1`] = ` '.scss', '.ios.json', '.json' + ], + modules: [ + '__jest__/node_modules', + 'node_modules' ] }, resolveLoader: { diff --git a/packages/webpack5/__tests__/configuration/__snapshots__/react.spec.ts.snap b/packages/webpack5/__tests__/configuration/__snapshots__/react.spec.ts.snap index 67de0a79fb..e5dd0b3b2e 100644 --- a/packages/webpack5/__tests__/configuration/__snapshots__/react.spec.ts.snap +++ b/packages/webpack5/__tests__/configuration/__snapshots__/react.spec.ts.snap @@ -46,6 +46,10 @@ exports[`react configuration > android > adds ReactRefreshWebpackPlugin when HMR '.scss', '.android.json', '.json' + ], + modules: [ + '__jest__/node_modules', + 'node_modules' ] }, resolveLoader: { @@ -360,6 +364,10 @@ exports[`react configuration > android > base config 1`] = ` '.scss', '.android.json', '.json' + ], + modules: [ + '__jest__/node_modules', + 'node_modules' ] }, resolveLoader: { @@ -652,6 +660,10 @@ exports[`react configuration > ios > adds ReactRefreshWebpackPlugin when HMR ena '.scss', '.ios.json', '.json' + ], + modules: [ + '__jest__/node_modules', + 'node_modules' ] }, resolveLoader: { @@ -967,6 +979,10 @@ exports[`react configuration > ios > base config 1`] = ` '.scss', '.ios.json', '.json' + ], + modules: [ + '__jest__/node_modules', + 'node_modules' ] }, resolveLoader: { diff --git a/packages/webpack5/__tests__/configuration/__snapshots__/svelte.spec.ts.snap b/packages/webpack5/__tests__/configuration/__snapshots__/svelte.spec.ts.snap index 2c11a48a49..88871e6f95 100644 --- a/packages/webpack5/__tests__/configuration/__snapshots__/svelte.spec.ts.snap +++ b/packages/webpack5/__tests__/configuration/__snapshots__/svelte.spec.ts.snap @@ -45,6 +45,10 @@ exports[`svelte configuration for android 1`] = ` '.scss', '.android.json', '.json' + ], + modules: [ + '__jest__/node_modules', + 'node_modules' ] }, resolveLoader: { @@ -356,6 +360,10 @@ exports[`svelte configuration for ios 1`] = ` '.scss', '.ios.json', '.json' + ], + modules: [ + '__jest__/node_modules', + 'node_modules' ] }, resolveLoader: { diff --git a/packages/webpack5/__tests__/configuration/__snapshots__/typescript.spec.ts.snap b/packages/webpack5/__tests__/configuration/__snapshots__/typescript.spec.ts.snap index d95cab7f08..2d356ba14b 100644 --- a/packages/webpack5/__tests__/configuration/__snapshots__/typescript.spec.ts.snap +++ b/packages/webpack5/__tests__/configuration/__snapshots__/typescript.spec.ts.snap @@ -43,6 +43,10 @@ exports[`typescript configuration for android 1`] = ` '.scss', '.android.json', '.json' + ], + modules: [ + '__jest__/node_modules', + 'node_modules' ] }, resolveLoader: { @@ -367,6 +371,10 @@ exports[`typescript configuration for ios 1`] = ` '.scss', '.ios.json', '.json' + ], + modules: [ + '__jest__/node_modules', + 'node_modules' ] }, resolveLoader: { diff --git a/packages/webpack5/__tests__/configuration/__snapshots__/vue.spec.ts.snap b/packages/webpack5/__tests__/configuration/__snapshots__/vue.spec.ts.snap index 52f510895e..9441f6687a 100644 --- a/packages/webpack5/__tests__/configuration/__snapshots__/vue.spec.ts.snap +++ b/packages/webpack5/__tests__/configuration/__snapshots__/vue.spec.ts.snap @@ -46,6 +46,10 @@ exports[`vue configuration for android 1`] = ` '.scss', '.android.json', '.json' + ], + modules: [ + '__jest__/node_modules', + 'node_modules' ] }, resolveLoader: { @@ -364,6 +368,10 @@ exports[`vue configuration for ios 1`] = ` '.scss', '.ios.json', '.json' + ], + modules: [ + '__jest__/node_modules', + 'node_modules' ] }, resolveLoader: { diff --git a/packages/webpack5/src/configuration/base.ts b/packages/webpack5/src/configuration/base.ts index f50beb3a91..62315a6733 100644 --- a/packages/webpack5/src/configuration/base.ts +++ b/packages/webpack5/src/configuration/base.ts @@ -137,6 +137,12 @@ export default function (config: Config, env: IWebpackEnv = _env): Config { // resolve symlinks config.resolve.symlinks(true); + // resolve modules in project node_modules first + // then fall-back to default node resolution (up the parent folder chain) + config.resolve.modules + .add(getProjectFilePath('node_modules')) + .add('node_modules'); + config.module .rule('bundle') .enforce('post') From fb2c29106378f21583d890174f1c5a6bca6e6b8a Mon Sep 17 00:00:00 2001 From: Igor Randjelovic Date: Thu, 1 Apr 2021 17:55:11 +0200 Subject: [PATCH 2/8] feat: look for loaders in project node_modules first --- .../configuration/__snapshots__/angular.spec.ts.snap | 4 ++++ .../configuration/__snapshots__/base.spec.ts.snap | 4 ++++ .../configuration/__snapshots__/javascript.spec.ts.snap | 4 ++++ .../configuration/__snapshots__/react.spec.ts.snap | 8 ++++++++ .../configuration/__snapshots__/svelte.spec.ts.snap | 4 ++++ .../configuration/__snapshots__/typescript.spec.ts.snap | 4 ++++ .../configuration/__snapshots__/vue.spec.ts.snap | 4 ++++ packages/webpack5/src/configuration/base.ts | 2 ++ 8 files changed, 34 insertions(+) diff --git a/packages/webpack5/__tests__/configuration/__snapshots__/angular.spec.ts.snap b/packages/webpack5/__tests__/configuration/__snapshots__/angular.spec.ts.snap index bc695be4b3..7f34508f44 100644 --- a/packages/webpack5/__tests__/configuration/__snapshots__/angular.spec.ts.snap +++ b/packages/webpack5/__tests__/configuration/__snapshots__/angular.spec.ts.snap @@ -57,7 +57,9 @@ exports[`angular configuration for android 1`] = ` }, resolveLoader: { modules: [ + '__jest__/node_modules/@nativescript/webpack/dist/loaders', 'node_modules/@nativescript/webpack/dist/loaders', + '__jest__/node_modules', 'node_modules' ] }, @@ -361,7 +363,9 @@ exports[`angular configuration for ios 1`] = ` }, resolveLoader: { modules: [ + '__jest__/node_modules/@nativescript/webpack/dist/loaders', 'node_modules/@nativescript/webpack/dist/loaders', + '__jest__/node_modules', 'node_modules' ] }, diff --git a/packages/webpack5/__tests__/configuration/__snapshots__/base.spec.ts.snap b/packages/webpack5/__tests__/configuration/__snapshots__/base.spec.ts.snap index 6d2f743327..fcc8df51a4 100644 --- a/packages/webpack5/__tests__/configuration/__snapshots__/base.spec.ts.snap +++ b/packages/webpack5/__tests__/configuration/__snapshots__/base.spec.ts.snap @@ -51,7 +51,9 @@ exports[`base configuration for android 1`] = ` }, resolveLoader: { modules: [ + '__jest__/node_modules/@nativescript/webpack/dist/loaders', 'node_modules/@nativescript/webpack/dist/loaders', + '__jest__/node_modules', 'node_modules' ] }, @@ -341,7 +343,9 @@ exports[`base configuration for ios 1`] = ` }, resolveLoader: { modules: [ + '__jest__/node_modules/@nativescript/webpack/dist/loaders', 'node_modules/@nativescript/webpack/dist/loaders', + '__jest__/node_modules', 'node_modules' ] }, diff --git a/packages/webpack5/__tests__/configuration/__snapshots__/javascript.spec.ts.snap b/packages/webpack5/__tests__/configuration/__snapshots__/javascript.spec.ts.snap index e202175cdb..fdadf6ec5f 100644 --- a/packages/webpack5/__tests__/configuration/__snapshots__/javascript.spec.ts.snap +++ b/packages/webpack5/__tests__/configuration/__snapshots__/javascript.spec.ts.snap @@ -51,7 +51,9 @@ exports[`javascript configuration for android 1`] = ` }, resolveLoader: { modules: [ + '__jest__/node_modules/@nativescript/webpack/dist/loaders', 'node_modules/@nativescript/webpack/dist/loaders', + '__jest__/node_modules', 'node_modules' ] }, @@ -379,7 +381,9 @@ exports[`javascript configuration for ios 1`] = ` }, resolveLoader: { modules: [ + '__jest__/node_modules/@nativescript/webpack/dist/loaders', 'node_modules/@nativescript/webpack/dist/loaders', + '__jest__/node_modules', 'node_modules' ] }, diff --git a/packages/webpack5/__tests__/configuration/__snapshots__/react.spec.ts.snap b/packages/webpack5/__tests__/configuration/__snapshots__/react.spec.ts.snap index e5dd0b3b2e..b9ada48ae9 100644 --- a/packages/webpack5/__tests__/configuration/__snapshots__/react.spec.ts.snap +++ b/packages/webpack5/__tests__/configuration/__snapshots__/react.spec.ts.snap @@ -54,7 +54,9 @@ exports[`react configuration > android > adds ReactRefreshWebpackPlugin when HMR }, resolveLoader: { modules: [ + '__jest__/node_modules/@nativescript/webpack/dist/loaders', 'node_modules/@nativescript/webpack/dist/loaders', + '__jest__/node_modules', 'node_modules' ] }, @@ -372,7 +374,9 @@ exports[`react configuration > android > base config 1`] = ` }, resolveLoader: { modules: [ + '__jest__/node_modules/@nativescript/webpack/dist/loaders', 'node_modules/@nativescript/webpack/dist/loaders', + '__jest__/node_modules', 'node_modules' ] }, @@ -668,7 +672,9 @@ exports[`react configuration > ios > adds ReactRefreshWebpackPlugin when HMR ena }, resolveLoader: { modules: [ + '__jest__/node_modules/@nativescript/webpack/dist/loaders', 'node_modules/@nativescript/webpack/dist/loaders', + '__jest__/node_modules', 'node_modules' ] }, @@ -987,7 +993,9 @@ exports[`react configuration > ios > base config 1`] = ` }, resolveLoader: { modules: [ + '__jest__/node_modules/@nativescript/webpack/dist/loaders', 'node_modules/@nativescript/webpack/dist/loaders', + '__jest__/node_modules', 'node_modules' ] }, diff --git a/packages/webpack5/__tests__/configuration/__snapshots__/svelte.spec.ts.snap b/packages/webpack5/__tests__/configuration/__snapshots__/svelte.spec.ts.snap index 88871e6f95..b478e0bc26 100644 --- a/packages/webpack5/__tests__/configuration/__snapshots__/svelte.spec.ts.snap +++ b/packages/webpack5/__tests__/configuration/__snapshots__/svelte.spec.ts.snap @@ -53,7 +53,9 @@ exports[`svelte configuration for android 1`] = ` }, resolveLoader: { modules: [ + '__jest__/node_modules/@nativescript/webpack/dist/loaders', 'node_modules/@nativescript/webpack/dist/loaders', + '__jest__/node_modules', 'node_modules' ] }, @@ -368,7 +370,9 @@ exports[`svelte configuration for ios 1`] = ` }, resolveLoader: { modules: [ + '__jest__/node_modules/@nativescript/webpack/dist/loaders', 'node_modules/@nativescript/webpack/dist/loaders', + '__jest__/node_modules', 'node_modules' ] }, diff --git a/packages/webpack5/__tests__/configuration/__snapshots__/typescript.spec.ts.snap b/packages/webpack5/__tests__/configuration/__snapshots__/typescript.spec.ts.snap index 2d356ba14b..74792e3a58 100644 --- a/packages/webpack5/__tests__/configuration/__snapshots__/typescript.spec.ts.snap +++ b/packages/webpack5/__tests__/configuration/__snapshots__/typescript.spec.ts.snap @@ -51,7 +51,9 @@ exports[`typescript configuration for android 1`] = ` }, resolveLoader: { modules: [ + '__jest__/node_modules/@nativescript/webpack/dist/loaders', 'node_modules/@nativescript/webpack/dist/loaders', + '__jest__/node_modules', 'node_modules' ] }, @@ -379,7 +381,9 @@ exports[`typescript configuration for ios 1`] = ` }, resolveLoader: { modules: [ + '__jest__/node_modules/@nativescript/webpack/dist/loaders', 'node_modules/@nativescript/webpack/dist/loaders', + '__jest__/node_modules', 'node_modules' ] }, diff --git a/packages/webpack5/__tests__/configuration/__snapshots__/vue.spec.ts.snap b/packages/webpack5/__tests__/configuration/__snapshots__/vue.spec.ts.snap index 9441f6687a..e7a5c85922 100644 --- a/packages/webpack5/__tests__/configuration/__snapshots__/vue.spec.ts.snap +++ b/packages/webpack5/__tests__/configuration/__snapshots__/vue.spec.ts.snap @@ -54,7 +54,9 @@ exports[`vue configuration for android 1`] = ` }, resolveLoader: { modules: [ + '__jest__/node_modules/@nativescript/webpack/dist/loaders', 'node_modules/@nativescript/webpack/dist/loaders', + '__jest__/node_modules', 'node_modules' ] }, @@ -376,7 +378,9 @@ exports[`vue configuration for ios 1`] = ` }, resolveLoader: { modules: [ + '__jest__/node_modules/@nativescript/webpack/dist/loaders', 'node_modules/@nativescript/webpack/dist/loaders', + '__jest__/node_modules', 'node_modules' ] }, diff --git a/packages/webpack5/src/configuration/base.ts b/packages/webpack5/src/configuration/base.ts index 62315a6733..1753e41066 100644 --- a/packages/webpack5/src/configuration/base.ts +++ b/packages/webpack5/src/configuration/base.ts @@ -116,7 +116,9 @@ export default function (config: Config, env: IWebpackEnv = _env): Config { // - node_modules // allows for cleaner rules, without having to specify full paths to loaders config.resolveLoader.modules + .add(getProjectFilePath('node_modules/@nativescript/webpack/dist/loaders')) .add('node_modules/@nativescript/webpack/dist/loaders') + .add(getProjectFilePath('node_modules')) .add('node_modules'); config.resolve.extensions From 7edb1e90b0e7dd8a69d794e34e515dfb6bf96abd Mon Sep 17 00:00:00 2001 From: Igor Randjelovic Date: Thu, 1 Apr 2021 17:55:21 +0200 Subject: [PATCH 3/8] fix: copy stubs step --- packages/webpack5/package.json | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/packages/webpack5/package.json b/packages/webpack5/package.json index 258998ce86..b6b5621040 100644 --- a/packages/webpack5/package.json +++ b/packages/webpack5/package.json @@ -13,7 +13,8 @@ "scripts": { "build": "tsc --project tsconfig.build.json", "test": "jest", - "prepack": "npm test && npm run build && cp -R src/stubs dist/stubs && chmod +x dist/bin/index.js" + "copy-stubs": "mkdirp dist/stubs && cp -R src/stubs/* dist/stubs", + "prepack": "npm test && npm run build && npm run copy-stubs && chmod +x dist/bin/index.js" }, "dependencies": { "@babel/core": "7.13.14", From 1627f52043599dd0d9aad8d66747da959be4e3f2 Mon Sep 17 00:00:00 2001 From: Igor Randjelovic Date: Thu, 1 Apr 2021 17:55:45 +0200 Subject: [PATCH 4/8] feat: warnOnce & graceful error handling --- packages/webpack5/src/helpers/config.ts | 15 ++++++++++++--- packages/webpack5/src/helpers/index.ts | 10 ++++++++-- packages/webpack5/src/helpers/log.ts | 10 ++++++++++ packages/webpack5/src/helpers/platform.ts | 13 ++++++++++--- 4 files changed, 40 insertions(+), 8 deletions(-) diff --git a/packages/webpack5/src/helpers/config.ts b/packages/webpack5/src/helpers/config.ts index 3e8951a167..ae649ead9c 100644 --- a/packages/webpack5/src/helpers/config.ts +++ b/packages/webpack5/src/helpers/config.ts @@ -1,11 +1,15 @@ import { env } from '../index'; -import { error } from './log'; +import { error, warnOnce } from './log'; function getCLILib() { if (!env.nativescriptLibPath) { - throw error(` + warnOnce( + 'getCLILib', + ` Cannot find NativeScript CLI path. Make sure --env.nativescriptLibPath is passed - `); + ` + ); + return false; } return require(env.nativescriptLibPath); @@ -15,10 +19,15 @@ function getCLILib() { * Utility to get a value from the nativescript.config.ts file. * * @param {string} key The key to get from the config. Supports dot-notation. + * @param defaultValue The fallback value if the key is not set in the config. */ export function getValue(key: string, defaultValue?: any): T { const lib = getCLILib(); + if (!lib) { + return defaultValue; + } + return (lib.projectConfigService as { getValue(key: string, defaultValue?: any): T; }).getValue(key, defaultValue); diff --git a/packages/webpack5/src/helpers/index.ts b/packages/webpack5/src/helpers/index.ts index 405087f5ac..56637d566b 100644 --- a/packages/webpack5/src/helpers/index.ts +++ b/packages/webpack5/src/helpers/index.ts @@ -1,11 +1,15 @@ import { merge } from 'webpack-merge'; +import { + getPackageJson, + getProjectRootPath, + getProjectFilePath, +} from './project'; import { addVirtualEntry, addVirtualModule } from './virtualModules'; -import { getPackageJson, getProjectRootPath } from './project'; import { applyFileReplacements } from './fileReplacements'; import { addCopyRule, removeCopyRule } from './copyRules'; +import { error, info, warn, warnOnce } from './log'; import { determineProjectFlavor } from './flavor'; -import { error, info, warn } from './log'; import { getValue } from './config'; import { getIPS } from './host'; import { @@ -51,6 +55,7 @@ export default { error, info, warn, + warnOnce, }, platform: { addPlatform, @@ -62,6 +67,7 @@ export default { getPlatformName, }, project: { + getProjectFilePath, getProjectRootPath, getPackageJson, }, diff --git a/packages/webpack5/src/helpers/log.ts b/packages/webpack5/src/helpers/log.ts index 725048848e..ac70c163ac 100644 --- a/packages/webpack5/src/helpers/log.ts +++ b/packages/webpack5/src/helpers/log.ts @@ -28,6 +28,16 @@ export function warn(...data: any): void { console.warn(`[@nativescript/webpack] Warn: \n`, ...cleanup(data)); } +const warnedMap: any = {}; +export function warnOnce(key: string, ...data: any): void { + if (warnedMap[key]) { + return; + } + + warnedMap[key] = true; + warn(...data); +} + export function info(...data: any): void { if (env.verbose) { console.log(`[@nativescript/webpack] Info: \n`, ...cleanup(data)); diff --git a/packages/webpack5/src/helpers/platform.ts b/packages/webpack5/src/helpers/platform.ts index 2619f52877..f59389af13 100644 --- a/packages/webpack5/src/helpers/platform.ts +++ b/packages/webpack5/src/helpers/platform.ts @@ -1,7 +1,7 @@ import { dirname, resolve } from 'path'; import { getPackageJson, getProjectRootPath } from './project'; -import { error, info } from './log'; +import { error, info, warnOnce } from './log'; import { env } from '../'; import AndroidPlatform from '../platforms/android'; @@ -65,13 +65,20 @@ export function getPlatformName(): Platform { `); } - throw error(` + warnOnce( + 'getPlatformName', + ` You need to provide a target platform! Available platforms: ${Object.keys(platforms).join(', ')} Use --env.platform= or --env.android, --env.ios to specify the target platform. - `); + + Defaulting to "ios". + ` + ); + + return 'ios'; } /** From d8067a553f78186f8abe1408bce09606f1e08898 Mon Sep 17 00:00:00 2001 From: Igor Randjelovic Date: Fri, 2 Apr 2021 14:53:04 +0200 Subject: [PATCH 5/8] fix: resolving loaders from non-hoisted deps --- .../__snapshots__/angular.spec.ts.snap | 2 -- .../__snapshots__/base.spec.ts.snap | 2 -- .../__snapshots__/javascript.spec.ts.snap | 2 -- .../__snapshots__/react.spec.ts.snap | 4 ---- .../__snapshots__/svelte.spec.ts.snap | 2 -- .../__snapshots__/typescript.spec.ts.snap | 2 -- .../configuration/__snapshots__/vue.spec.ts.snap | 2 -- packages/webpack5/scripts/jest.setup.ts | 16 ++++++++++++++++ packages/webpack5/src/configuration/base.ts | 5 +++-- 9 files changed, 19 insertions(+), 18 deletions(-) diff --git a/packages/webpack5/__tests__/configuration/__snapshots__/angular.spec.ts.snap b/packages/webpack5/__tests__/configuration/__snapshots__/angular.spec.ts.snap index 7f34508f44..357d0e4117 100644 --- a/packages/webpack5/__tests__/configuration/__snapshots__/angular.spec.ts.snap +++ b/packages/webpack5/__tests__/configuration/__snapshots__/angular.spec.ts.snap @@ -58,7 +58,6 @@ exports[`angular configuration for android 1`] = ` resolveLoader: { modules: [ '__jest__/node_modules/@nativescript/webpack/dist/loaders', - 'node_modules/@nativescript/webpack/dist/loaders', '__jest__/node_modules', 'node_modules' ] @@ -364,7 +363,6 @@ exports[`angular configuration for ios 1`] = ` resolveLoader: { modules: [ '__jest__/node_modules/@nativescript/webpack/dist/loaders', - 'node_modules/@nativescript/webpack/dist/loaders', '__jest__/node_modules', 'node_modules' ] diff --git a/packages/webpack5/__tests__/configuration/__snapshots__/base.spec.ts.snap b/packages/webpack5/__tests__/configuration/__snapshots__/base.spec.ts.snap index fcc8df51a4..8d21ad6eac 100644 --- a/packages/webpack5/__tests__/configuration/__snapshots__/base.spec.ts.snap +++ b/packages/webpack5/__tests__/configuration/__snapshots__/base.spec.ts.snap @@ -52,7 +52,6 @@ exports[`base configuration for android 1`] = ` resolveLoader: { modules: [ '__jest__/node_modules/@nativescript/webpack/dist/loaders', - 'node_modules/@nativescript/webpack/dist/loaders', '__jest__/node_modules', 'node_modules' ] @@ -344,7 +343,6 @@ exports[`base configuration for ios 1`] = ` resolveLoader: { modules: [ '__jest__/node_modules/@nativescript/webpack/dist/loaders', - 'node_modules/@nativescript/webpack/dist/loaders', '__jest__/node_modules', 'node_modules' ] diff --git a/packages/webpack5/__tests__/configuration/__snapshots__/javascript.spec.ts.snap b/packages/webpack5/__tests__/configuration/__snapshots__/javascript.spec.ts.snap index fdadf6ec5f..6244d106bd 100644 --- a/packages/webpack5/__tests__/configuration/__snapshots__/javascript.spec.ts.snap +++ b/packages/webpack5/__tests__/configuration/__snapshots__/javascript.spec.ts.snap @@ -52,7 +52,6 @@ exports[`javascript configuration for android 1`] = ` resolveLoader: { modules: [ '__jest__/node_modules/@nativescript/webpack/dist/loaders', - 'node_modules/@nativescript/webpack/dist/loaders', '__jest__/node_modules', 'node_modules' ] @@ -382,7 +381,6 @@ exports[`javascript configuration for ios 1`] = ` resolveLoader: { modules: [ '__jest__/node_modules/@nativescript/webpack/dist/loaders', - 'node_modules/@nativescript/webpack/dist/loaders', '__jest__/node_modules', 'node_modules' ] diff --git a/packages/webpack5/__tests__/configuration/__snapshots__/react.spec.ts.snap b/packages/webpack5/__tests__/configuration/__snapshots__/react.spec.ts.snap index b9ada48ae9..707ed31ba3 100644 --- a/packages/webpack5/__tests__/configuration/__snapshots__/react.spec.ts.snap +++ b/packages/webpack5/__tests__/configuration/__snapshots__/react.spec.ts.snap @@ -55,7 +55,6 @@ exports[`react configuration > android > adds ReactRefreshWebpackPlugin when HMR resolveLoader: { modules: [ '__jest__/node_modules/@nativescript/webpack/dist/loaders', - 'node_modules/@nativescript/webpack/dist/loaders', '__jest__/node_modules', 'node_modules' ] @@ -375,7 +374,6 @@ exports[`react configuration > android > base config 1`] = ` resolveLoader: { modules: [ '__jest__/node_modules/@nativescript/webpack/dist/loaders', - 'node_modules/@nativescript/webpack/dist/loaders', '__jest__/node_modules', 'node_modules' ] @@ -673,7 +671,6 @@ exports[`react configuration > ios > adds ReactRefreshWebpackPlugin when HMR ena resolveLoader: { modules: [ '__jest__/node_modules/@nativescript/webpack/dist/loaders', - 'node_modules/@nativescript/webpack/dist/loaders', '__jest__/node_modules', 'node_modules' ] @@ -994,7 +991,6 @@ exports[`react configuration > ios > base config 1`] = ` resolveLoader: { modules: [ '__jest__/node_modules/@nativescript/webpack/dist/loaders', - 'node_modules/@nativescript/webpack/dist/loaders', '__jest__/node_modules', 'node_modules' ] diff --git a/packages/webpack5/__tests__/configuration/__snapshots__/svelte.spec.ts.snap b/packages/webpack5/__tests__/configuration/__snapshots__/svelte.spec.ts.snap index b478e0bc26..2132735183 100644 --- a/packages/webpack5/__tests__/configuration/__snapshots__/svelte.spec.ts.snap +++ b/packages/webpack5/__tests__/configuration/__snapshots__/svelte.spec.ts.snap @@ -54,7 +54,6 @@ exports[`svelte configuration for android 1`] = ` resolveLoader: { modules: [ '__jest__/node_modules/@nativescript/webpack/dist/loaders', - 'node_modules/@nativescript/webpack/dist/loaders', '__jest__/node_modules', 'node_modules' ] @@ -371,7 +370,6 @@ exports[`svelte configuration for ios 1`] = ` resolveLoader: { modules: [ '__jest__/node_modules/@nativescript/webpack/dist/loaders', - 'node_modules/@nativescript/webpack/dist/loaders', '__jest__/node_modules', 'node_modules' ] diff --git a/packages/webpack5/__tests__/configuration/__snapshots__/typescript.spec.ts.snap b/packages/webpack5/__tests__/configuration/__snapshots__/typescript.spec.ts.snap index 74792e3a58..878ca85516 100644 --- a/packages/webpack5/__tests__/configuration/__snapshots__/typescript.spec.ts.snap +++ b/packages/webpack5/__tests__/configuration/__snapshots__/typescript.spec.ts.snap @@ -52,7 +52,6 @@ exports[`typescript configuration for android 1`] = ` resolveLoader: { modules: [ '__jest__/node_modules/@nativescript/webpack/dist/loaders', - 'node_modules/@nativescript/webpack/dist/loaders', '__jest__/node_modules', 'node_modules' ] @@ -382,7 +381,6 @@ exports[`typescript configuration for ios 1`] = ` resolveLoader: { modules: [ '__jest__/node_modules/@nativescript/webpack/dist/loaders', - 'node_modules/@nativescript/webpack/dist/loaders', '__jest__/node_modules', 'node_modules' ] diff --git a/packages/webpack5/__tests__/configuration/__snapshots__/vue.spec.ts.snap b/packages/webpack5/__tests__/configuration/__snapshots__/vue.spec.ts.snap index e7a5c85922..4e983c7291 100644 --- a/packages/webpack5/__tests__/configuration/__snapshots__/vue.spec.ts.snap +++ b/packages/webpack5/__tests__/configuration/__snapshots__/vue.spec.ts.snap @@ -55,7 +55,6 @@ exports[`vue configuration for android 1`] = ` resolveLoader: { modules: [ '__jest__/node_modules/@nativescript/webpack/dist/loaders', - 'node_modules/@nativescript/webpack/dist/loaders', '__jest__/node_modules', 'node_modules' ] @@ -379,7 +378,6 @@ exports[`vue configuration for ios 1`] = ` resolveLoader: { modules: [ '__jest__/node_modules/@nativescript/webpack/dist/loaders', - 'node_modules/@nativescript/webpack/dist/loaders', '__jest__/node_modules', 'node_modules' ] diff --git a/packages/webpack5/scripts/jest.setup.ts b/packages/webpack5/scripts/jest.setup.ts index a6bf18bd01..65a90cfae9 100644 --- a/packages/webpack5/scripts/jest.setup.ts +++ b/packages/webpack5/scripts/jest.setup.ts @@ -66,6 +66,22 @@ jest.mock('path', () => { return resolved.substr(li); } + // handle resolutions with __dirname + // used in base config's resolveLoader + const root = path.resolve(__dirname, '..'); + if (resolved.startsWith(root)) { + const newPath = resolved.replace(root, '__jest__'); + + if (newPath.startsWith('__jest__/src')) { + return newPath.replace( + '__jest__/src', + '__jest__/node_modules/@nativescript/webpack/dist' + ); + } + + return newPath; + } + return resolved; }, }; diff --git a/packages/webpack5/src/configuration/base.ts b/packages/webpack5/src/configuration/base.ts index 1753e41066..1fa20f1db2 100644 --- a/packages/webpack5/src/configuration/base.ts +++ b/packages/webpack5/src/configuration/base.ts @@ -113,11 +113,12 @@ export default function (config: Config, env: IWebpackEnv = _env): Config { // look for loaders in // - node_modules/@nativescript/webpack/dist/loaders + // - node_modules/@nativescript/webpack/node_modules // - node_modules // allows for cleaner rules, without having to specify full paths to loaders config.resolveLoader.modules - .add(getProjectFilePath('node_modules/@nativescript/webpack/dist/loaders')) - .add('node_modules/@nativescript/webpack/dist/loaders') + .add(resolve(__dirname, '../loaders')) + .add(resolve(__dirname, '../../node_modules')) .add(getProjectFilePath('node_modules')) .add('node_modules'); From 6e0f4625485fb3e3c0921a56c1cc0f057b51aa23 Mon Sep 17 00:00:00 2001 From: halfnelson Date: Mon, 5 Apr 2021 12:24:15 +1000 Subject: [PATCH 6/8] update svelte config to use svelte-loader --- packages/webpack5/src/configuration/svelte.ts | 36 +++++++++---------- 1 file changed, 18 insertions(+), 18 deletions(-) diff --git a/packages/webpack5/src/configuration/svelte.ts b/packages/webpack5/src/configuration/svelte.ts index 1f1dbba2ad..30ec9d42de 100644 --- a/packages/webpack5/src/configuration/svelte.ts +++ b/packages/webpack5/src/configuration/svelte.ts @@ -1,6 +1,6 @@ import Config from 'webpack-chain'; -import { getProjectFilePath, getProjectRootPath } from '../helpers/project'; +import { getProjectFilePath } from '../helpers/project'; import { getPlatformName } from '../helpers/platform'; import { env as _env, IWebpackEnv } from '../index'; import { error } from '../helpers/log'; @@ -13,47 +13,47 @@ export default function (config: Config, env: IWebpackEnv = _env): Config { const mode = env.production ? 'production' : 'development'; const production = mode === 'production'; + // target('node') is the default but causes svelte-loader to detect it as a "server" render, disabling HMR + // electron-main sneaks us past the target == 'node' check and gets us HMR + config.target('electron-main'); + + // svelte-hmr still references tns-core-modules, so we shim it here for compat. + config.resolve.alias.set('tns-core-modules', '@nativescript/core'); + // resolve .svelte files // the order is reversed because we are using prepend! config.resolve.extensions.prepend('.svelte').prepend(`.${platform}.svelte`); + // add a rule for .svelte files config.module .rule('svelte') .test(/\.svelte$/) .exclude.add(/node_modules/) .end() - .use('svelte-loader-hot') - .loader('svelte-loader-hot') + .use('svelte-loader') + .loader('svelte-loader') .tap((options) => { + const svelteConfig = getSvelteConfig(); return { ...options, - dev: !production, - preprocess: getSvelteConfigPreprocessor(), + compilerOptions: { + ...svelteConfig.compilerOptions, + dev: !production, + }, + preprocess: svelteConfig?.preprocess, hotReload: !production, hotOptions: { injectCss: false, native: true, }, - // Suppress A11y warnings - onwarn(warning, warn) { - if (!/A11y:/.test(warning.message)) { - warn(warning); - } - }, }; }); - return config; } -function getSvelteConfigPreprocessor(): any { - const config = getSvelteConfig(); - - return config?.preprocess; -} - interface ISvelteConfig { preprocess: any; + compilerOptions: any; } function getSvelteConfig(): ISvelteConfig | undefined { From 88a7ced382448b9998af3f5265c5a563f80ec6a7 Mon Sep 17 00:00:00 2001 From: halfnelson Date: Mon, 5 Apr 2021 12:36:59 +1000 Subject: [PATCH 7/8] handle null config --- packages/webpack5/src/configuration/svelte.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/webpack5/src/configuration/svelte.ts b/packages/webpack5/src/configuration/svelte.ts index 30ec9d42de..67146c2057 100644 --- a/packages/webpack5/src/configuration/svelte.ts +++ b/packages/webpack5/src/configuration/svelte.ts @@ -37,7 +37,7 @@ export default function (config: Config, env: IWebpackEnv = _env): Config { return { ...options, compilerOptions: { - ...svelteConfig.compilerOptions, + ...svelteConfig?.compilerOptions, dev: !production, }, preprocess: svelteConfig?.preprocess, From 2783b309f5dbf7bc8717ad95fbbe89d607ce4017 Mon Sep 17 00:00:00 2001 From: Igor Randjelovic Date: Mon, 5 Apr 2021 10:22:46 +0200 Subject: [PATCH 8/8] fix: worker support in .svelte files & update snapshots --- .../__snapshots__/svelte.spec.ts.snap | 36 ++++++++++--------- packages/webpack5/src/configuration/svelte.ts | 4 +++ 2 files changed, 24 insertions(+), 16 deletions(-) diff --git a/packages/webpack5/__tests__/configuration/__snapshots__/svelte.spec.ts.snap b/packages/webpack5/__tests__/configuration/__snapshots__/svelte.spec.ts.snap index 2132735183..f373575aed 100644 --- a/packages/webpack5/__tests__/configuration/__snapshots__/svelte.spec.ts.snap +++ b/packages/webpack5/__tests__/configuration/__snapshots__/svelte.spec.ts.snap @@ -8,7 +8,7 @@ exports[`svelte configuration for android 1`] = ` '~/package.json' ], devtool: 'inline-source-map', - target: 'node', + target: 'electron-main', watchOptions: { ignored: [ '__jest__/platforms/**', @@ -30,7 +30,8 @@ exports[`svelte configuration for android 1`] = ` symlinks: true, alias: { '~': '__jest__/src', - '@': '__jest__/src' + '@': '__jest__/src', + 'tns-core-modules': '@nativescript/core' }, extensions: [ '.android.svelte', @@ -122,7 +123,7 @@ exports[`svelte configuration for android 1`] = ` }, /* config.module.rule('workers') */ { - test: /\\\\.(js|ts)$/, + test: /\\\\.(js|ts|svelte)$/, exclude: [ /node_modules/ ], @@ -194,18 +195,19 @@ exports[`svelte configuration for android 1`] = ` /node_modules/ ], use: [ - /* config.module.rule('svelte').use('svelte-loader-hot') */ + /* config.module.rule('svelte').use('svelte-loader') */ { - loader: 'svelte-loader-hot', + loader: 'svelte-loader', options: { - dev: true, + compilerOptions: { + dev: true + }, preprocess: undefined, hotReload: true, hotOptions: { injectCss: false, 'native': true - }, - onwarn: function () { /* omitted long function */ } + } } } ] @@ -324,7 +326,7 @@ exports[`svelte configuration for ios 1`] = ` '~/package.json' ], devtool: 'inline-source-map', - target: 'node', + target: 'electron-main', watchOptions: { ignored: [ '__jest__/platforms/**', @@ -346,7 +348,8 @@ exports[`svelte configuration for ios 1`] = ` symlinks: true, alias: { '~': '__jest__/src', - '@': '__jest__/src' + '@': '__jest__/src', + 'tns-core-modules': '@nativescript/core' }, extensions: [ '.ios.svelte', @@ -438,7 +441,7 @@ exports[`svelte configuration for ios 1`] = ` }, /* config.module.rule('workers') */ { - test: /\\\\.(js|ts)$/, + test: /\\\\.(js|ts|svelte)$/, exclude: [ /node_modules/ ], @@ -510,18 +513,19 @@ exports[`svelte configuration for ios 1`] = ` /node_modules/ ], use: [ - /* config.module.rule('svelte').use('svelte-loader-hot') */ + /* config.module.rule('svelte').use('svelte-loader') */ { - loader: 'svelte-loader-hot', + loader: 'svelte-loader', options: { - dev: true, + compilerOptions: { + dev: true + }, preprocess: undefined, hotReload: true, hotOptions: { injectCss: false, 'native': true - }, - onwarn: function () { /* omitted long function */ } + } } } ] diff --git a/packages/webpack5/src/configuration/svelte.ts b/packages/webpack5/src/configuration/svelte.ts index 67146c2057..b942571a46 100644 --- a/packages/webpack5/src/configuration/svelte.ts +++ b/packages/webpack5/src/configuration/svelte.ts @@ -24,6 +24,9 @@ export default function (config: Config, env: IWebpackEnv = _env): Config { // the order is reversed because we are using prepend! config.resolve.extensions.prepend('.svelte').prepend(`.${platform}.svelte`); + // add worker support to .svelte files (new Worker('./path')) + config.module.rule('workers').test(/\.(js|ts|svelte)$/); + // add a rule for .svelte files config.module .rule('svelte') @@ -48,6 +51,7 @@ export default function (config: Config, env: IWebpackEnv = _env): Config { }, }; }); + return config; }