Skip to content

Commit e86006f

Browse files
authored
merge: webpack updates (#9870)
* refactor(webpack): use global require for checking hmr chunks * wip: watchstate plugin adjustments * feat(webpack): emit hrm boot status * chore: bump deps * fix(hmr): emit boot log at boot instead of the 1st livesync * chore(release): @nativescript/webpack 5.0.8-alpha.0 * refactor(webpack): use real modules and deprecate virtual modules * feat(webpack): allow disabling nativescriptLibPath warning with a boolean * fix(webpack): remove copy rules that don't match any files to avoid false watch triggers * feat(webpack): add --env.stats to disable printing stats primarily used internally by preview-cli * chore(release): @nativescript/webpack 5.0.8-alpha.2 * fix: revert copy rule glob filter * chore(release): @nativescript/webpack 5.0.8-alpha.3
2 parents 0c14371 + 5b6664d commit e86006f

File tree

15 files changed

+134
-129
lines changed

15 files changed

+134
-129
lines changed

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

Lines changed: 2 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -302,16 +302,6 @@ exports[`javascript configuration for android 1`] = `
302302
),
303303
/* config.plugin('WatchStatePlugin') */
304304
new WatchStatePlugin(),
305-
/* config.plugin('ContextExclusionPlugin|__@nativescript_webpack_virtual_entry_javascript__') */
306-
new ContextExclusionPlugin(
307-
/__@nativescript_webpack_virtual_entry_javascript__.js$/
308-
),
309-
/* config.plugin('VirtualModulesPlugin') */
310-
new VirtualModulesPlugin(
311-
{
312-
'__jest__/src/__@nativescript_webpack_virtual_entry_javascript__': '// VIRTUAL ENTRY START\\\\nrequire(\\\\'@nativescript/core/bundle-entry-points\\\\')\\\\nconst context = require.context(\\"~/\\", /* deep: */ true, /* filter: */ /.(xml|js|s?css)$/);\\\\nglobal.registerWebpackModules(context);\\\\n// VIRTUAL ENTRY END'
313-
}
314-
),
315305
/* config.plugin('ContextExclusionPlugin|exclude_files') */
316306
new ContextExclusionPlugin(
317307
/\\\\b_.+\\\\./
@@ -320,7 +310,7 @@ exports[`javascript configuration for android 1`] = `
320310
entry: {
321311
bundle: [
322312
'@nativescript/core/globals/index',
323-
'__jest__/src/__@nativescript_webpack_virtual_entry_javascript__',
313+
'__jest__/node_modules/@nativescript/webpack/dist/stubs/virtual-entry-javascript',
324314
'@nativescript/core/bundle-entry-points',
325315
'__jest__/src/app.js',
326316
'@nativescript/core/ui/frame',
@@ -632,16 +622,6 @@ exports[`javascript configuration for ios 1`] = `
632622
),
633623
/* config.plugin('WatchStatePlugin') */
634624
new WatchStatePlugin(),
635-
/* config.plugin('ContextExclusionPlugin|__@nativescript_webpack_virtual_entry_javascript__') */
636-
new ContextExclusionPlugin(
637-
/__@nativescript_webpack_virtual_entry_javascript__.js$/
638-
),
639-
/* config.plugin('VirtualModulesPlugin') */
640-
new VirtualModulesPlugin(
641-
{
642-
'__jest__/src/__@nativescript_webpack_virtual_entry_javascript__': '// VIRTUAL ENTRY START\\\\nrequire(\\\\'@nativescript/core/bundle-entry-points\\\\')\\\\nconst context = require.context(\\"~/\\", /* deep: */ true, /* filter: */ /.(xml|js|s?css)$/);\\\\nglobal.registerWebpackModules(context);\\\\n// VIRTUAL ENTRY END'
643-
}
644-
),
645625
/* config.plugin('ContextExclusionPlugin|exclude_files') */
646626
new ContextExclusionPlugin(
647627
/\\\\b_.+\\\\./
@@ -650,7 +630,7 @@ exports[`javascript configuration for ios 1`] = `
650630
entry: {
651631
bundle: [
652632
'@nativescript/core/globals/index',
653-
'__jest__/src/__@nativescript_webpack_virtual_entry_javascript__',
633+
'__jest__/node_modules/@nativescript/webpack/dist/stubs/virtual-entry-javascript',
654634
'@nativescript/core/bundle-entry-points',
655635
'__jest__/src/app.js'
656636
],

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

Lines changed: 2 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -302,16 +302,6 @@ exports[`typescript configuration for android 1`] = `
302302
),
303303
/* config.plugin('WatchStatePlugin') */
304304
new WatchStatePlugin(),
305-
/* config.plugin('ContextExclusionPlugin|__@nativescript_webpack_virtual_entry_typescript__') */
306-
new ContextExclusionPlugin(
307-
/__@nativescript_webpack_virtual_entry_typescript__.js$/
308-
),
309-
/* config.plugin('VirtualModulesPlugin') */
310-
new VirtualModulesPlugin(
311-
{
312-
'__jest__/src/__@nativescript_webpack_virtual_entry_typescript__': '// VIRTUAL ENTRY START\\\\nrequire(\\\\'@nativescript/core/bundle-entry-points\\\\')\\\\nconst context = require.context(\\"~/\\", /* deep: */ true, /* filter: */ /\\\\\\\\.(xml|js|(?<!\\\\\\\\.d\\\\\\\\.)ts|s?css)$/);\\\\nglobal.registerWebpackModules(context);\\\\n// VIRTUAL ENTRY END'
313-
}
314-
),
315305
/* config.plugin('ContextExclusionPlugin|exclude_files') */
316306
new ContextExclusionPlugin(
317307
/\\\\b_.+\\\\./
@@ -320,7 +310,7 @@ exports[`typescript configuration for android 1`] = `
320310
entry: {
321311
bundle: [
322312
'@nativescript/core/globals/index',
323-
'__jest__/src/__@nativescript_webpack_virtual_entry_typescript__',
313+
'__jest__/node_modules/@nativescript/webpack/dist/stubs/virtual-entry-typescript.js',
324314
'@nativescript/core/bundle-entry-points',
325315
'__jest__/src/app.js',
326316
'@nativescript/core/ui/frame',
@@ -632,16 +622,6 @@ exports[`typescript configuration for ios 1`] = `
632622
),
633623
/* config.plugin('WatchStatePlugin') */
634624
new WatchStatePlugin(),
635-
/* config.plugin('ContextExclusionPlugin|__@nativescript_webpack_virtual_entry_typescript__') */
636-
new ContextExclusionPlugin(
637-
/__@nativescript_webpack_virtual_entry_typescript__.js$/
638-
),
639-
/* config.plugin('VirtualModulesPlugin') */
640-
new VirtualModulesPlugin(
641-
{
642-
'__jest__/src/__@nativescript_webpack_virtual_entry_typescript__': '// VIRTUAL ENTRY START\\\\nrequire(\\\\'@nativescript/core/bundle-entry-points\\\\')\\\\nconst context = require.context(\\"~/\\", /* deep: */ true, /* filter: */ /\\\\\\\\.(xml|js|(?<!\\\\\\\\.d\\\\\\\\.)ts|s?css)$/);\\\\nglobal.registerWebpackModules(context);\\\\n// VIRTUAL ENTRY END'
643-
}
644-
),
645625
/* config.plugin('ContextExclusionPlugin|exclude_files') */
646626
new ContextExclusionPlugin(
647627
/\\\\b_.+\\\\./
@@ -650,7 +630,7 @@ exports[`typescript configuration for ios 1`] = `
650630
entry: {
651631
bundle: [
652632
'@nativescript/core/globals/index',
653-
'__jest__/src/__@nativescript_webpack_virtual_entry_typescript__',
633+
'__jest__/node_modules/@nativescript/webpack/dist/stubs/virtual-entry-typescript.js',
654634
'@nativescript/core/bundle-entry-points',
655635
'__jest__/src/app.js'
656636
],

packages/webpack5/__tests__/configuration/typescript.spec.ts

Lines changed: 18 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,6 @@
11
import Config from 'webpack-chain';
2+
import path from 'path';
3+
import fs from 'fs';
24

35
import typescript from '../../src/configuration/typescript';
46
import { init } from '../../src';
@@ -15,29 +17,30 @@ describe('typescript configuration', () => {
1517
});
1618
}
1719

18-
it('filter typescript declaration files', () => {
20+
it('filters typescript declaration files', () => {
1921
init({
2022
ios: true,
2123
});
2224

23-
const tsConfig = typescript(new Config());
25+
// const tsConfig = typescript(new Config());
2426
let regex: RegExp;
2527

26-
// Get the filterRE from the typescript configuration
27-
tsConfig.plugin('VirtualModulesPlugin').tap((args) => {
28-
const options = args[0];
29-
const virtualConfig: string = options[Object.keys(options)[0]];
30-
const filterLine = virtualConfig
31-
.split('\n')
32-
.find((v) => v.includes('filter'));
33-
const matches = filterLine.match(/\/(?<filter>\S+)\//);
28+
const virtualEntryPath = path.join(
29+
__dirname,
30+
'../../src/stubs/virtual-entry-typescript.js'
31+
);
32+
const virtualEntry = fs.readFileSync(virtualEntryPath);
3433

35-
if (matches) {
36-
regex = new RegExp(matches.groups.filter);
37-
}
34+
const filterLine = virtualEntry
35+
.toString()
36+
.split('\n')
37+
.find((v) => v.includes('filter'));
3838

39-
return args;
40-
});
39+
const matches = filterLine.match(/\/(?<filter>\S+)\//);
40+
41+
if (matches) {
42+
regex = new RegExp(matches.groups.filter);
43+
}
4144

4245
expect(regex).toBeDefined();
4346

packages/webpack5/package.json

Lines changed: 12 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "@nativescript/webpack",
3-
"version": "5.0.7",
3+
"version": "5.0.8-alpha.3",
44
"private": false,
55
"main": "dist/index.js",
66
"files": [
@@ -29,17 +29,17 @@
2929
"css": "^3.0.0",
3030
"css-loader": "^6.0.0",
3131
"dotenv-webpack": "^7.0.0",
32-
"fork-ts-checker-webpack-plugin": "^6.0.0",
33-
"loader-utils": "^2.0.0",
32+
"fork-ts-checker-webpack-plugin": "^7.0.0",
33+
"loader-utils": "^2.0.0 || ^3.0.0",
3434
"lodash.get": "^4.0.0",
3535
"micromatch": "^4.0.0",
3636
"postcss": "^8.0.0",
3737
"postcss-import": "^14.0.0",
38-
"postcss-loader": "^6.0.0",
38+
"postcss-loader": "^7.0.0",
3939
"raw-loader": "^4.0.0",
4040
"react-refresh": "~0.11.0",
4141
"sass": "^1.0.0",
42-
"sass-loader": "^12.0.0",
42+
"sass-loader": "^13.0.0",
4343
"sax": "^1.0.0",
4444
"source-map": "^0.7.0",
4545
"terser-webpack-plugin": "^5.0.0",
@@ -56,17 +56,17 @@
5656
"devDependencies": {
5757
"@angular-devkit/build-angular": "^13.1.2",
5858
"@types/css": "0.0.33",
59-
"@types/jest": "27.0.1",
59+
"@types/jest": "27.5.1",
6060
"@types/loader-utils": "2.0.3",
61-
"@types/lodash.get": "4.4.6",
61+
"@types/lodash.get": "4.4.7",
6262
"@types/micromatch": "4.0.2",
63-
"@types/sax": "1.2.3",
63+
"@types/sax": "1.2.4",
6464
"@types/terser-webpack-plugin": "5.2.0",
6565
"@types/webpack-virtual-modules": "0.1.1",
66-
"jest": "27.1.1",
67-
"jest-matcher-utils": "27.1.1",
68-
"nativescript-vue-template-compiler": "2.9.0",
69-
"ts-jest": "27.0.5",
66+
"jest": "28.1.0",
67+
"jest-matcher-utils": "28.1.0",
68+
"nativescript-vue-template-compiler": "2.9.2",
69+
"ts-jest": "28.0.3",
7070
"typescript": "4.7.3"
7171
},
7272
"peerDependencies": {

packages/webpack5/src/bin/index.ts

Lines changed: 11 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -56,6 +56,7 @@ program
5656
env['env'] = options.env;
5757
}
5858

59+
env['stats'] ??= true;
5960
env['watch'] ??= options.watch;
6061

6162
// if --env.config is passed, we'll set an environment
@@ -108,13 +109,15 @@ program
108109
// Set the process exit code depending on errors
109110
process.exitCode = stats.hasErrors() ? 1 : 0;
110111

111-
console.log(
112-
stats.toString({
113-
chunks: false,
114-
colors: true,
115-
errorDetails: env.verbose,
116-
})
117-
);
112+
if (env.stats) {
113+
console.log(
114+
stats.toString({
115+
chunks: false,
116+
colors: true,
117+
errorDetails: env.verbose,
118+
})
119+
);
120+
}
118121

119122
// if webpack profile is enabled we write the stats to a JSON file
120123
if (configuration.profile || env.profile) {
@@ -141,7 +144,7 @@ program
141144
};
142145

143146
if (options.watch) {
144-
console.log('webpack is watching the files...');
147+
env.stats && console.log('webpack is watching the files...');
145148
compiler.watch(
146149
configuration.watchOptions ?? {},
147150
webpackCompilationCallback

packages/webpack5/src/configuration/javascript.ts

Lines changed: 4 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -1,26 +1,18 @@
11
import Config from 'webpack-chain';
22

33
import { getEntryPath, getEntryDirPath } from '../helpers/platform';
4-
import { addVirtualEntry } from '../helpers/virtualModules';
54
import { chainedSetAddAfter } from '../helpers/chain';
65
import { env as _env, IWebpackEnv } from '../index';
76
import { ContextExclusionPlugin } from 'webpack';
87
import base from './base';
8+
import path from 'path';
99

1010
export default function (config: Config, env: IWebpackEnv = _env): Config {
1111
base(config, env);
1212
const entryPath = getEntryPath();
13-
const filterRE = '/.(xml|js|s?css)$/';
14-
const virtualEntryPath = addVirtualEntry(
15-
config,
16-
'javascript',
17-
`
18-
// VIRTUAL ENTRY START
19-
require('@nativescript/core/bundle-entry-points')
20-
const context = require.context("~/", /* deep: */ true, /* filter: */ ${filterRE});
21-
global.registerWebpackModules(context);
22-
// VIRTUAL ENTRY END
23-
`
13+
const virtualEntryPath = path.resolve(
14+
__dirname,
15+
'../stubs/virtual-entry-javascript'
2416
);
2517

2618
// exclude files starting with _ from require.context

packages/webpack5/src/configuration/typescript.ts

Lines changed: 4 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -1,26 +1,18 @@
11
import Config from 'webpack-chain';
22

33
import { getEntryDirPath, getEntryPath } from '../helpers/platform';
4-
import { addVirtualEntry } from '../helpers/virtualModules';
54
import { chainedSetAddAfter } from '../helpers/chain';
65
import { env as _env, IWebpackEnv } from '../index';
76
import { ContextExclusionPlugin } from 'webpack';
87
import base from './base';
8+
import path from 'path';
99

1010
export default function (config: Config, env: IWebpackEnv = _env): Config {
1111
base(config, env);
1212
const entryPath = getEntryPath();
13-
const filterRE = '/\\.(xml|js|(?<!\\.d\\.)ts|s?css)$/';
14-
const virtualEntryPath = addVirtualEntry(
15-
config,
16-
'typescript',
17-
`
18-
// VIRTUAL ENTRY START
19-
require('@nativescript/core/bundle-entry-points')
20-
const context = require.context("~/", /* deep: */ true, /* filter: */ ${filterRE});
21-
global.registerWebpackModules(context);
22-
// VIRTUAL ENTRY END
23-
`
13+
const virtualEntryPath = path.resolve(
14+
__dirname,
15+
'../stubs/virtual-entry-typescript.js'
2416
);
2517

2618
// exclude files starting with _ from require.context

packages/webpack5/src/helpers/config.ts

Lines changed: 13 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -3,16 +3,22 @@ import { env } from '../index';
33

44
function getCLILib() {
55
if (!env.nativescriptLibPath) {
6-
warnOnce(
7-
'getCLILib',
8-
`
9-
Cannot find NativeScript CLI path. Make sure --env.nativescriptLibPath is passed
10-
`
11-
);
6+
if (typeof env.nativescriptLibPath !== 'boolean') {
7+
warnOnce(
8+
'getCLILib',
9+
`
10+
Cannot find NativeScript CLI path. Make sure --env.nativescriptLibPath is passed
11+
`
12+
);
13+
}
14+
return false;
15+
}
16+
17+
if (typeof env.nativescriptLibPath === 'boolean') {
1218
return false;
1319
}
1420

15-
return require(env.nativescriptLibPath);
21+
return require(env.nativescriptLibPath as string);
1622
}
1723

1824
/**

packages/webpack5/src/helpers/copyRules.ts

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
import CopyWebpackPlugin from 'copy-webpack-plugin';
22
import { basename, relative, resolve } from 'path';
33
import Config from 'webpack-chain';
4+
import { sync as globbySync } from 'globby';
45

56
import { getProjectRootPath } from './project';
67
import { getEntryDirPath } from './platform';
@@ -70,6 +71,17 @@ export function applyCopyRules(config: Config) {
7071
config.plugin('CopyWebpackPlugin').use(CopyWebpackPlugin, [
7172
{
7273
patterns: Array.from(copyRules)
74+
// reverted: removes valid rules occasionally (ie fonts)
75+
// todo: re-visit in future...
76+
// .filter((glob) => {
77+
// if (process.env.NODE_ENV === 'test') {
78+
// return true;
79+
// }
80+
// // remove rules that do not match any paths
81+
// // prevents webpack watch mode from firing
82+
// // due to "removed" paths.
83+
// return globbySync(glob).length > 0;
84+
// })
7385
.map((glob) => ({
7486
from: glob,
7587
context: entryDir,

packages/webpack5/src/helpers/virtualModules.ts

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,9 @@ import { getEntryDirPath } from './platform';
88
import dedent from 'ts-dedent';
99
import { getProjectFilePath } from './project';
1010

11+
/**
12+
* @deprecated Virtual entries are not recommended by the webpack team, use real files instead. For example, resolve a path in node_modules if necessary.
13+
*/
1114
export function addVirtualEntry(
1215
config: Config,
1316
name: string,
@@ -20,6 +23,9 @@ export function addVirtualEntry(
2023
);
2124
}
2225

26+
/**
27+
* @deprecated Virtual modules are not recommended by the webpack team, use real files instead. For example, resolve a path in node_modules if necessary.
28+
*/
2329
export function addVirtualModule(
2430
config: Config,
2531
name: string,

0 commit comments

Comments
 (0)