@rsbuild/plugin-react 0.7.10 → 1.0.0-alpha.1
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/dist/index.cjs +48 -43
- package/dist/index.d.ts +7 -10
- package/dist/index.js +50 -47
- package/dist/react.d.ts +4 -0
- package/dist/splitChunks.d.ts +3 -0
- package/package.json +7 -7
package/dist/index.cjs
CHANGED
|
@@ -34,7 +34,6 @@ __export(src_exports, {
|
|
|
34
34
|
pluginReact: () => pluginReact
|
|
35
35
|
});
|
|
36
36
|
module.exports = __toCommonJS(src_exports);
|
|
37
|
-
var import_shared3 = require("@rsbuild/shared");
|
|
38
37
|
|
|
39
38
|
// src/react.ts
|
|
40
39
|
var import_node_path = __toESM(require("path"));
|
|
@@ -56,46 +55,51 @@ var modifySwcLoaderOptions = ({
|
|
|
56
55
|
};
|
|
57
56
|
var applyBasicReactSupport = (api, options) => {
|
|
58
57
|
const REACT_REFRESH_PATH = require.resolve("react-refresh");
|
|
59
|
-
api.modifyBundlerChain(
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
58
|
+
api.modifyBundlerChain(
|
|
59
|
+
async (chain, { CHAIN_ID, environment, isDev, isProd, target }) => {
|
|
60
|
+
const { config } = environment;
|
|
61
|
+
const usingHMR = !isProd && config.dev.hmr && target === "web";
|
|
62
|
+
const reactOptions = {
|
|
63
|
+
development: isDev,
|
|
64
|
+
refresh: usingHMR,
|
|
65
|
+
runtime: "automatic",
|
|
66
|
+
...options.swcReactOptions
|
|
67
|
+
};
|
|
68
|
+
modifySwcLoaderOptions({
|
|
69
|
+
chain,
|
|
70
|
+
CHAIN_ID,
|
|
71
|
+
modifier: (opts) => {
|
|
72
|
+
const extraOptions = {
|
|
73
|
+
jsc: {
|
|
74
|
+
parser: {
|
|
75
|
+
syntax: "typescript",
|
|
76
|
+
// enable supports for React JSX/TSX compilation
|
|
77
|
+
tsx: true
|
|
78
|
+
},
|
|
79
|
+
transform: {
|
|
80
|
+
react: reactOptions
|
|
81
|
+
}
|
|
81
82
|
}
|
|
82
|
-
}
|
|
83
|
-
|
|
84
|
-
|
|
83
|
+
};
|
|
84
|
+
return (0, import_shared.deepmerge)(opts, extraOptions);
|
|
85
|
+
}
|
|
86
|
+
});
|
|
87
|
+
if (!usingHMR) {
|
|
88
|
+
return;
|
|
85
89
|
}
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
90
|
+
chain.resolve.alias.set(
|
|
91
|
+
"react-refresh",
|
|
92
|
+
import_node_path.default.dirname(REACT_REFRESH_PATH)
|
|
93
|
+
);
|
|
94
|
+
const { default: ReactRefreshRspackPlugin } = await import("@rspack/plugin-react-refresh");
|
|
95
|
+
chain.plugin(CHAIN_ID.PLUGIN.REACT_FAST_REFRESH).use(ReactRefreshRspackPlugin, [
|
|
96
|
+
{
|
|
97
|
+
include: [import_shared.SCRIPT_REGEX],
|
|
98
|
+
...options.reactRefreshOptions
|
|
99
|
+
}
|
|
100
|
+
]);
|
|
89
101
|
}
|
|
90
|
-
|
|
91
|
-
const { default: ReactRefreshRspackPlugin } = await import("@rspack/plugin-react-refresh");
|
|
92
|
-
chain.plugin(CHAIN_ID.PLUGIN.REACT_FAST_REFRESH).use(ReactRefreshRspackPlugin, [
|
|
93
|
-
{
|
|
94
|
-
include: [import_shared.SCRIPT_REGEX],
|
|
95
|
-
...options.reactRefreshOptions
|
|
96
|
-
}
|
|
97
|
-
]);
|
|
98
|
-
});
|
|
102
|
+
);
|
|
99
103
|
};
|
|
100
104
|
var applyReactProfiler = (api) => {
|
|
101
105
|
api.modifyRsbuildConfig((config, { mergeRsbuildConfig }) => {
|
|
@@ -122,17 +126,18 @@ var applyReactProfiler = (api) => {
|
|
|
122
126
|
|
|
123
127
|
// src/splitChunks.ts
|
|
124
128
|
var import_shared2 = require("@rsbuild/shared");
|
|
129
|
+
var isPlainObject = (obj) => obj !== null && typeof obj === "object" && Object.prototype.toString.call(obj) === "[object Object]";
|
|
125
130
|
var applySplitChunksRule = (api, options = {
|
|
126
131
|
react: true,
|
|
127
132
|
router: true
|
|
128
133
|
}) => {
|
|
129
|
-
api.modifyBundlerChain((chain) => {
|
|
130
|
-
const config =
|
|
134
|
+
api.modifyBundlerChain((chain, { environment }) => {
|
|
135
|
+
const { config } = environment;
|
|
131
136
|
if (config.performance.chunkSplit.strategy !== "split-by-experience") {
|
|
132
137
|
return;
|
|
133
138
|
}
|
|
134
139
|
const currentConfig = chain.optimization.splitChunks.values();
|
|
135
|
-
if (!
|
|
140
|
+
if (!isPlainObject(currentConfig)) {
|
|
136
141
|
return;
|
|
137
142
|
}
|
|
138
143
|
const extraGroups = {};
|
|
@@ -141,7 +146,7 @@ var applySplitChunksRule = (api, options = {
|
|
|
141
146
|
"react",
|
|
142
147
|
"react-dom",
|
|
143
148
|
"scheduler",
|
|
144
|
-
...
|
|
149
|
+
...process.env.NODE_ENV === "production" ? [] : ["react-refresh", /@rspack[\\/]plugin-react-refresh/]
|
|
145
150
|
];
|
|
146
151
|
}
|
|
147
152
|
if (options.router) {
|
|
@@ -175,7 +180,7 @@ var pluginReact = ({
|
|
|
175
180
|
setup(api) {
|
|
176
181
|
if (api.context.bundlerType === "rspack") {
|
|
177
182
|
applyBasicReactSupport(api, options);
|
|
178
|
-
const isProdProfile = enableProfiler &&
|
|
183
|
+
const isProdProfile = enableProfiler && process.env.NODE_ENV === "production";
|
|
179
184
|
if (isProdProfile) {
|
|
180
185
|
applyReactProfiler(api);
|
|
181
186
|
}
|
package/dist/index.d.ts
CHANGED
|
@@ -1,7 +1,6 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import { PluginOptions } from '@rspack/plugin-react-refresh';
|
|
3
|
-
|
|
4
|
-
type SplitReactChunkOptions = {
|
|
1
|
+
import type { RsbuildPlugin, Rspack } from '@rsbuild/core';
|
|
2
|
+
import type { PluginOptions as ReactRefreshOptions } from '@rspack/plugin-react-refresh';
|
|
3
|
+
export type SplitReactChunkOptions = {
|
|
5
4
|
/**
|
|
6
5
|
* Whether to enable split chunking for React-related dependencies (e.g., react, react-dom, scheduler).
|
|
7
6
|
*
|
|
@@ -15,7 +14,7 @@ type SplitReactChunkOptions = {
|
|
|
15
14
|
*/
|
|
16
15
|
router?: boolean;
|
|
17
16
|
};
|
|
18
|
-
type PluginReactOptions = {
|
|
17
|
+
export type PluginReactOptions = {
|
|
19
18
|
/**
|
|
20
19
|
* Configure the behavior of SWC to transform React code,
|
|
21
20
|
* the same as SWC's [jsc.transform.react](https://swc.rs/docs/configuration/compilation#jsctransformreact).
|
|
@@ -34,9 +33,7 @@ type PluginReactOptions = {
|
|
|
34
33
|
* Options passed to `@rspack/plugin-react-refresh`
|
|
35
34
|
* @see https://rspack.dev/guide/tech/react#rspackplugin-react-refresh
|
|
36
35
|
*/
|
|
37
|
-
reactRefreshOptions?:
|
|
36
|
+
reactRefreshOptions?: ReactRefreshOptions;
|
|
38
37
|
};
|
|
39
|
-
declare const PLUGIN_REACT_NAME = "rsbuild:react";
|
|
40
|
-
declare const pluginReact: ({ enableProfiler, ...options }?: PluginReactOptions) => RsbuildPlugin;
|
|
41
|
-
|
|
42
|
-
export { PLUGIN_REACT_NAME, type PluginReactOptions, type SplitReactChunkOptions, pluginReact };
|
|
38
|
+
export declare const PLUGIN_REACT_NAME = "rsbuild:react";
|
|
39
|
+
export declare const pluginReact: ({ enableProfiler, ...options }?: PluginReactOptions) => RsbuildPlugin;
|
package/dist/index.js
CHANGED
|
@@ -9,16 +9,13 @@ var __require = /* @__PURE__ */ ((x) => typeof require !== "undefined" ? require
|
|
|
9
9
|
throw Error('Dynamic require of "' + x + '" is not supported');
|
|
10
10
|
});
|
|
11
11
|
|
|
12
|
-
// ../../node_modules/.pnpm/@modern-js+module-tools@2.
|
|
12
|
+
// ../../node_modules/.pnpm/@modern-js+module-tools@2.54.5_eslint@9.6.0_typescript@5.5.2/node_modules/@modern-js/module-tools/shims/esm.js
|
|
13
13
|
import { fileURLToPath } from "url";
|
|
14
14
|
import path from "path";
|
|
15
15
|
|
|
16
|
-
// src/index.ts
|
|
17
|
-
import { getNodeEnv } from "@rsbuild/shared";
|
|
18
|
-
|
|
19
16
|
// src/react.ts
|
|
20
17
|
import path2 from "path";
|
|
21
|
-
import { SCRIPT_REGEX, deepmerge
|
|
18
|
+
import { SCRIPT_REGEX, deepmerge } from "@rsbuild/shared";
|
|
22
19
|
var modifySwcLoaderOptions = ({
|
|
23
20
|
chain,
|
|
24
21
|
CHAIN_ID,
|
|
@@ -36,46 +33,51 @@ var modifySwcLoaderOptions = ({
|
|
|
36
33
|
};
|
|
37
34
|
var applyBasicReactSupport = (api, options) => {
|
|
38
35
|
const REACT_REFRESH_PATH = __require.resolve("react-refresh");
|
|
39
|
-
api.modifyBundlerChain(
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
36
|
+
api.modifyBundlerChain(
|
|
37
|
+
async (chain, { CHAIN_ID, environment, isDev, isProd, target }) => {
|
|
38
|
+
const { config } = environment;
|
|
39
|
+
const usingHMR = !isProd && config.dev.hmr && target === "web";
|
|
40
|
+
const reactOptions = {
|
|
41
|
+
development: isDev,
|
|
42
|
+
refresh: usingHMR,
|
|
43
|
+
runtime: "automatic",
|
|
44
|
+
...options.swcReactOptions
|
|
45
|
+
};
|
|
46
|
+
modifySwcLoaderOptions({
|
|
47
|
+
chain,
|
|
48
|
+
CHAIN_ID,
|
|
49
|
+
modifier: (opts) => {
|
|
50
|
+
const extraOptions = {
|
|
51
|
+
jsc: {
|
|
52
|
+
parser: {
|
|
53
|
+
syntax: "typescript",
|
|
54
|
+
// enable supports for React JSX/TSX compilation
|
|
55
|
+
tsx: true
|
|
56
|
+
},
|
|
57
|
+
transform: {
|
|
58
|
+
react: reactOptions
|
|
59
|
+
}
|
|
61
60
|
}
|
|
62
|
-
}
|
|
63
|
-
|
|
64
|
-
|
|
61
|
+
};
|
|
62
|
+
return deepmerge(opts, extraOptions);
|
|
63
|
+
}
|
|
64
|
+
});
|
|
65
|
+
if (!usingHMR) {
|
|
66
|
+
return;
|
|
65
67
|
}
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
68
|
+
chain.resolve.alias.set(
|
|
69
|
+
"react-refresh",
|
|
70
|
+
path2.dirname(REACT_REFRESH_PATH)
|
|
71
|
+
);
|
|
72
|
+
const { default: ReactRefreshRspackPlugin } = await import("@rspack/plugin-react-refresh");
|
|
73
|
+
chain.plugin(CHAIN_ID.PLUGIN.REACT_FAST_REFRESH).use(ReactRefreshRspackPlugin, [
|
|
74
|
+
{
|
|
75
|
+
include: [SCRIPT_REGEX],
|
|
76
|
+
...options.reactRefreshOptions
|
|
77
|
+
}
|
|
78
|
+
]);
|
|
69
79
|
}
|
|
70
|
-
|
|
71
|
-
const { default: ReactRefreshRspackPlugin } = await import("@rspack/plugin-react-refresh");
|
|
72
|
-
chain.plugin(CHAIN_ID.PLUGIN.REACT_FAST_REFRESH).use(ReactRefreshRspackPlugin, [
|
|
73
|
-
{
|
|
74
|
-
include: [SCRIPT_REGEX],
|
|
75
|
-
...options.reactRefreshOptions
|
|
76
|
-
}
|
|
77
|
-
]);
|
|
78
|
-
});
|
|
80
|
+
);
|
|
79
81
|
};
|
|
80
82
|
var applyReactProfiler = (api) => {
|
|
81
83
|
api.modifyRsbuildConfig((config, { mergeRsbuildConfig }) => {
|
|
@@ -101,13 +103,14 @@ var applyReactProfiler = (api) => {
|
|
|
101
103
|
};
|
|
102
104
|
|
|
103
105
|
// src/splitChunks.ts
|
|
104
|
-
import { createCacheGroups
|
|
106
|
+
import { createCacheGroups } from "@rsbuild/shared";
|
|
107
|
+
var isPlainObject = (obj) => obj !== null && typeof obj === "object" && Object.prototype.toString.call(obj) === "[object Object]";
|
|
105
108
|
var applySplitChunksRule = (api, options = {
|
|
106
109
|
react: true,
|
|
107
110
|
router: true
|
|
108
111
|
}) => {
|
|
109
|
-
api.modifyBundlerChain((chain) => {
|
|
110
|
-
const config =
|
|
112
|
+
api.modifyBundlerChain((chain, { environment }) => {
|
|
113
|
+
const { config } = environment;
|
|
111
114
|
if (config.performance.chunkSplit.strategy !== "split-by-experience") {
|
|
112
115
|
return;
|
|
113
116
|
}
|
|
@@ -121,7 +124,7 @@ var applySplitChunksRule = (api, options = {
|
|
|
121
124
|
"react",
|
|
122
125
|
"react-dom",
|
|
123
126
|
"scheduler",
|
|
124
|
-
...
|
|
127
|
+
...process.env.NODE_ENV === "production" ? [] : ["react-refresh", /@rspack[\\/]plugin-react-refresh/]
|
|
125
128
|
];
|
|
126
129
|
}
|
|
127
130
|
if (options.router) {
|
|
@@ -155,7 +158,7 @@ var pluginReact = ({
|
|
|
155
158
|
setup(api) {
|
|
156
159
|
if (api.context.bundlerType === "rspack") {
|
|
157
160
|
applyBasicReactSupport(api, options);
|
|
158
|
-
const isProdProfile = enableProfiler &&
|
|
161
|
+
const isProdProfile = enableProfiler && process.env.NODE_ENV === "production";
|
|
159
162
|
if (isProdProfile) {
|
|
160
163
|
applyReactProfiler(api);
|
|
161
164
|
}
|
package/dist/react.d.ts
ADDED
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
import type { RsbuildPluginAPI } from '@rsbuild/core';
|
|
2
|
+
import type { PluginReactOptions } from '.';
|
|
3
|
+
export declare const applyBasicReactSupport: (api: RsbuildPluginAPI, options: PluginReactOptions) => void;
|
|
4
|
+
export declare const applyReactProfiler: (api: RsbuildPluginAPI) => void;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@rsbuild/plugin-react",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "1.0.0-alpha.1",
|
|
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": "0.
|
|
25
|
+
"@rspack/plugin-react-refresh": "1.0.0-alpha.0",
|
|
26
26
|
"react-refresh": "^0.14.2",
|
|
27
|
-
"@rsbuild/shared": "0.
|
|
27
|
+
"@rsbuild/shared": "1.0.0-alpha.1"
|
|
28
28
|
},
|
|
29
29
|
"devDependencies": {
|
|
30
30
|
"@types/node": "18.x",
|
|
31
|
-
"typescript": "^5.
|
|
32
|
-
"@rsbuild/core": "0.
|
|
33
|
-
"@scripts/test-helper": "0.
|
|
31
|
+
"typescript": "^5.5.2",
|
|
32
|
+
"@rsbuild/core": "1.0.0-alpha.0",
|
|
33
|
+
"@scripts/test-helper": "1.0.0-alpha.1"
|
|
34
34
|
},
|
|
35
35
|
"peerDependencies": {
|
|
36
|
-
"@rsbuild/core": "^0.
|
|
36
|
+
"@rsbuild/core": "^1.0.0-alpha.1"
|
|
37
37
|
},
|
|
38
38
|
"publishConfig": {
|
|
39
39
|
"access": "public",
|