Skip to content

fix: 1.7.3 to 1.7.4 regression __nccwpck_require__ is not defined #195

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
styfle merged 8 commits into from
Jul 3, 2025
Merged

fix: 1.7.3 to 1.7.4 regression __nccwpck_require__ is not defined #195

Show file tree
Hide file tree
Changes from 6 commits
Commits
Show all changes
8 commits
Select commit Hold shift + click to select a range
622b0d2
[FIX]: 1.7.3 to 1.7.4 regression
alfredomariamilano Oct 8, 2024
218bb08
changed build script
alfredomariamilano Oct 9, 2024
d93e768
fix: webpack output alternates between 16 and 17 lines across runs
yjoer Jul 1, 2025
b18a046
test: update 23 coverage outputs with module id mismatches
yjoer Jul 2, 2025
8c83e25
test: update 8 coverage outputs with varying order
yjoer Jul 2, 2025
0b4cf7b
fix: retrieve the directory instead of the full path to the current m…
yjoer Jul 2, 2025
0fe6976
fix: turn isolation off to avoid unnecessary iife
yjoer Jul 3, 2025
8a04208
Merge branch 'main' into patch-3
styfle Jul 3, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions .gitignore
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,3 +2,4 @@ node_modules
dist
coverage
test/**/dist
test/unit/**/actual.js
4 changes: 2 additions & 2 deletions package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,9 +6,9 @@
"license": "MIT",
"main": "./dist/index.js",
"scripts": {
"build": "ncc build src/asset-relocator.js -e resolve",
"build": "node ./scripts/build.js",
"codecov": "codecov",
"test": "npm run build && jest",
"test": "yarn run build && jest",
"test-pnp": "yarn pack -f test/yarn-pnp/assets-plugin-tarball.tgz && cd test/yarn-pnp && echo '' > yarn.lock && YARN_ENABLE_IMMUTABLE_INSTALLS=false yarn install && yarn run build && yarn run test",
"test-coverage": "jest --coverage --globals \"{\\\"coverage\\\":true}\" && codecov"
},
Expand Down
28 changes: 28 additions & 0 deletions scripts/build.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,28 @@
const fs = require('fs')
const path = require('path')
const ncc = require('@vercel/ncc')

const build = () => {
const entry = path.resolve(__dirname, '../src/asset-relocator.js')

ncc(entry, {
externals: ["resolve"],
minify: true
}).then(({ code }) => {
const distFile = path.resolve(__dirname, '../dist/index.js')

// replace all __nccwpck_require__ with __webpack_require__ caused by ncc
const newCode = code.replace(
/__nccwpck_require__/g,
'__webpack_require__'
)

fs.writeFileSync(distFile, newCode)
}).catch(err => {
console.error(err)

process.exit(1)
})
}

build()
40 changes: 31 additions & 9 deletions src/asset-relocator.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -327,23 +327,45 @@ function generateWildcardRequire(dir, wildcardPath, wildcardParam, wildcardBlock
return `__ncc_wildcard$${wildcardBlockIndex}(${wildcardParam})`;
}

const hooked = new WeakSet();
function injectPathHook (compilation, outputAssetBase) {
const esm = compilation.outputOptions.module;
const { mainTemplate } = compilation;
if (!hooked.has(mainTemplate)) {
hooked.add(mainTemplate);
const { RuntimeModule, RuntimeGlobals } = compilation.compiler.webpack

mainTemplate.hooks.requireExtensions.tap("asset-relocator-loader", (source, chunk) => {
class AssetRelocatorLoaderRuntimeModule extends RuntimeModule {
constructor({ relBase }) {
super('asset-relocator-loader');

this.relBase = relBase
}

generate() {
const requireBase = `${esm ? "new URL('.', import.meta.url).pathname.slice(import.meta.url.match(/^file:\\/\\/\\/\\w:/) ? 1 : 0, -1)" : '__dirname'} + ${JSON.stringify(this.relBase + '/' + assetBase(outputAssetBase))}`;

return `if (typeof __webpack_require__ !== 'undefined') __webpack_require__.ab = ${requireBase};`
}
}

compilation.hooks.runtimeRequirementInTree
.for(RuntimeGlobals.require)
.tap('asset-relocator-loader', (chunk) => {
let relBase = '';

if (chunk.name) {
relBase = path.relative(path.dirname(chunk.name), '.').replace(/\\/g, '/');
if (relBase.length)

if (relBase.length) {
relBase = '/' + relBase;
}
}
return `${source}\nif (typeof __webpack_require__ !== 'undefined') __webpack_require__.ab = ${esm ? "new URL('.', import.meta.url).pathname.slice(import.meta.url.match(/^file:\\/\\/\\/\\w:/) ? 1 : 0, -1)" : '__dirname'} + ${JSON.stringify(relBase + '/' + assetBase(outputAssetBase))};`;
});
}

try {
compilation.addRuntimeModule(chunk, new AssetRelocatorLoaderRuntimeModule({ relBase }));
} catch (error) {
console.error(error);
}

return true;
});
}

module.exports = async function (content, map) {
Expand Down
2 changes: 1 addition & 1 deletion test/project-chunking/expected.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@

const fs = require('fs');

expect(output.length).toBe(16);
expect([16, 17]).toContain(output.length);
Copy link
Member

@styfle styfle Jul 3, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Can you explain why this is no longer 16?

Copy link
Contributor Author

@yjoer yjoer Jul 3, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The explanation is in the second half of the description in #194. In short, running the build within the test many times, webpack sometimes outputs lines with "assets by status" on top of "assets by path". Allowing an extra line would avoid unexpected test failures.

Copy link
Member

@styfle styfle Jul 3, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Why “sometimes”? I would expect the output to be deterministic.

Copy link
Contributor Author

@yjoer yjoer Jul 3, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I don't know what exactly caused this. The build config isn't changed. The output files and bytes appeared to be similar, but I got different outputs by running the test 13 times for this attempt.

2025-07-03_19-49-09.mp4

Copy link
Member

@styfle styfle Jul 3, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Ok we can keep this for now and see if upgrading webpack fixes it in a future PR


// check relative asset references worked out
expect(fs.readFileSync(__dirname + "/dist/modules/main.js").toString()).toContain(`ab+"asset`);
Expand Down
5 changes: 0 additions & 5 deletions test/unit/amd-disable/output-coverage.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,9 +1,4 @@
/******/ (() => { // webpackBootstrap
/******/ /* webpack/runtime/compat */
/******/
/******/ if (typeof __webpack_require__ !== 'undefined') __webpack_require__.ab = __dirname + "/";
/******/
/************************************************************************/
var __webpack_exports__ = {};
if (typeof define === 'function' && define.amd)
define(function (require) {
Expand Down
5 changes: 0 additions & 5 deletions test/unit/amd-disable/output.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,9 +1,4 @@
/******/ (() => { // webpackBootstrap
/******/ /* webpack/runtime/compat */
/******/
/******/ if (typeof __nccwpck_require__ !== 'undefined') __nccwpck_require__.ab = __dirname + "/";
/******/
/************************************************************************/
var __webpack_exports__ = {};
if (typeof define === 'function' && define.amd)
define(function (require) {
Expand Down
7 changes: 4 additions & 3 deletions test/unit/array-emission/output-coverage.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -36,9 +36,10 @@ module.exports = require("fs");
/******/ }
/******/
/************************************************************************/
/******/ /* webpack/runtime/compat */
/******/
/******/ if (typeof __webpack_require__ !== 'undefined') __webpack_require__.ab = __dirname + "/";
/******/ /* webpack/runtime/asset-relocator-loader */
/******/ (() => {
/******/ if (typeof __webpack_require__ !== 'undefined') __webpack_require__.ab = __dirname + "/";
/******/ })();
Copy link
Member

@styfle styfle Jul 3, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Is the IIFE required? Perhaps we can make this diff much smaller if we kept the output similar so there is no IIFE wrapper.

Copy link
Contributor Author

@yjoer yjoer Jul 3, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I don't think the IIFE is necessary. The isolation is turned on by default with RuntimeModule, but we can override the method to turn it off. Another patch is incoming.

Copy link
Contributor Author

@yjoer yjoer Jul 3, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The changes are available in the latest commit 0fe6976

/******/
/************************************************************************/
var __webpack_exports__ = {};
Expand Down
11 changes: 6 additions & 5 deletions test/unit/array-emission/output.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -36,9 +36,10 @@ module.exports = require("fs");
/******/ }
/******/
/************************************************************************/
/******/ /* webpack/runtime/compat */
/******/
/******/ if (typeof __nccwpck_require__ !== 'undefined') __nccwpck_require__.ab = __dirname + "/";
/******/ /* webpack/runtime/asset-relocator-loader */
/******/ (() => {
/******/ if (typeof __webpack_require__ !== 'undefined') __webpack_require__.ab = __dirname + "/";
/******/ })();
/******/
/************************************************************************/
var __webpack_exports__ = {};
Expand All @@ -49,8 +50,8 @@ var __webpack_exports__ = {};
const fs = __webpack_require__(147);

const REPORT_JAVASCRIPT = [
fs.readFileSync(__nccwpck_require__.ab + "util.js", 'utf8'),
fs.readFileSync(__nccwpck_require__.ab + "dom.js", 'utf8'),
fs.readFileSync(__webpack_require__.ab + "util.js", 'utf8'),
fs.readFileSync(__webpack_require__.ab + "dom.js", 'utf8'),
].join(';\n');

})();
Expand Down
5 changes: 0 additions & 5 deletions test/unit/array-holes/output-coverage.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,9 +1,4 @@
/******/ (() => { // webpackBootstrap
/******/ /* webpack/runtime/compat */
/******/
/******/ if (typeof __webpack_require__ !== 'undefined') __webpack_require__.ab = __dirname + "/";
/******/
/************************************************************************/
var __webpack_exports__ = {};
var a = [1,,2];

Expand Down
5 changes: 0 additions & 5 deletions test/unit/array-holes/output.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,9 +1,4 @@
/******/ (() => { // webpackBootstrap
/******/ /* webpack/runtime/compat */
/******/
/******/ if (typeof __nccwpck_require__ !== 'undefined') __nccwpck_require__.ab = __dirname + "/";
/******/
/************************************************************************/
var __webpack_exports__ = {};
var a = [1,,2];

Expand Down
7 changes: 4 additions & 3 deletions test/unit/asset-conditional/output-coverage.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -36,9 +36,10 @@ module.exports = require("path");
/******/ }
/******/
/************************************************************************/
/******/ /* webpack/runtime/compat */
/******/
/******/ if (typeof __webpack_require__ !== 'undefined') __webpack_require__.ab = __dirname + "/";
/******/ /* webpack/runtime/asset-relocator-loader */
/******/ (() => {
/******/ if (typeof __webpack_require__ !== 'undefined') __webpack_require__.ab = __dirname + "/";
/******/ })();
/******/
/************************************************************************/
var __webpack_exports__ = {};
Expand Down
9 changes: 5 additions & 4 deletions test/unit/asset-conditional/output.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -36,16 +36,17 @@ module.exports = require("path");
/******/ }
/******/
/************************************************************************/
/******/ /* webpack/runtime/compat */
/******/
/******/ if (typeof __nccwpck_require__ !== 'undefined') __nccwpck_require__.ab = __dirname + "/";
/******/ /* webpack/runtime/asset-relocator-loader */
/******/ (() => {
/******/ if (typeof __webpack_require__ !== 'undefined') __webpack_require__.ab = __dirname + "/";
/******/ })();
/******/
/************************************************************************/
var __webpack_exports__ = {};
// This entry need to be wrapped in an IIFE because it need to be isolated against other modules in the chunk.
(() => {
const path = __webpack_require__(17);
let moduleJsPath = isHarmony ? __nccwpck_require__.ab + "asset1.txt" : __nccwpck_require__.ab + "asset2.txt";
let moduleJsPath = isHarmony ? __webpack_require__.ab + "asset1.txt" : __webpack_require__.ab + "asset2.txt";
})();

module.exports = __webpack_exports__;
Expand Down
7 changes: 4 additions & 3 deletions test/unit/asset-fs-array-expr/output-coverage.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -44,9 +44,10 @@ module.exports = require("path");
/******/ }
/******/
/************************************************************************/
/******/ /* webpack/runtime/compat */
/******/
/******/ if (typeof __webpack_require__ !== 'undefined') __webpack_require__.ab = __dirname + "/";
/******/ /* webpack/runtime/asset-relocator-loader */
/******/ (() => {
/******/ if (typeof __webpack_require__ !== 'undefined') __webpack_require__.ab = __dirname + "/";
/******/ })();
/******/
/************************************************************************/
var __webpack_exports__ = {};
Expand Down
9 changes: 5 additions & 4 deletions test/unit/asset-fs-array-expr/output.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -44,9 +44,10 @@ module.exports = require("path");
/******/ }
/******/
/************************************************************************/
/******/ /* webpack/runtime/compat */
/******/
/******/ if (typeof __nccwpck_require__ !== 'undefined') __nccwpck_require__.ab = __dirname + "/";
/******/ /* webpack/runtime/asset-relocator-loader */
/******/ (() => {
/******/ if (typeof __webpack_require__ !== 'undefined') __webpack_require__.ab = __dirname + "/";
/******/ })();
/******/
/************************************************************************/
var __webpack_exports__ = {};
Expand All @@ -55,7 +56,7 @@ var __webpack_exports__ = {};
const { spawn } = __webpack_require__(81);
const { join } = __webpack_require__(17);

const child = spawn(gifsicle, ['--colors', '256', __nccwpck_require__.ab + "asset1.txt"]);
const child = spawn(gifsicle, ['--colors', '256', __webpack_require__.ab + "asset1.txt"]);

})();

Expand Down
7 changes: 4 additions & 3 deletions test/unit/asset-fs-existing-asset-name/output-coverage.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -36,9 +36,10 @@ module.exports = require("fs");
/******/ }
/******/
/************************************************************************/
/******/ /* webpack/runtime/compat */
/******/
/******/ if (typeof __webpack_require__ !== 'undefined') __webpack_require__.ab = __dirname + "/";
/******/ /* webpack/runtime/asset-relocator-loader */
/******/ (() => {
/******/ if (typeof __webpack_require__ !== 'undefined') __webpack_require__.ab = __dirname + "/";
/******/ })();
/******/
/************************************************************************/
var __webpack_exports__ = {};
Expand Down
9 changes: 5 additions & 4 deletions test/unit/asset-fs-existing-asset-name/output.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -36,16 +36,17 @@ module.exports = require("fs");
/******/ }
/******/
/************************************************************************/
/******/ /* webpack/runtime/compat */
/******/
/******/ if (typeof __nccwpck_require__ !== 'undefined') __nccwpck_require__.ab = __dirname + "/";
/******/ /* webpack/runtime/asset-relocator-loader */
/******/ (() => {
/******/ if (typeof __webpack_require__ !== 'undefined') __webpack_require__.ab = __dirname + "/";
/******/ })();
/******/
/************************************************************************/
var __webpack_exports__ = {};
// This entry need to be wrapped in an IIFE because it need to be isolated against other modules in the chunk.
(() => {
const fs = __webpack_require__(147);
console.log(fs.readFileSync(__nccwpck_require__.ab + "existing1.txt"));
console.log(fs.readFileSync(__webpack_require__.ab + "existing1.txt"));

})();

Expand Down
7 changes: 4 additions & 3 deletions test/unit/asset-fs-inline-assign/output-coverage.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -44,9 +44,10 @@ module.exports = require("path");
/******/ }
/******/
/************************************************************************/
/******/ /* webpack/runtime/compat */
/******/
/******/ if (typeof __webpack_require__ !== 'undefined') __webpack_require__.ab = __dirname + "/";
/******/ /* webpack/runtime/asset-relocator-loader */
/******/ (() => {
/******/ if (typeof __webpack_require__ !== 'undefined') __webpack_require__.ab = __dirname + "/";
/******/ })();
/******/
/************************************************************************/
var __webpack_exports__ = {};
Expand Down
11 changes: 6 additions & 5 deletions test/unit/asset-fs-inline-assign/output.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -44,9 +44,10 @@ module.exports = require("path");
/******/ }
/******/
/************************************************************************/
/******/ /* webpack/runtime/compat */
/******/
/******/ if (typeof __nccwpck_require__ !== 'undefined') __nccwpck_require__.ab = __dirname + "/";
/******/ /* webpack/runtime/asset-relocator-loader */
/******/ (() => {
/******/ if (typeof __webpack_require__ !== 'undefined') __webpack_require__.ab = __dirname + "/";
/******/ })();
/******/
/************************************************************************/
var __webpack_exports__ = {};
Expand All @@ -55,11 +56,11 @@ var __webpack_exports__ = {};
const fs = __webpack_require__(147);
const { join } = __webpack_require__(17);

console.log(fs.readFileSync(__nccwpck_require__.ab + "asset.txt", 'utf8'));
console.log(fs.readFileSync(__webpack_require__.ab + "asset.txt", 'utf8'));

(function () {
var join = () => 'nope';
console.log(fs.readFileSync(join(__nccwpck_require__.ab + "asset-fs-inline-assign", 'asset.txt'), 'utf8'));
console.log(fs.readFileSync(join(__webpack_require__.ab + "asset-fs-inline-assign", 'asset.txt'), 'utf8'));
})();
})();

Expand Down
9 changes: 5 additions & 4 deletions test/unit/asset-fs-inline-path-enc-es-2/output-coverage.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -27,6 +27,11 @@
/******/ }
/******/
/************************************************************************/
/******/ /* webpack/runtime/asset-relocator-loader */
/******/ (() => {
/******/ if (typeof __webpack_require__ !== 'undefined') __webpack_require__.ab = __dirname + "/";
/******/ })();
/******/
/******/ /* webpack/runtime/compat get default export */
/******/ (() => {
/******/ // getDefaultExport function for compatibility with non-harmony modules
Expand Down Expand Up @@ -67,10 +72,6 @@
/******/ };
/******/ })();
/******/
/******/ /* webpack/runtime/compat */
/******/
/******/ if (typeof __webpack_require__ !== 'undefined') __webpack_require__.ab = __dirname + "/";
/******/
/************************************************************************/
var __webpack_exports__ = {};
// ESM COMPAT FLAG
Expand Down
Loading
Loading