Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
22 changes: 20 additions & 2 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -36,7 +36,6 @@ Import the plugin in your code:
```js
// Named import (recommended)
import { ReactRefreshRspackPlugin } from "@rspack/plugin-react-refresh";

```

- CommonJS:
Expand Down Expand Up @@ -101,12 +100,31 @@ Compared to the previous approach, this method decouples the React Fast Refresh

## Options

### test

- Type: [Rspack.RuleSetCondition](https://rspack.dev/config/module#condition)
- Default: `undefined`

Specifies which files should be processed by the React Refresh loader. This option is passed to the `builtin:react-refresh-loader` as the `rule.test` condition.

Works identically to Rspack's [rule.test](https://rspack.dev/config/module#ruletest) option.

```js
new ReactRefreshPlugin({
test: [/\.jsx$/, /\.tsx$/],
});
```

### include

- Type: [Rspack.RuleSetCondition](https://rspack.dev/config/module#condition)
- Default: `/\.([cm]js|[jt]sx?|flow)$/i`

Include files to be processed by the plugin. The value is the same as the [rule.test](https://rspack.dev/config/module#ruletest) option in Rspack.
Explicitly includes files to be processed by the React Refresh loader. This option is passed to the `builtin:react-refresh-loader` as the `rule.include` condition.

Use this to limit processing to specific directories or file patterns.

Works identically to Rspack's [rule.include](https://rspack.dev/config/module#ruleinclude) option.

```js
new ReactRefreshPlugin({
Expand Down
1 change: 1 addition & 0 deletions src/index.ts
Original file line number Diff line number Diff line change
Expand Up @@ -80,6 +80,7 @@ class ReactRefreshRspackPlugin {

if (this.options.injectLoader) {
compiler.options.module.rules.unshift({
test: this.options.test,
// biome-ignore lint: exists
include: this.options.include!,
exclude: {
Expand Down
15 changes: 12 additions & 3 deletions src/options.ts
Original file line number Diff line number Diff line change
Expand Up @@ -13,11 +13,20 @@ interface OverlayOptions {

export type PluginOptions = {
/**
* Include files to be processed by the plugin.
* The value is the same as the `rule.test` option in Rspack.
* @default /\.([cm]js|[jt]sx?|flow)$/i
* Specifies which files should be processed by the React Refresh loader.
* This option is passed to the `builtin:react-refresh-loader` as the `rule.test` condition.
* Works identically to Rspack's `rule.test` option.
* @see https://rspack.dev/config/module#ruletest
*/
test?: RuleSetCondition;
/**
* Explicitly includes files to be processed by the React Refresh loader.
* This option is passed to the `builtin:react-refresh-loader` as the `rule.include` condition.
* Use this to limit processing to specific directories or file patterns.
* Works identically to Rspack's `rule.include` option.
* @default /\.([cm]js|[jt]sx?|flow)$/i
* @see https://rspack.dev/config/module#ruleinclude
*/
include?: RuleSetCondition | null;
/**
* Exclude files from being processed by the plugin.
Expand Down
15 changes: 15 additions & 0 deletions test/test.spec.ts
Original file line number Diff line number Diff line change
Expand Up @@ -128,6 +128,21 @@ describe('react-refresh-rspack-plugin', () => {
);
});

it('should test selected file when compiling', (done) => {
compileWithReactRefresh(
path.join(__dirname, 'fixtures/custom'),
{
exclude: null,
test: path.join(__dirname, 'fixtures/node_modules/foo'),
include: null,
},
(_, __, { vendor }) => {
expect(vendor).toContain('function $RefreshReg$');
done();
},
);
});

it('should include selected file when compiling', (done) => {
compileWithReactRefresh(
path.join(__dirname, 'fixtures/custom'),
Expand Down