fix

package.json

@@ -43,6 +43,7 @@
     "@rspack/core": "^0.4.2",
     "@rspack/dev-server": "^0.4.2",
     "@rspack/plugin-minify": "^0.4.2",
+    "@rspack/plugin-react-refresh": "^0.4.2",
     "@swc-node/register": "1.6.8",
     "@types/fs-extra": "^11.0.1",
     "@types/jest": "29.4.0",

packages/rspack/src/generators/init/init.ts

@@ -11,6 +11,7 @@ import {
   rspackDevServerVersion,
   rspackPluginMinifyVersion,
   lessLoaderVersion,
+  rspackPluginReactRefreshVersion,
 } from '../../utils/versions';
 import { InitGeneratorSchema } from './schema';
 
@@ -30,6 +31,7 @@ export async function rspackInitGenerator(
   const devDependencies = {
     '@rspack/core': rspackCoreVersion,
     '@rspack/plugin-minify': rspackPluginMinifyVersion,
+    '@rspack/plugin-react-refresh': rspackPluginReactRefreshVersion,
   };
 
   // eslint-disable-next-line @typescript-eslint/no-var-requires

packages/rspack/src/utils/versions.ts

@@ -2,6 +2,7 @@ export const rspackCoreVersion = '~0.4.2';
 export const rspackDevServerVersion = '~0.4.2';
 
 export const rspackPluginMinifyVersion = '~0.4.2';
+export const rspackPluginReactRefreshVersion = '~0.4.2';
 export const lessLoaderVersion = '~11.1.3';
 
 export const reactVersion = '~18.2.0';

packages/rspack/src/utils/with-react.ts

@@ -1,6 +1,7 @@
 import { Configuration } from '@rspack/core';
 import { SharedConfigContext } from './model';
 import { withWeb } from './with-web';
+import ReactRefreshPlugin from "@rspack/plugin-react-refresh";
 
 export function withReact(opts = {}) {
   return function makeConfig(
@@ -23,6 +24,10 @@ export function withReact(opts = {}) {
 
     return {
       ...config,
+      plugins: [
+        ...(config.plugins || []),
+        new ReactRefreshPlugin(),
+      ],
       module: {
         ...config.module,
         rules: [
@@ -36,9 +41,9 @@ export function withReact(opts = {}) {
                   syntax: 'ecmascript',
                   jsx: true,
                 },
-              },
-              transform: {
-                react,
+                transform: {
+                  react,
+                },
               },
             },
             type: 'javascript/auto',
@@ -50,11 +55,11 @@ export function withReact(opts = {}) {
               jsc: {
                 parser: {
                   syntax: 'typescript',
-                  jsx: true,
+                  tsx: true,
+                },
+                transform: {
+                  react,
                 },
-              },
-              transform: {
-                react,
               },
             },
             type: 'javascript/auto',

packages/rspack/src/utils/with-web.ts

@@ -51,7 +51,6 @@ export function withWeb(opts: WithWebOptions = {}) {
               jsc: {
                 parser: {
                   syntax: 'typescript',
-                  jsx: true,
                 },
               },
             },

packages/rspack/tsconfig.lib.json

@@ -4,6 +4,7 @@
     "resolveJsonModule": true,
     "outDir": "../../dist/out-tsc",
     "declaration": true,
+    "esModuleInterop": true,
     "types": ["node"]
   },
   "include": ["**/*.ts"],

yarn.lock

@@ -3771,7 +3771,7 @@
     terser "5.16.1"
     webpack-sources "3.2.3"
 
-"@rspack/plugin-react-refresh@0.4.2":
+"@rspack/plugin-react-refresh@0.4.2", "@rspack/plugin-react-refresh@^0.4.2":
   version "0.4.2"
   resolved "https://registry.yarnpkg.com/@rspack/plugin-react-refresh/-/plugin-react-refresh-0.4.2.tgz#82ee063ad1a5fe40c0459cec135783eea733e9ab"
   integrity sha512-NMEyODrRZKDjMsoj8H0g7IMUjBBWB9CtTc0LWRbAMTEPf1pat+aAlhbRxYys7TE1VyREg4cWH7ON0FAGbfh5MA==