From ea98a1a1d257d235d3f12948d049c66e6a941362 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Fran=C3=A7ois=20Wouts?= <f@zenc.io>
Date: Tue, 24 Aug 2021 02:03:04 +1000
Subject: [PATCH] fix: enable failing dependencies to be optimised by
 pre-processing them with esbuild (#4275)

---
 packages/vite/src/node/optimizer/index.ts | 30 ++++++++++++++++++-----
 1 file changed, 24 insertions(+), 6 deletions(-)

diff --git a/packages/vite/src/node/optimizer/index.ts b/packages/vite/src/node/optimizer/index.ts
index aa618081a011c6..5b899b758ccd33 100644
--- a/packages/vite/src/node/optimizer/index.ts
+++ b/packages/vite/src/node/optimizer/index.ts
@@ -15,6 +15,7 @@ import {
 import { esbuildDepPlugin } from './esbuildDepPlugin'
 import { ImportSpecifier, init, parse } from 'es-module-lexer'
 import { scanImports } from './scan'
+import { transformWithEsbuild } from '../plugins/esbuild'
 
 const debug = createDebugger('vite:deps')
 
@@ -237,12 +238,32 @@ export async function optimizeDeps(
   const idToExports: Record<string, ExportsData> = {}
   const flatIdToExports: Record<string, ExportsData> = {}
 
+  const { plugins = [], ...esbuildOptions } =
+    config.optimizeDeps?.esbuildOptions ?? {}
+
   await init
   for (const id in deps) {
     const flatId = flattenId(id)
-    flatIdDeps[flatId] = deps[id]
-    const entryContent = fs.readFileSync(deps[id], 'utf-8')
-    const exportsData = parse(entryContent) as ExportsData
+    const filePath = (flatIdDeps[flatId] = deps[id])
+    const entryContent = fs.readFileSync(filePath, 'utf-8')
+    let exportsData: ExportsData
+    try {
+      exportsData = parse(entryContent) as ExportsData
+    } catch {
+      debug(
+        `Unable to parse dependency: ${id}. Trying again with a JSX transform.`
+      )
+      const transformed = await transformWithEsbuild(entryContent, filePath, {
+        loader: 'jsx'
+      })
+      // Ensure that optimization won't fail by defaulting '.js' to the JSX parser.
+      // This is useful for packages such as Gatsby.
+      esbuildOptions.loader = {
+        '.js': 'jsx',
+        ...esbuildOptions.loader
+      }
+      exportsData = parse(transformed.code) as ExportsData
+    }
     for (const { ss, se } of exportsData[0]) {
       const exp = entryContent.slice(ss, se)
       if (/export\s+\*\s+from/.test(exp)) {
@@ -263,9 +284,6 @@ export async function optimizeDeps(
 
   const start = Date.now()
 
-  const { plugins = [], ...esbuildOptions } =
-    config.optimizeDeps?.esbuildOptions ?? {}
-
   const result = await build({
     absWorkingDir: process.cwd(),
     entryPoints: Object.keys(flatIdDeps),