fix(react): unlimited init order when using with react plugin

fix #148
qmhc · Feb 23, 2023 · 92b82ff · 92b82ff
1 parent 42a755c
commit 92b82ff
Show file tree

Hide file tree

Showing 7 changed files with 13 additions and 30 deletions.
diff --git a/examples/react/.gitignore b/examples/react/.gitignore
@@ -0,0 +1,3 @@
+types/
+dist/
+node_modules/
diff --git a/examples/react/types/index.d.ts b/examples/react/types/index.d.ts
diff --git a/examples/react/types/main.d.ts b/examples/react/types/main.d.ts
diff --git a/examples/react/types/vite-env.d.ts b/examples/react/types/vite-env.d.ts
diff --git a/examples/react/vite.config.ts b/examples/react/vite.config.ts
@@ -21,6 +21,7 @@ export default defineConfig({
     }
   },
   plugins: [
+    react(),
     dts({
       libFolderPath: '../../node_modules/typescript/lib',
       outputDir: ['dist', 'types'],
@@ -31,8 +32,7 @@ export default defineConfig({
       skipDiagnostics: false,
       rollupTypes: true,
       insertTypesEntry: true
-    }),
-    react()
+    })
   ]
 })
 

diff --git a/examples/ts/.gitignore b/examples/ts/.gitignore
@@ -1,4 +1,3 @@
 types/
 dist/
 node_modules/
-components/*.d.ts
diff --git a/src/plugin.ts b/src/plugin.ts
@@ -95,13 +95,15 @@ export function dtsPlugin(options: PluginOptions = {}): import('vite').Plugin {
   let allowJs = false
   let transformError = false
 
-  function internalTransform(code: string, id: string) {
+  async function internalTransform(id: string) {
     if (!project || !filter(id)) {
       return
     }
 
+    // some plugins (e.g. @vitejs/plugin-react) sorted before dts plugin may change
+    // source code when building, so we need to read the original content via the id
     if (vueRE.test(id)) {
-      const { error, content, ext } = compileVueCode(code)
+      const { error, content, ext } = compileVueCode(await fs.readFile(id, 'utf-8'))
 
       if (!transformError && error) {
         logger.error(
@@ -121,7 +123,7 @@ export function dtsPlugin(options: PluginOptions = {}): import('vite').Plugin {
         project.createSourceFile(`${id}.${ext || 'js'}`, content, { overwrite: true })
       }
     } else if (!id.includes('.vue?vue') && (tsRE.test(id) || (allowJs && jsRE.test(id)))) {
-      project.createSourceFile(id, code, { overwrite: true })
+      project.createSourceFile(id, await fs.readFile(id, 'utf-8'), { overwrite: true })
     }
   }
 
@@ -335,8 +337,8 @@ export function dtsPlugin(options: PluginOptions = {}): import('vite').Plugin {
       }
     },
 
-    transform(code, id) {
-      internalTransform(code, id)
+    async transform(_, id) {
+      await internalTransform(id)
       return null
     },
 
@@ -348,7 +350,7 @@ export function dtsPlugin(options: PluginOptions = {}): import('vite').Plugin {
           const sourceFile = project.getSourceFile(normalizePath(id))
 
           sourceFile && project.removeSourceFile(sourceFile)
-          internalTransform(await fs.readFile(id, 'utf-8'), id)
+          await internalTransform(id)
         }
       }
     },