wip

Author: hi-ogawa

packages/plugin-rsc/examples/basic/src/routes/hmr-switch/client.tsx

@@ -5,7 +5,7 @@ import React from 'react'
 export function TestHmrSwitchClient() {
   return (
     <div data-testid="test-hmr-switch-client">
-      test-hmr-foo-switch-clietn (useState: {String(!!React.useState)})
+      test-hmr-switch-client (useState: {String(!!React.useState)})
     </div>
   )
 }

packages/plugin-rsc/examples/basic/src/routes/hmr-switch/server.tsx

@@ -3,7 +3,7 @@ import React from 'react'
 export function TestHmrSwitchServer() {
   return (
     <div data-testid="test-hmr-switch-server">
-      test-hmr-foo-switch-server (useState: {String(!!React.useState)})
+      test-hmr-switch-server (useState: {String(!!React.useState)})
     </div>
   )
 }

packages/plugin-rsc/src/plugin.ts

@@ -453,6 +453,7 @@ export default function vitePluginRsc(
         const ids = ctx.modules.map((mod) => mod.id).filter((v) => v !== null)
         if (ids.length === 0) return
 
+        // TODO: handle server<->client switch
         // a shared component/module will have `isInsideClientBoundary = false` on `rsc` environment
         // and `isInsideClientBoundary = true` on `client` environment,
         // which means both server hmr and client hmr will be triggered.
@@ -1009,10 +1010,16 @@ function vitePluginUseClient(
       name: 'rsc:use-client',
       async transform(code, id) {
         if (this.environment.name !== serverEnvironmentName) return
-        if (!code.includes('use client')) return
+        if (!code.includes('use client')) {
+          delete manager.clientReferenceMetaMap[id]
+          return
+        }
 
         const ast = await parseAstAsync(code)
-        if (!hasDirective(ast.body, 'use client')) return
+        if (!hasDirective(ast.body, 'use client')) {
+          delete manager.clientReferenceMetaMap[id]
+          return
+        }
 
         let importId: string
         let referenceKey: string
@@ -1083,7 +1090,6 @@ function vitePluginUseClient(
         })
         if (!result) return
         const { output, exportNames } = result
-        // TODO
         manager.clientReferenceMetaMap[id] = {
           importId,
           referenceKey,