Skip to content

Commit 9b2c88f

Browse files
authored
fix: use __webpack_global__ in loader if available (#940)
1 parent b567b80 commit 9b2c88f

6 files changed

Lines changed: 25 additions & 15 deletions

File tree

loader/index.js

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -12,6 +12,7 @@ const {
1212
getModuleSystem,
1313
getRefreshModuleRuntime,
1414
normalizeOptions,
15+
webpackGlobal,
1516
} = require('./utils');
1617
const schema = require('./options.json');
1718

@@ -45,11 +46,11 @@ function ReactRefreshLoader(source, inputSourceMap, meta) {
4546

4647
const RefreshSetupRuntimes = {
4748
cjs: Template.asString(
48-
`__webpack_require__.$Refresh$.runtime = require('${RefreshRuntimePath}');`
49+
`${webpackGlobal}.$Refresh$.runtime = require('${RefreshRuntimePath}');`
4950
),
5051
esm: Template.asString([
5152
`import * as __react_refresh_runtime__ from '${RefreshRuntimePath}';`,
52-
`__webpack_require__.$Refresh$.runtime = __react_refresh_runtime__;`,
53+
`${webpackGlobal}.$Refresh$.runtime = __react_refresh_runtime__;`,
5354
]),
5455
};
5556

loader/utils/getRefreshModuleRuntime.js

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,5 @@
1+
const webpackGlobal = require('./webpackGlobal');
2+
13
/**
24
* @typedef ModuleRuntimeOptions {Object}
35
* @property {boolean} const Use ES6 `const` and `let` in generated runtime code.
@@ -21,7 +23,7 @@ function getRefreshModuleRuntime(Template, options) {
2123
const letDeclaration = options.const ? 'let' : 'var';
2224
const webpackHot = options.moduleSystem === 'esm' ? 'import.meta.webpackHot' : 'module.hot';
2325
return Template.asString([
24-
`${constDeclaration} $ReactRefreshModuleId$ = __webpack_require__.$Refresh$.moduleId;`,
26+
`${constDeclaration} $ReactRefreshModuleId$ = ${webpackGlobal}.$Refresh$.moduleId;`,
2527
`${constDeclaration} $ReactRefreshCurrentExports$ = __react_refresh_utils__.getModuleExports(`,
2628
Template.indent('$ReactRefreshModuleId$'),
2729
');',

loader/utils/index.js

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2,10 +2,12 @@ const getIdentitySourceMap = require('./getIdentitySourceMap');
22
const getModuleSystem = require('./getModuleSystem');
33
const getRefreshModuleRuntime = require('./getRefreshModuleRuntime');
44
const normalizeOptions = require('./normalizeOptions');
5+
const webpackGlobal = require('./webpackGlobal');
56

67
module.exports = {
78
getIdentitySourceMap,
89
getModuleSystem,
910
getRefreshModuleRuntime,
1011
normalizeOptions,
12+
webpackGlobal,
1113
};

loader/utils/webpackGlobal.js

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
// When available, use `__webpack_global__` which is a stable runtime function to use `__webpack_require__` in this compilation
2+
// See: https://github.com/webpack/webpack/issues/20139
3+
const webpackGlobal = `(typeof __webpack_global__ !== 'undefined' ? __webpack_global__ : __webpack_require__)`;
4+
5+
module.exports = webpackGlobal;

test/loader/loader.test.js

Lines changed: 8 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -16,12 +16,12 @@ describe('loader', () => {
1616
const { execution, parsed } = compilation.module;
1717

1818
expect(parsed).toMatchInlineSnapshot(`
19-
"__webpack_require__.$Refresh$.runtime = require('react-refresh');
19+
"(typeof __webpack_global__ !== 'undefined' ? __webpack_global__ : __webpack_require__).$Refresh$.runtime = require('react-refresh');
2020
2121
module.exports = 'Test';
2222
2323
24-
var $ReactRefreshModuleId$ = __webpack_require__.$Refresh$.moduleId;
24+
var $ReactRefreshModuleId$ = (typeof __webpack_global__ !== 'undefined' ? __webpack_global__ : __webpack_require__).$Refresh$.moduleId;
2525
var $ReactRefreshCurrentExports$ = __react_refresh_utils__.getModuleExports(
2626
$ReactRefreshModuleId$
2727
);
@@ -61,12 +61,12 @@ describe('loader', () => {
6161
\\******************/
6262
/***/ ((module, __unused_webpack_exports, __webpack_require__) => {
6363
64-
__webpack_require__.$Refresh$.runtime = __webpack_require__(/*! react-refresh */ "../../../../node_modules/react-refresh/runtime.js");
64+
(typeof __webpack_global__ !== 'undefined' ? __webpack_global__ : __webpack_require__).$Refresh$.runtime = __webpack_require__(/*! react-refresh */ "../../../../node_modules/react-refresh/runtime.js");
6565
6666
module.exports = 'Test';
6767
6868
69-
var $ReactRefreshModuleId$ = __webpack_require__.$Refresh$.moduleId;
69+
var $ReactRefreshModuleId$ = (typeof __webpack_global__ !== 'undefined' ? __webpack_global__ : __webpack_require__).$Refresh$.moduleId;
7070
var $ReactRefreshCurrentExports$ = __react_refresh_utils__.getModuleExports(
7171
$ReactRefreshModuleId$
7272
);
@@ -118,12 +118,12 @@ describe('loader', () => {
118118

119119
expect(parsed).toMatchInlineSnapshot(`
120120
"import * as __react_refresh_runtime__ from 'react-refresh';
121-
__webpack_require__.$Refresh$.runtime = __react_refresh_runtime__;
121+
(typeof __webpack_global__ !== 'undefined' ? __webpack_global__ : __webpack_require__).$Refresh$.runtime = __react_refresh_runtime__;
122122
123123
export default 'Test';
124124
125125
126-
var $ReactRefreshModuleId$ = __webpack_require__.$Refresh$.moduleId;
126+
var $ReactRefreshModuleId$ = (typeof __webpack_global__ !== 'undefined' ? __webpack_global__ : __webpack_require__).$Refresh$.moduleId;
127127
var $ReactRefreshCurrentExports$ = __react_refresh_utils__.getModuleExports(
128128
$ReactRefreshModuleId$
129129
);
@@ -171,12 +171,12 @@ describe('loader', () => {
171171
/* harmony export */ });
172172
/* harmony import */ var react_refresh__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react-refresh */ "../../../../node_modules/react-refresh/runtime.js");
173173
174-
__webpack_require__.$Refresh$.runtime = /*#__PURE__*/ (react_refresh__WEBPACK_IMPORTED_MODULE_0___namespace_cache || (react_refresh__WEBPACK_IMPORTED_MODULE_0___namespace_cache = __webpack_require__.t(react_refresh__WEBPACK_IMPORTED_MODULE_0__, 2)));
174+
(typeof __webpack_global__ !== 'undefined' ? __webpack_global__ : __webpack_require__).$Refresh$.runtime = /*#__PURE__*/ (react_refresh__WEBPACK_IMPORTED_MODULE_0___namespace_cache || (react_refresh__WEBPACK_IMPORTED_MODULE_0___namespace_cache = __webpack_require__.t(react_refresh__WEBPACK_IMPORTED_MODULE_0__, 2)));
175175
176176
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = ('Test');
177177
178178
179-
var $ReactRefreshModuleId$ = __webpack_require__.$Refresh$.moduleId;
179+
var $ReactRefreshModuleId$ = (typeof __webpack_global__ !== 'undefined' ? __webpack_global__ : __webpack_require__).$Refresh$.moduleId;
180180
var $ReactRefreshCurrentExports$ = __react_refresh_utils__.getModuleExports(
181181
$ReactRefreshModuleId$
182182
);

test/loader/unit/getRefreshModuleRuntime.test.js

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,7 @@ describe('getRefreshModuleRuntime', () => {
1414
expect(refreshModuleRuntime.indexOf('module.hot')).not.toBe(-1);
1515
expect(refreshModuleRuntime.indexOf('import.meta.webpackHot')).toBe(-1);
1616
expect(refreshModuleRuntime).toMatchInlineSnapshot(`
17-
"var $ReactRefreshModuleId$ = __webpack_require__.$Refresh$.moduleId;
17+
"var $ReactRefreshModuleId$ = (typeof __webpack_global__ !== 'undefined' ? __webpack_global__ : __webpack_require__).$Refresh$.moduleId;
1818
var $ReactRefreshCurrentExports$ = __react_refresh_utils__.getModuleExports(
1919
$ReactRefreshModuleId$
2020
);
@@ -59,7 +59,7 @@ describe('getRefreshModuleRuntime', () => {
5959
expect(refreshModuleRuntime.indexOf('module.hot')).not.toBe(-1);
6060
expect(refreshModuleRuntime.indexOf('import.meta.webpackHot')).toBe(-1);
6161
expect(refreshModuleRuntime).toMatchInlineSnapshot(`
62-
"const $ReactRefreshModuleId$ = __webpack_require__.$Refresh$.moduleId;
62+
"const $ReactRefreshModuleId$ = (typeof __webpack_global__ !== 'undefined' ? __webpack_global__ : __webpack_require__).$Refresh$.moduleId;
6363
const $ReactRefreshCurrentExports$ = __react_refresh_utils__.getModuleExports(
6464
$ReactRefreshModuleId$
6565
);
@@ -104,7 +104,7 @@ describe('getRefreshModuleRuntime', () => {
104104
expect(refreshModuleRuntime.indexOf('module.hot')).toBe(-1);
105105
expect(refreshModuleRuntime.indexOf('import.meta.webpackHot')).not.toBe(-1);
106106
expect(refreshModuleRuntime).toMatchInlineSnapshot(`
107-
"var $ReactRefreshModuleId$ = __webpack_require__.$Refresh$.moduleId;
107+
"var $ReactRefreshModuleId$ = (typeof __webpack_global__ !== 'undefined' ? __webpack_global__ : __webpack_require__).$Refresh$.moduleId;
108108
var $ReactRefreshCurrentExports$ = __react_refresh_utils__.getModuleExports(
109109
$ReactRefreshModuleId$
110110
);
@@ -149,7 +149,7 @@ describe('getRefreshModuleRuntime', () => {
149149
expect(refreshModuleRuntime.indexOf('module.hot')).toBe(-1);
150150
expect(refreshModuleRuntime.indexOf('import.meta.webpackHot')).not.toBe(-1);
151151
expect(refreshModuleRuntime).toMatchInlineSnapshot(`
152-
"const $ReactRefreshModuleId$ = __webpack_require__.$Refresh$.moduleId;
152+
"const $ReactRefreshModuleId$ = (typeof __webpack_global__ !== 'undefined' ? __webpack_global__ : __webpack_require__).$Refresh$.moduleId;
153153
const $ReactRefreshCurrentExports$ = __react_refresh_utils__.getModuleExports(
154154
$ReactRefreshModuleId$
155155
);

0 commit comments

Comments
 (0)