fix: avoid key collision in React refresh registration (fix #116)

ArnaudBarre · ArnaudBarre · commit 82b45c3dd9d2 · 2023-03-11T15:10:14.000+01:00
diff --git a/packages/plugin-react/src/refreshUtils.js b/packages/plugin-react/src/refreshUtils.js
@@ -25,7 +25,9 @@ function registerExportsForReactRefresh(filename, moduleExports) {
     if (key === '__esModule') continue
     const exportValue = moduleExports[key]
     if (exports.isLikelyComponentType(exportValue)) {
-      exports.register(exportValue, filename + ' ' + key)
+      // `export` is required to avoid key collision when renamed export shadow local component name
+      // https://github.com/vitejs/vite-plugin-react/issues/116
+      exports.register(exportValue, filename + ' export ' + key)
     }
   }
 }

Original file line number	Diff line number	Diff line change
`@@ -25,7 +25,9 @@ function registerExportsForReactRefresh(filename, moduleExports) {`
`25`	`25`	`if (key === '__esModule') continue`
`26`	`26`	`const exportValue = moduleExports[key]`
`27`	`27`	`if (exports.isLikelyComponentType(exportValue)) {`
`28`		`- exports.register(exportValue, filename + ' ' + key)`
	`28`	+ // `export` is required to avoid key collision when renamed export shadow local component name
	`29`	`+ // https://github.com/vitejs/vite-plugin-react/issues/116`
	`30`	`+ exports.register(exportValue, filename + ' export ' + key)`
`29`	`31`	`}`
`30`	`32`	`}`
`31`	`33`	`}`