fix(rsc): inject __vite_rsc_importer_resources import only once (#742)

Author: hi-ogawa

packages/plugin-rsc/e2e/starter.test.ts

@@ -1,7 +1,7 @@
 import { expect, test } from '@playwright/test'
-import { useFixture } from './fixture'
+import { setupInlineFixture, useFixture, type Fixture } from './fixture'
 import { defineStarterTest } from './starter'
-import { waitForHydration } from './helper'
+import { expectNoPageError, waitForHydration } from './helper'
 
 test.describe('dev-default', () => {
   const f = useFixture({ root: 'examples/starter', mode: 'dev' })
@@ -53,3 +53,44 @@ test.describe('build-development', () => {
     expect(output).toContain('jsxDEV')
   })
 })
+
+test.describe('duplicate loadCss', () => {
+  const root = 'examples/e2e/temp/duplicate-load-css'
+  test.beforeAll(async () => {
+    await setupInlineFixture({
+      src: 'examples/starter',
+      dest: root,
+      files: {
+        'src/root.tsx': {
+          edit: (s) =>
+            s.replace(
+              '</head>',
+              () =>
+                `\
+{import.meta.viteRsc.loadCss()}
+{import.meta.viteRsc.loadCss()}
+</head>`,
+            ),
+        },
+      },
+    })
+  })
+
+  test.describe('dev', () => {
+    const f = useFixture({ root, mode: 'dev' })
+    defineTest(f)
+  })
+
+  test.describe('build', () => {
+    const f = useFixture({ root, mode: 'build' })
+    defineTest(f)
+  })
+
+  function defineTest(f: Fixture) {
+    test('basic', async ({ page }) => {
+      using _ = expectNoPageError(page)
+      await page.goto(f.url())
+      await waitForHydration(page)
+    })
+  }
+})

packages/plugin-rsc/src/plugin.ts

@@ -1800,6 +1800,7 @@ export function vitePluginRscCss(
 
         assert(this.environment.name === 'rsc')
         const output = new MagicString(code)
+        let importAdded = false
 
         for (const match of code.matchAll(
           /import\.meta\.viteRsc\.loadCss\(([\s\S]*?)\)/dg,
@@ -1833,7 +1834,11 @@ export function vitePluginRscCss(
             })`
           } else {
             const hash = hashString(importId)
-            if (!code.includes(`__vite_rsc_importer_resources_${hash}`)) {
+            if (
+              !importAdded &&
+              !code.includes(`__vite_rsc_importer_resources_${hash}`)
+            ) {
+              importAdded = true
               output.prepend(
                 `import * as __vite_rsc_importer_resources_${hash} from ${JSON.stringify(
                   importId,