diff --git a/packages/vite/src/node/optimizer/index.ts b/packages/vite/src/node/optimizer/index.ts
index 7a2048098ffe12..4c3e538393efe1 100644
--- a/packages/vite/src/node/optimizer/index.ts
+++ b/packages/vite/src/node/optimizer/index.ts
@@ -270,6 +270,9 @@ export async function optimizeDeps(
     splitting: true,
     sourcemap: true,
     outdir: cacheDir,
+    outExtension: {
+      '.js': '.mjs'
+    },
     treeShaking: 'ignore-annotations',
     metafile: true,
     define,
@@ -288,7 +291,7 @@ export async function optimizeDeps(
   for (const id in deps) {
     const entry = deps[id]
     data.optimized[id] = {
-      file: normalizePath(path.resolve(cacheDir, flattenId(id) + '.js')),
+      file: normalizePath(path.resolve(cacheDir, flattenId(id) + '.mjs')),
       src: entry,
       needsInterop: needsInterop(
         id,
@@ -328,7 +331,7 @@ function needsInterop(
   // if a peer dependency used require() on a ESM dependency, esbuild turns the
   // ESM dependency's entry chunk into a single default export... detect
   // such cases by checking exports mismatch, and force interop.
-  const flatId = flattenId(id) + '.js'
+  const flatId = flattenId(id) + '.mjs'
   let generatedExports: string[] | undefined
   for (const output in outputs) {
     if (