@rsbuild/plugin-react 1.4.2 → 1.4.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +1 -1
- package/dist/index.cjs +17 -9
- package/dist/index.js +114 -104
- package/dist/react.d.ts +2 -2
- package/dist/splitChunks.d.ts +1 -1
- package/package.json +6 -6
package/README.md
CHANGED
|
@@ -7,7 +7,7 @@ An Rsbuild plugin to provide support for React, integrating features such as JSX
|
|
|
7
7
|
<img src="https://img.shields.io/npm/v/@rsbuild/plugin-react?style=flat-square&colorA=564341&colorB=EDED91" alt="npm version" />
|
|
8
8
|
</a>
|
|
9
9
|
<img src="https://img.shields.io/badge/License-MIT-blue.svg?style=flat-square&colorA=564341&colorB=EDED91" alt="license" />
|
|
10
|
-
<a href="https://npmcharts.com/compare/@rsbuild/plugin-react
|
|
10
|
+
<a href="https://npmcharts.com/compare/@rsbuild/plugin-react"><img src="https://img.shields.io/npm/dm/@rsbuild/plugin-react.svg?style=flat-square&colorA=564341&colorB=EDED91" alt="downloads" /></a>
|
|
11
11
|
</p>
|
|
12
12
|
|
|
13
13
|
## Documentation
|
package/dist/index.cjs
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
const __rslib_import_meta_url__ =
|
|
2
|
+
const __rslib_import_meta_url__ = "u" < typeof document ? new (require('url'.replace('', ''))).URL('file:' + __filename).href : document.currentScript && document.currentScript.src || new URL('main.js', document.baseURI).href;
|
|
3
3
|
var __webpack_require__ = {};
|
|
4
4
|
__webpack_require__.n = (module)=>{
|
|
5
5
|
var getter = module && module.__esModule ? ()=>module.default : ()=>module;
|
|
@@ -12,7 +12,7 @@ __webpack_require__.n = (module)=>{
|
|
|
12
12
|
get: definition[key]
|
|
13
13
|
});
|
|
14
14
|
}, __webpack_require__.o = (obj, prop)=>Object.prototype.hasOwnProperty.call(obj, prop), __webpack_require__.r = (exports1)=>{
|
|
15
|
-
|
|
15
|
+
"u" > typeof Symbol && Symbol.toStringTag && Object.defineProperty(exports1, Symbol.toStringTag, {
|
|
16
16
|
value: 'Module'
|
|
17
17
|
}), Object.defineProperty(exports1, '__esModule', {
|
|
18
18
|
value: !0
|
|
@@ -25,7 +25,8 @@ __webpack_require__.r(__webpack_exports__), __webpack_require__.d(__webpack_expo
|
|
|
25
25
|
});
|
|
26
26
|
const external_node_module_namespaceObject = require("node:module"), external_node_path_namespaceObject = require("node:path");
|
|
27
27
|
var external_node_path_default = __webpack_require__.n(external_node_path_namespaceObject);
|
|
28
|
-
const react_require = (0, external_node_module_namespaceObject.createRequire)(__rslib_import_meta_url__)
|
|
28
|
+
const react_require = (0, external_node_module_namespaceObject.createRequire)(__rslib_import_meta_url__);
|
|
29
|
+
function applyBasicReactSupport(api, options) {
|
|
29
30
|
let REACT_REFRESH_PATH = options.fastRefresh ? react_require.resolve('react-refresh') : '';
|
|
30
31
|
api.modifyEnvironmentConfig((config, { mergeEnvironmentConfig })=>{
|
|
31
32
|
let isDev = 'development' === config.mode, usingHMR = isDev && config.dev.hmr && 'web' === config.output.target;
|
|
@@ -72,7 +73,8 @@ const react_require = (0, external_node_module_namespaceObject.createRequire)(__
|
|
|
72
73
|
}
|
|
73
74
|
]);
|
|
74
75
|
});
|
|
75
|
-
}
|
|
76
|
+
}
|
|
77
|
+
function applyReactProfiler(api) {
|
|
76
78
|
let hasReactDomClientCache;
|
|
77
79
|
api.modifyEnvironmentConfig((config, { mergeEnvironmentConfig })=>{
|
|
78
80
|
if ('production' === config.mode) return mergeEnvironmentConfig(config, {
|
|
@@ -104,10 +106,15 @@ const react_require = (0, external_node_module_namespaceObject.createRequire)(__
|
|
|
104
106
|
return hasReactDomClientCache;
|
|
105
107
|
})() ? 'react-dom/client$' : 'react-dom$', 'react-dom/profiling'), chain.resolve.alias.set('scheduler/tracing', 'scheduler/tracing-profiling'));
|
|
106
108
|
});
|
|
107
|
-
}
|
|
109
|
+
}
|
|
110
|
+
const isDefaultPreset = (config)=>{
|
|
111
|
+
let { performance, splitChunks } = config;
|
|
112
|
+
return performance.chunkSplit && 'object' == typeof splitChunks && 0 === Object.keys(splitChunks).length ? performance.chunkSplit?.strategy === 'split-by-experience' : 'object' == typeof splitChunks && (!splitChunks.preset || 'default' === splitChunks.preset);
|
|
113
|
+
};
|
|
114
|
+
function applySplitChunksRule(api, options) {
|
|
108
115
|
api.modifyBundlerChain((chain, { environment, isProd })=>{
|
|
109
116
|
let { config } = environment;
|
|
110
|
-
if ('
|
|
117
|
+
if (!isDefaultPreset(config) || 'web' !== config.output.target || !1 === options) return;
|
|
111
118
|
let normalizedOptions = !0 === options ? {
|
|
112
119
|
react: !0,
|
|
113
120
|
router: !0
|
|
@@ -130,7 +137,8 @@ const react_require = (0, external_node_module_namespaceObject.createRequire)(__
|
|
|
130
137
|
}
|
|
131
138
|
});
|
|
132
139
|
});
|
|
133
|
-
}
|
|
140
|
+
}
|
|
141
|
+
const PLUGIN_REACT_NAME = 'rsbuild:react', pluginReact = (options = {})=>({
|
|
134
142
|
name: PLUGIN_REACT_NAME,
|
|
135
143
|
setup (api) {
|
|
136
144
|
let finalOptions = {
|
|
@@ -142,10 +150,10 @@ const react_require = (0, external_node_module_namespaceObject.createRequire)(__
|
|
|
142
150
|
'rspack' === api.context.bundlerType && (applyBasicReactSupport(api, finalOptions), finalOptions.enableProfiler && applyReactProfiler(api)), applySplitChunksRule(api, finalOptions.splitChunks);
|
|
143
151
|
}
|
|
144
152
|
});
|
|
145
|
-
for(var
|
|
153
|
+
for(var __rspack_i in exports.PLUGIN_REACT_NAME = __webpack_exports__.PLUGIN_REACT_NAME, exports.pluginReact = __webpack_exports__.pluginReact, __webpack_exports__)-1 === [
|
|
146
154
|
"PLUGIN_REACT_NAME",
|
|
147
155
|
"pluginReact"
|
|
148
|
-
].indexOf(
|
|
156
|
+
].indexOf(__rspack_i) && (exports[__rspack_i] = __webpack_exports__[__rspack_i]);
|
|
149
157
|
Object.defineProperty(exports, '__esModule', {
|
|
150
158
|
value: !0
|
|
151
159
|
});
|
package/dist/index.js
CHANGED
|
@@ -1,117 +1,127 @@
|
|
|
1
1
|
import { createRequire } from "node:module";
|
|
2
2
|
import node_path from "node:path";
|
|
3
|
-
let react_require = createRequire(import.meta.url)
|
|
3
|
+
let react_require = createRequire(import.meta.url);
|
|
4
|
+
function applyBasicReactSupport(api, options) {
|
|
5
|
+
let REACT_REFRESH_PATH = options.fastRefresh ? react_require.resolve('react-refresh') : '';
|
|
6
|
+
api.modifyEnvironmentConfig((config, { mergeEnvironmentConfig })=>{
|
|
7
|
+
let isDev = 'development' === config.mode, usingHMR = isDev && config.dev.hmr && 'web' === config.output.target;
|
|
8
|
+
return mergeEnvironmentConfig({
|
|
9
|
+
tools: {
|
|
10
|
+
swc: {
|
|
11
|
+
jsc: {
|
|
12
|
+
parser: {
|
|
13
|
+
syntax: "typescript",
|
|
14
|
+
tsx: !0
|
|
15
|
+
},
|
|
16
|
+
transform: {
|
|
17
|
+
react: {
|
|
18
|
+
development: isDev,
|
|
19
|
+
refresh: usingHMR && options.fastRefresh,
|
|
20
|
+
runtime: 'automatic',
|
|
21
|
+
...options.swcReactOptions
|
|
22
|
+
}
|
|
23
|
+
}
|
|
24
|
+
}
|
|
25
|
+
}
|
|
26
|
+
}
|
|
27
|
+
}, config);
|
|
28
|
+
}), options.swcReactOptions?.runtime === 'preserve' && api.modifyBundlerChain((chain)=>{
|
|
29
|
+
chain.module.parser.merge({
|
|
30
|
+
javascript: {
|
|
31
|
+
jsx: !0
|
|
32
|
+
}
|
|
33
|
+
});
|
|
34
|
+
}), api.modifyBundlerChain(async (chain, { CHAIN_ID, environment, isDev, target })=>{
|
|
35
|
+
let { config } = environment;
|
|
36
|
+
if (!(isDev && config.dev.hmr && 'web' === target) || !options.fastRefresh) return;
|
|
37
|
+
chain.resolve.alias.set('react-refresh', node_path.dirname(REACT_REFRESH_PATH));
|
|
38
|
+
let { ReactRefreshRspackPlugin } = await import("@rspack/plugin-react-refresh"), jsRule = chain.module.rules.get(CHAIN_ID.RULE.JS);
|
|
39
|
+
chain.plugin(CHAIN_ID.PLUGIN.REACT_FAST_REFRESH).use(ReactRefreshRspackPlugin, [
|
|
40
|
+
{
|
|
41
|
+
test: jsRule.get('test'),
|
|
42
|
+
include: jsRule.include.values(),
|
|
43
|
+
exclude: jsRule.exclude.values(),
|
|
44
|
+
resourceQuery: {
|
|
45
|
+
not: /^\?raw$/
|
|
46
|
+
},
|
|
47
|
+
...options.reactRefreshOptions
|
|
48
|
+
}
|
|
49
|
+
]);
|
|
50
|
+
});
|
|
51
|
+
}
|
|
52
|
+
function applyReactProfiler(api) {
|
|
53
|
+
let hasReactDomClientCache;
|
|
54
|
+
api.modifyEnvironmentConfig((config, { mergeEnvironmentConfig })=>{
|
|
55
|
+
if ('production' === config.mode) return mergeEnvironmentConfig(config, {
|
|
56
|
+
output: {
|
|
57
|
+
minify: {
|
|
58
|
+
jsOptions: {
|
|
59
|
+
minimizerOptions: {
|
|
60
|
+
mangle: {
|
|
61
|
+
keep_classnames: !0,
|
|
62
|
+
keep_fnames: !0
|
|
63
|
+
}
|
|
64
|
+
}
|
|
65
|
+
}
|
|
66
|
+
}
|
|
67
|
+
}
|
|
68
|
+
});
|
|
69
|
+
}), api.modifyBundlerChain((chain, { isProd })=>{
|
|
70
|
+
isProd && (chain.resolve.alias.set((()=>{
|
|
71
|
+
if (void 0 !== hasReactDomClientCache) return hasReactDomClientCache;
|
|
72
|
+
try {
|
|
73
|
+
react_require.resolve('react-dom/client', {
|
|
74
|
+
paths: [
|
|
75
|
+
api.context.rootPath
|
|
76
|
+
]
|
|
77
|
+
}), hasReactDomClientCache = !0;
|
|
78
|
+
} catch {
|
|
79
|
+
hasReactDomClientCache = !1;
|
|
80
|
+
}
|
|
81
|
+
return hasReactDomClientCache;
|
|
82
|
+
})() ? 'react-dom/client$' : 'react-dom$', 'react-dom/profiling'), chain.resolve.alias.set('scheduler/tracing', 'scheduler/tracing-profiling'));
|
|
83
|
+
});
|
|
84
|
+
}
|
|
85
|
+
function applySplitChunksRule(api, options) {
|
|
86
|
+
api.modifyBundlerChain((chain, { environment, isProd })=>{
|
|
87
|
+
let { config } = environment;
|
|
88
|
+
if (!((config)=>{
|
|
89
|
+
let { performance, splitChunks } = config;
|
|
90
|
+
return performance.chunkSplit && 'object' == typeof splitChunks && 0 === Object.keys(splitChunks).length ? performance.chunkSplit?.strategy === 'split-by-experience' : 'object' == typeof splitChunks && (!splitChunks.preset || 'default' === splitChunks.preset);
|
|
91
|
+
})(config) || 'web' !== config.output.target || !1 === options) return;
|
|
92
|
+
let normalizedOptions = !0 === options ? {
|
|
93
|
+
react: !0,
|
|
94
|
+
router: !0
|
|
95
|
+
} : options, currentConfig = chain.optimization.splitChunks.values();
|
|
96
|
+
if ('object' != typeof currentConfig) return;
|
|
97
|
+
let extraGroups = {};
|
|
98
|
+
normalizedOptions.react && (extraGroups.react = {
|
|
99
|
+
name: 'lib-react',
|
|
100
|
+
test: isProd ? /node_modules[\\/](?:react|react-dom|scheduler)[\\/]/ : /node_modules[\\/](?:react|react-dom|scheduler|react-refresh|@rspack[\\/]plugin-react-refresh)[\\/]/,
|
|
101
|
+
priority: 0
|
|
102
|
+
}), normalizedOptions.router && (extraGroups.router = {
|
|
103
|
+
name: 'lib-router',
|
|
104
|
+
test: /node_modules[\\/](?:react-router|react-router-dom|history|@remix-run[\\/]router)[\\/]/,
|
|
105
|
+
priority: 0
|
|
106
|
+
}), Object.keys(extraGroups).length && chain.optimization.splitChunks({
|
|
107
|
+
...currentConfig,
|
|
108
|
+
cacheGroups: {
|
|
109
|
+
...extraGroups,
|
|
110
|
+
...currentConfig.cacheGroups
|
|
111
|
+
}
|
|
112
|
+
});
|
|
113
|
+
});
|
|
114
|
+
}
|
|
115
|
+
let PLUGIN_REACT_NAME = 'rsbuild:react', pluginReact = (options = {})=>({
|
|
4
116
|
name: PLUGIN_REACT_NAME,
|
|
5
117
|
setup (api) {
|
|
6
|
-
var options1;
|
|
7
118
|
let finalOptions = {
|
|
8
119
|
fastRefresh: !0,
|
|
9
120
|
splitChunks: !0,
|
|
10
121
|
enableProfiler: !1,
|
|
11
122
|
...options
|
|
12
123
|
};
|
|
13
|
-
|
|
14
|
-
let REACT_REFRESH_PATH, hasReactDomClientCache;
|
|
15
|
-
REACT_REFRESH_PATH = finalOptions.fastRefresh ? react_require.resolve('react-refresh') : '', api.modifyEnvironmentConfig((config, { mergeEnvironmentConfig })=>{
|
|
16
|
-
let isDev = 'development' === config.mode, usingHMR = isDev && config.dev.hmr && 'web' === config.output.target;
|
|
17
|
-
return mergeEnvironmentConfig({
|
|
18
|
-
tools: {
|
|
19
|
-
swc: {
|
|
20
|
-
jsc: {
|
|
21
|
-
parser: {
|
|
22
|
-
syntax: "typescript",
|
|
23
|
-
tsx: !0
|
|
24
|
-
},
|
|
25
|
-
transform: {
|
|
26
|
-
react: {
|
|
27
|
-
development: isDev,
|
|
28
|
-
refresh: usingHMR && finalOptions.fastRefresh,
|
|
29
|
-
runtime: 'automatic',
|
|
30
|
-
...finalOptions.swcReactOptions
|
|
31
|
-
}
|
|
32
|
-
}
|
|
33
|
-
}
|
|
34
|
-
}
|
|
35
|
-
}
|
|
36
|
-
}, config);
|
|
37
|
-
}), finalOptions.swcReactOptions?.runtime === 'preserve' && api.modifyBundlerChain((chain)=>{
|
|
38
|
-
chain.module.parser.merge({
|
|
39
|
-
javascript: {
|
|
40
|
-
jsx: !0
|
|
41
|
-
}
|
|
42
|
-
});
|
|
43
|
-
}), api.modifyBundlerChain(async (chain, { CHAIN_ID, environment, isDev, target })=>{
|
|
44
|
-
let { config } = environment;
|
|
45
|
-
if (!(isDev && config.dev.hmr && 'web' === target) || !finalOptions.fastRefresh) return;
|
|
46
|
-
chain.resolve.alias.set('react-refresh', node_path.dirname(REACT_REFRESH_PATH));
|
|
47
|
-
let { ReactRefreshRspackPlugin } = await import("@rspack/plugin-react-refresh"), jsRule = chain.module.rules.get(CHAIN_ID.RULE.JS);
|
|
48
|
-
chain.plugin(CHAIN_ID.PLUGIN.REACT_FAST_REFRESH).use(ReactRefreshRspackPlugin, [
|
|
49
|
-
{
|
|
50
|
-
test: jsRule.get('test'),
|
|
51
|
-
include: jsRule.include.values(),
|
|
52
|
-
exclude: jsRule.exclude.values(),
|
|
53
|
-
resourceQuery: {
|
|
54
|
-
not: /^\?raw$/
|
|
55
|
-
},
|
|
56
|
-
...finalOptions.reactRefreshOptions
|
|
57
|
-
}
|
|
58
|
-
]);
|
|
59
|
-
}), finalOptions.enableProfiler && (api.modifyEnvironmentConfig((config, { mergeEnvironmentConfig })=>{
|
|
60
|
-
if ('production' === config.mode) return mergeEnvironmentConfig(config, {
|
|
61
|
-
output: {
|
|
62
|
-
minify: {
|
|
63
|
-
jsOptions: {
|
|
64
|
-
minimizerOptions: {
|
|
65
|
-
mangle: {
|
|
66
|
-
keep_classnames: !0,
|
|
67
|
-
keep_fnames: !0
|
|
68
|
-
}
|
|
69
|
-
}
|
|
70
|
-
}
|
|
71
|
-
}
|
|
72
|
-
}
|
|
73
|
-
});
|
|
74
|
-
}), api.modifyBundlerChain((chain, { isProd })=>{
|
|
75
|
-
isProd && (chain.resolve.alias.set((()=>{
|
|
76
|
-
if (void 0 !== hasReactDomClientCache) return hasReactDomClientCache;
|
|
77
|
-
try {
|
|
78
|
-
react_require.resolve('react-dom/client', {
|
|
79
|
-
paths: [
|
|
80
|
-
api.context.rootPath
|
|
81
|
-
]
|
|
82
|
-
}), hasReactDomClientCache = !0;
|
|
83
|
-
} catch {
|
|
84
|
-
hasReactDomClientCache = !1;
|
|
85
|
-
}
|
|
86
|
-
return hasReactDomClientCache;
|
|
87
|
-
})() ? 'react-dom/client$' : 'react-dom$', 'react-dom/profiling'), chain.resolve.alias.set('scheduler/tracing', 'scheduler/tracing-profiling'));
|
|
88
|
-
}));
|
|
89
|
-
}
|
|
90
|
-
options1 = finalOptions.splitChunks, api.modifyBundlerChain((chain, { environment, isProd })=>{
|
|
91
|
-
let { config } = environment;
|
|
92
|
-
if ('split-by-experience' !== config.performance.chunkSplit.strategy || !1 === options1) return;
|
|
93
|
-
let normalizedOptions = !0 === options1 ? {
|
|
94
|
-
react: !0,
|
|
95
|
-
router: !0
|
|
96
|
-
} : options1, currentConfig = chain.optimization.splitChunks.values();
|
|
97
|
-
if ('object' != typeof currentConfig) return;
|
|
98
|
-
let extraGroups = {};
|
|
99
|
-
normalizedOptions.react && (extraGroups.react = {
|
|
100
|
-
name: 'lib-react',
|
|
101
|
-
test: isProd ? /node_modules[\\/](?:react|react-dom|scheduler)[\\/]/ : /node_modules[\\/](?:react|react-dom|scheduler|react-refresh|@rspack[\\/]plugin-react-refresh)[\\/]/,
|
|
102
|
-
priority: 0
|
|
103
|
-
}), normalizedOptions.router && (extraGroups.router = {
|
|
104
|
-
name: 'lib-router',
|
|
105
|
-
test: /node_modules[\\/](?:react-router|react-router-dom|history|@remix-run[\\/]router)[\\/]/,
|
|
106
|
-
priority: 0
|
|
107
|
-
}), Object.keys(extraGroups).length && chain.optimization.splitChunks({
|
|
108
|
-
...currentConfig,
|
|
109
|
-
cacheGroups: {
|
|
110
|
-
...extraGroups,
|
|
111
|
-
...currentConfig.cacheGroups
|
|
112
|
-
}
|
|
113
|
-
});
|
|
114
|
-
});
|
|
124
|
+
'rspack' === api.context.bundlerType && (applyBasicReactSupport(api, finalOptions), finalOptions.enableProfiler && applyReactProfiler(api)), applySplitChunksRule(api, finalOptions.splitChunks);
|
|
115
125
|
}
|
|
116
126
|
});
|
|
117
127
|
export { PLUGIN_REACT_NAME, pluginReact };
|
package/dist/react.d.ts
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
import type { RsbuildPluginAPI } from '@rsbuild/core';
|
|
2
2
|
import type { PluginReactOptions } from './index.js';
|
|
3
|
-
export declare
|
|
4
|
-
export declare
|
|
3
|
+
export declare function applyBasicReactSupport(api: RsbuildPluginAPI, options: PluginReactOptions): void;
|
|
4
|
+
export declare function applyReactProfiler(api: RsbuildPluginAPI): void;
|
package/dist/splitChunks.d.ts
CHANGED
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
import type { RsbuildPluginAPI } from '@rsbuild/core';
|
|
2
2
|
import type { SplitReactChunkOptions } from './index.js';
|
|
3
|
-
export declare
|
|
3
|
+
export declare function applySplitChunksRule(api: RsbuildPluginAPI, options: SplitReactChunkOptions | boolean): void;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@rsbuild/plugin-react",
|
|
3
|
-
"version": "1.4.
|
|
3
|
+
"version": "1.4.4",
|
|
4
4
|
"description": "React plugin for Rsbuild",
|
|
5
5
|
"repository": {
|
|
6
6
|
"type": "git",
|
|
@@ -22,18 +22,18 @@
|
|
|
22
22
|
"dist"
|
|
23
23
|
],
|
|
24
24
|
"dependencies": {
|
|
25
|
-
"@rspack/plugin-react-refresh": "^1.
|
|
25
|
+
"@rspack/plugin-react-refresh": "^1.6.0",
|
|
26
26
|
"react-refresh": "^0.18.0"
|
|
27
27
|
},
|
|
28
28
|
"devDependencies": {
|
|
29
|
-
"@rslib/core": "0.
|
|
30
|
-
"@types/node": "^24.9
|
|
29
|
+
"@rslib/core": "0.19.3",
|
|
30
|
+
"@types/node": "^24.10.9",
|
|
31
31
|
"typescript": "^5.9.3",
|
|
32
|
-
"@rsbuild/core": "
|
|
32
|
+
"@rsbuild/core": "2.0.0-beta.0",
|
|
33
33
|
"@scripts/test-helper": "1.0.1"
|
|
34
34
|
},
|
|
35
35
|
"peerDependencies": {
|
|
36
|
-
"@rsbuild/core": "1.
|
|
36
|
+
"@rsbuild/core": "^1.0.0 || ^2.0.0-0"
|
|
37
37
|
},
|
|
38
38
|
"publishConfig": {
|
|
39
39
|
"access": "public",
|