Merge branch 'main' into 09-17-ci_use_trusted_publisher

Author: hi-ogawa

packages/plugin-react-oxc/CHANGELOG.md

@@ -2,6 +2,8 @@
 
 ## Unreleased
 
+## 0.4.2 (2025-09-17)
+
 ### Perf: simplify refresh wrapper generation ([#835](https://github.com/vitejs/vite-plugin-react/pull/835))
 
 ## 0.4.1 (2025-08-19)

packages/plugin-react-oxc/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vitejs/plugin-react-oxc",
-  "version": "0.4.1",
+  "version": "0.4.2",
   "license": "MIT",
   "author": "Evan You",
   "contributors": [

packages/plugin-react-swc/CHANGELOG.md

@@ -2,6 +2,8 @@
 
 ## Unreleased
 
+## 4.1.0 (2025-09-17)
+
 ### Set SWC cacheRoot options
 
 This is set to `{viteCacheDir}/swc` and override the default of `.swc`.

packages/plugin-react-swc/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vitejs/plugin-react-swc",
-  "version": "4.0.1",
+  "version": "4.1.0",
   "license": "MIT",
   "author": "Arnaud Barré (https://github.com/ArnaudBarre)",
   "description": "Speed up your Vite dev server with SWC",

packages/plugin-react/CHANGELOG.md

@@ -2,6 +2,10 @@
 
 ## Unreleased
 
+## 5.0.3 (2025-09-17)
+
+### HMR did not work for components imported with queries with rolldown-vite ([#872](https://github.com/vitejs/vite-plugin-react/pull/872))
+
 ### Perf: simplify refresh wrapper generation ([#835](https://github.com/vitejs/vite-plugin-react/pull/835))
 
 ## 5.0.2 (2025-08-28)

packages/plugin-react/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vitejs/plugin-react",
-  "version": "5.0.2",
+  "version": "5.0.3",
   "license": "MIT",
   "author": "Evan You",
   "description": "The default Vite plugin for React projects",

packages/plugin-react/src/index.ts

@@ -144,8 +144,8 @@ export default function viteReact(opts: Options = {}): Plugin[] {
                 // if development is enabled and those properties are already present
                 development: false,
               },
-              jsxRefreshInclude: include,
-              jsxRefreshExclude: exclude,
+              jsxRefreshInclude: makeIdFiltersToMatchWithQuery(include),
+              jsxRefreshExclude: makeIdFiltersToMatchWithQuery(exclude),
             },
           }
         } else {
@@ -156,8 +156,8 @@ export default function viteReact(opts: Options = {}): Plugin[] {
                 importSource: opts.jsxImportSource,
                 refresh: command === 'serve',
               },
-              jsxRefreshInclude: include,
-              jsxRefreshExclude: exclude,
+              jsxRefreshInclude: makeIdFiltersToMatchWithQuery(include),
+              jsxRefreshExclude: makeIdFiltersToMatchWithQuery(exclude),
             },
             optimizeDeps: {
               rollupOptions: { transform: { jsx: { runtime: 'automatic' } } },

playground/react-classic/App.jsx

@@ -1,4 +1,5 @@
 import React, { useState } from 'react'
+import WithQuery from './components/WithQuery?qs-should-not-break-plugin-react'
 
 function App() {
   const [count, setCount] = useState(0)
@@ -23,6 +24,8 @@ function App() {
           Learn React
         </a>
       </header>
+
+      <WithQuery />
     </div>
   )
 }

playground/react-classic/__tests__/react.spec.ts

@@ -18,6 +18,28 @@ test.runIf(isServe)('should hmr', async () => {
   expect(await page.textContent('button')).toMatch('count is: 1')
 })
 
+test.runIf(isServe)('should hmr files with queries', async () => {
+  expect(await page.textContent('#WithQuery')).toBe('With Query')
+
+  expect(await page.textContent('#WithQuery-button')).toMatch('count is: 0')
+  await page.click('#WithQuery-button')
+  expect(await page.textContent('#WithQuery-button')).toMatch('count is: 1')
+
+  editFile('components/WithQuery.jsx', (code) =>
+    code.replace('With Query', 'With Query Updated'),
+  )
+  await expect
+    .poll(() => page.textContent('#WithQuery'))
+    .toBe('With Query Updated')
+  // preserve state
+  expect(await page.textContent('#WithQuery-button')).toMatch('count is: 1')
+
+  editFile('components/WithQuery.jsx', (code) =>
+    code.replace('With Query Updated', 'With Query'),
+  )
+  await expect.poll(() => page.textContent('#WithQuery')).toBe('With Query')
+})
+
 test.runIf(isServe)(
   'should have annotated jsx with file location metadata',
   async () => {

playground/react-classic/components/WithQuery.jsx

@@ -0,0 +1,16 @@
+import React, { useState } from 'react'
+
+export default function WithQuery() {
+  const [count, setCount] = useState(0)
+  return (
+    <>
+      <div id="WithQuery">With Query</div>
+      <button
+        id="WithQuery-button"
+        onClick={() => setCount((count) => count + 1)}
+      >
+        count is: {count}
+      </button>
+    </>
+  )
+}