fix: optimize-deps-dev

Author: underfin

packages/vite/src/node/optimizer/index.ts

@@ -24,12 +24,13 @@ import {
   tryStatSync,
   unique,
 } from '../utils'
-import {
-  transformWithEsbuild,
-} from '../plugins/esbuild'
+import { transformWithEsbuild } from '../plugins/esbuild'
 import { ESBUILD_MODULES_TARGET, METADATA_FILENAME } from '../constants'
 import { isWindows } from '../../shared/utils'
-import { rolldownCjsExternalPlugin, rolldownDepPlugin } from './rolldownDepPlugin'
+import {
+  rolldownCjsExternalPlugin,
+  rolldownDepPlugin,
+} from './rolldownDepPlugin'
 import { scanImports } from './scan'
 import { createOptimizeDepsIncludeResolver, expandGlobIds } from './resolve'
 export {
@@ -617,8 +618,7 @@ export function runOptimizeDeps(
             if (chunk.isEntry) {
               // One chunk maybe corresponding multiply entry
               const deps = Object.values(depsInfo).filter(
-                (d) =>
-                  d.src === chunk.facadeModuleId!,
+                (d) => d.src === chunk.facadeModuleId!,
               )
               for (const { exportsData, file, id, ...info } of deps) {
                 addOptimizedDepInfo(metadata, 'optimized', {
@@ -803,14 +803,15 @@ async function prepareRolldownOptimizerRun(
 
   async function build() {
     const bundle = await rolldown.rolldown({
-      input: Object.keys(flatIdDeps),
+      // TODO using Array input generate name is not expected, the entry name will be like index~1.js
+      input: flatIdDeps,
       // external,
       logLevel: 'warn',
       plugins,
       resolve: {
         mainFields: ['module', 'main'],
         aliasFields: [['browser']],
-        extensions: ['.js', '.css']
+        extensions: ['.js', '.css'],
       },
       ...rollupOptions,
     })
@@ -1037,13 +1038,16 @@ function stringifyDepsOptimizerMetadata(
               file,
               fileHash,
               needsInterop,
-              isDynamicEntry
+              isDynamicEntry,
             },
           ],
         ),
       ),
       chunks: Object.fromEntries(
-        Object.values(chunks).map(({ id, file, isDynamicEntry }) => [id, { file, isDynamicEntry }]),
+        Object.values(chunks).map(({ id, file, isDynamicEntry }) => [
+          id,
+          { file, isDynamicEntry },
+        ]),
       ),
     },
     (key: string, value: string) => {
@@ -1075,11 +1079,11 @@ export async function extractExportsData(
     const rolldownBuild = await rolldown.rolldown({
       ...rollupOptions,
       input: [filePath],
-    });
+    })
     const result = await rolldownBuild.generate({
       ...rollupOptions.output,
       format: 'esm',
-    });
+    })
     const [, exports, , hasModuleSyntax] = parse(result.output[0].code)
     return {
       hasModuleSyntax,
@@ -1350,4 +1354,4 @@ const safeRename = promisify(function gracefulRename(
     }
     if (cb) cb(er)
   })
-})
+})

packages/vite/src/node/plugins/resolve.ts

@@ -133,6 +133,7 @@ export function resolvePlugin(resolveOptions: InternalResolveOptions): Plugin {
   const {
     root,
     isProduction,
+    isBuild,
     asSrc,
     ssrConfig,
     preferRelative = false,
@@ -448,27 +449,42 @@ export function resolvePlugin(resolveOptions: InternalResolveOptions): Plugin {
 
     load(id) {
       if (id.startsWith(browserExternalId)) {
-        if (isProduction) {
-          // return `export default {}`
-          // The rolldown missing export is always error level, it will break build.
-          // So here using the cjs module to avoid it.
-          return `module.exports = {}`
+        if (isBuild) {
+          if (isProduction) {
+            // return `export default {}`
+            // The rolldown missing export is always error level, it will break build.
+            // So here using the cjs module to avoid it.
+            return `module.exports = {}`
+          } else {
+            id = id.slice(browserExternalId.length + 1)
+            // The rolldown using esbuild interop helper, so here copy the proxy module from https://github.com/vitejs/vite/blob/main/packages/vite/src/node/optimizer/esbuildDepPlugin.ts#L259-------
+            return `\
+  module.exports = Object.create(new Proxy({}, {
+    get(_, key) {
+      if (
+        key !== '__esModule' &&
+        key !== '__proto__' &&
+        key !== 'constructor' &&
+        key !== 'splice'
+      ) {
+        throw new Error(\`Module "${id}" has been externalized for browser compatibility. Cannot access "${id}.\${key}" in client code.  See https://vitejs.dev/guide/troubleshooting.html#module-externalized-for-browser-compatibility for more details.\`)
+      }
+    }
+  }))`
+          }
         } else {
-          id = id.slice(browserExternalId.length + 1)
-          // The rolldown using esbuild interop helper, so here copy the proxy module from https://github.com/vitejs/vite/blob/main/packages/vite/src/node/optimizer/esbuildDepPlugin.ts#L259-------
-          return `\
-module.exports = Object.create(new Proxy({}, {
-  get(_, key) {
-    if (
-      key !== '__esModule' &&
-      key !== '__proto__' &&
-      key !== 'constructor' &&
-      key !== 'splice'
-    ) {
+          // The dev need to return esm module.
+          if (isProduction) {
+            return `export default {}`
+          } else {
+            id = id.slice(browserExternalId.length + 1)
+            return `\
+  export default new Proxy({}, {
+    get(_, key) {
       throw new Error(\`Module "${id}" has been externalized for browser compatibility. Cannot access "${id}.\${key}" in client code.  See https://vitejs.dev/guide/troubleshooting.html#module-externalized-for-browser-compatibility for more details.\`)
     }
-  }
-}))`
+  })`
+          }
         }
       }
       if (id.startsWith(optionalPeerDepId)) {