feat!: make package pure ESM

README.md

@@ -36,35 +36,38 @@ The enabling of the [Preact Refresh](https://github.com/preactjs/prefresh) is di
 > In versions below 1.0.0, Rspack did not support preact refresh with `swc-loader`.
 
 ```js
-const PreactRefreshPlugin = require("@rspack/plugin-preact-refresh");
-const isDev = process.env.NODE_ENV === "development";
+import { createRequire } from 'node:module';
+import PreactRefreshPlugin from '@rspack/plugin-preact-refresh';
 
-module.exports = {
+const require = createRequire(import.meta.url);
+const isDev = process.env.NODE_ENV === 'development';
+
+export default {
   // ...
-  mode: isDev ? "development" : "production",
+  mode: isDev ? 'development' : 'production',
   module: {
     rules: [
       {
         test: /\.jsx$/,
         // exclude node_modules to avoid dependencies transformed by `@swc/plugin-prefresh`
         exclude: /node_modules/,
         use: {
-          loader: "builtin:swc-loader",
+          loader: 'builtin:swc-loader',
           options: {
             jsc: {
               experimental: {
                 plugins: [
                   [
                     // enable prefresh specific transformation
-                    require.resolve("@swc/plugin-prefresh"),
+                    require.resolve('@swc/plugin-prefresh'),
                     {
-                      library: ["preact-like-framework"], // the customizable preact name, default is `["preact", "preact/compat", "react"]`
+                      library: ['preact-like-framework'], // the customizable preact name, default is `["preact", "preact/compat", "react"]`
                     },
                   ],
                 ],
               },
               parser: {
-                syntax: "ecmascript",
+                syntax: 'ecmascript',
                 jsx: true,
               },
               transform: {
@@ -114,15 +117,18 @@ new PreactRefreshPlugin({
 ### preactPath
 
 - Type: `string`
-- Default: `path.dirname(require.resolve('preact/package.json'))`
+- Default: `path.dirname(require.resolve("preact/package.json"))`
 
 Path to the `preact` package.
 
 ```js
-const path = require("node:path");
+import path from 'node:path';
+import { createRequire } from 'node:module';
+
+const require = createRequire(import.meta.url);
 
 new PreactRefreshPlugin({
-  preactPath: path.dirname(require.resolve("preact/package.json")),
+  preactPath: path.dirname(require.resolve('preact/package.json')),
 });
 ```
 

package.json

@@ -5,15 +5,15 @@
   "license": "MIT",
   "description": "Preact refresh plugin for Rspack",
   "type": "module",
-  "main": "index.cjs",
   "types": "dist/index.d.ts",
   "exports": {
     ".": {
       "types": "./dist/index.d.ts",
-      "import": "./dist/index.js",
-      "require": "./index.cjs"
+      "default": "./dist/index.js"
+    },
+    "./prefresh": {
+      "import": "./client/prefresh.js"
     },
-    "./prefresh": "./client/prefresh.js",
     "./package.json": "./package.json"
   },
   "scripts": {
@@ -28,8 +28,7 @@
   },
   "files": [
     "client",
-    "dist",
-    "index.cjs"
+    "dist"
   ],
   "simple-git-hooks": {
     "pre-commit": "npx nano-staged"

rslib.config.ts

@@ -1,8 +1,5 @@
 import { defineConfig } from '@rslib/core';
 
 export default defineConfig({
-  lib: [
-    { syntax: 'es2021', dts: true },
-    { format: 'cjs', syntax: 'es2021' },
-  ],
+  lib: [{ format: 'esm', syntax: 'es2023', dts: true }],
 });

test/configCases/condition/exclude/rspack.config.js

@@ -1,12 +1,16 @@
-const ReactRefreshRspackPlugin = require('../../../..');
+const {
+  default: ReactRefreshRspackPlugin,
+} = require('../../../../dist/index.js');
 
 /** @type {import('@rspack/core').Configuration} */
 module.exports = {
   mode: 'development',
   target: 'web',
   context: __dirname,
   entry: './index.js',
-  plugins: [new ReactRefreshRspackPlugin({
-    exclude: /file\.js/,
-  })],
+  plugins: [
+    new ReactRefreshRspackPlugin({
+      exclude: /file\.js/,
+    }),
+  ],
 };

test/configCases/condition/include/rspack.config.js

@@ -1,13 +1,17 @@
-const ReactRefreshRspackPlugin = require('../../../..');
+const {
+  default: ReactRefreshRspackPlugin,
+} = require('../../../../dist/index.js');
 
 /** @type {import('@rspack/core').Configuration} */
 module.exports = {
   mode: 'development',
   target: 'web',
   context: __dirname,
   entry: './index.js',
-  plugins: [new ReactRefreshRspackPlugin({
-    exclude: /$^/,  // match nothing
-    include: /foo/,
-  })],
+  plugins: [
+    new ReactRefreshRspackPlugin({
+      exclude: /$^/, // match nothing
+      include: /foo/,
+    }),
+  ],
 };

test/hotCases/hook/useContext_initial/rspack.config.js

@@ -1,4 +1,6 @@
-const ReactRefreshRspackPlugin = require('../../../..');
+const {
+  default: ReactRefreshRspackPlugin,
+} = require('../../../../dist/index.js');
 
 /** @type {import('@rspack/core').Configuration} */
 module.exports = {

test/hotCases/hook/useContext_keep/rspack.config.js

@@ -1,4 +1,6 @@
-const ReactRefreshRspackPlugin = require('../../../..');
+const {
+  default: ReactRefreshRspackPlugin,
+} = require('../../../../dist/index.js');
 
 /** @type {import('@rspack/core').Configuration} */
 module.exports = {

test/hotCases/hook/useContext_provide/rspack.config.js

@@ -1,4 +1,6 @@
-const ReactRefreshRspackPlugin = require('../../../..');
+const {
+  default: ReactRefreshRspackPlugin,
+} = require('../../../../dist/index.js');
 
 /** @type {import('@rspack/core').Configuration} */
 module.exports = {

test/hotCases/hook/useState_keep/rspack.config.js

@@ -1,4 +1,6 @@
-const ReactRefreshRspackPlugin = require('../../../..');
+const {
+  default: ReactRefreshRspackPlugin,
+} = require('../../../../dist/index.js');
 
 /** @type {import('@rspack/core').Configuration} */
 module.exports = {

test/hotCases/hook/useState_reset/rspack.config.js

@@ -1,4 +1,6 @@
-const ReactRefreshRspackPlugin = require('../../../..');
+const {
+  default: ReactRefreshRspackPlugin,
+} = require('../../../../dist/index.js');
 
 /** @type {import('@rspack/core').Configuration} */
 module.exports = {

test/hotCases/jsx/basic/rspack.config.js

@@ -1,4 +1,6 @@
-const ReactRefreshRspackPlugin = require('../../../..');
+const {
+  default: ReactRefreshRspackPlugin,
+} = require('../../../../dist/index.js');
 
 /** @type {import('@rspack/core').Configuration} */
 module.exports = {

test/hotCases/jsx/child/rspack.config.js

@@ -1,4 +1,6 @@
-const ReactRefreshRspackPlugin = require('../../../..');
+const {
+  default: ReactRefreshRspackPlugin,
+} = require('../../../../dist/index.js');
 
 /** @type {import('@rspack/core').Configuration} */
 module.exports = {

test/hotCases/jsx/value/rspack.config.js

@@ -1,4 +1,6 @@
-const ReactRefreshRspackPlugin = require('../../../..');
+const {
+  default: ReactRefreshRspackPlugin,
+} = require('../../../../dist/index.js');
 
 /** @type {import('@rspack/core').Configuration} */
 module.exports = {

test/hotCases/jsx/with-same-name-component/rspack.config.js

@@ -1,4 +1,6 @@
-const ReactRefreshRspackPlugin = require('../../../..');
+const {
+  default: ReactRefreshRspackPlugin,
+} = require('../../../../dist/index.js');
 
 /** @type {import('@rspack/core').Configuration} */
 module.exports = {

test/hotCases/with-worker/basic/rspack.config.js

@@ -1,4 +1,6 @@
-const ReactRefreshRspackPlugin = require('../../../..');
+const {
+  default: ReactRefreshRspackPlugin,
+} = require('../../../../dist/index.js');
 
 /** @type {import('@rspack/core').Configuration} */
 module.exports = {