diff --git a/packages/vite/src/node/__tests__/plugins/import.spec.ts b/packages/vite/src/node/__tests__/plugins/import.spec.ts index fb9ae3b132325c..38349ad2f59274 100644 --- a/packages/vite/src/node/__tests__/plugins/import.spec.ts +++ b/packages/vite/src/node/__tests__/plugins/import.spec.ts @@ -44,7 +44,7 @@ describe('transformCjsImport', () => { ), ).toBe( 'import __vite__cjsImport0_react from "./node_modules/.vite/deps/react.js"; ' + - 'const React = __vite__cjsImport0_react.__esModule ? __vite__cjsImport0_react.default : __vite__cjsImport0_react', + 'const React = __vite__cjsImport0_react.__esModule && Object.prototype.hasOwnProperty.call(__vite__cjsImport0_react, "default") ? __vite__cjsImport0_react.default : __vite__cjsImport0_react', ) expect( @@ -58,7 +58,7 @@ describe('transformCjsImport', () => { ), ).toBe( 'import __vite__cjsImport0_react from "./node_modules/.vite/deps/react.js"; ' + - 'const React = __vite__cjsImport0_react.__esModule ? __vite__cjsImport0_react.default : __vite__cjsImport0_react', + 'const React = __vite__cjsImport0_react.__esModule && Object.prototype.hasOwnProperty.call(__vite__cjsImport0_react, "default") ? __vite__cjsImport0_react.default : __vite__cjsImport0_react', ) }) @@ -74,7 +74,7 @@ describe('transformCjsImport', () => { ), ).toBe( 'import __vite__cjsImport0_react from "./node_modules/.vite/deps/react.js"; ' + - `const react = ((m) => m?.__esModule ? m : { ...typeof m === "object" && !Array.isArray(m) || typeof m === "function" ? m : {}, default: m })(__vite__cjsImport0_react)`, + `const react = ((m) => m?.__esModule && Object.prototype.hasOwnProperty.call(m, "default") ? m : { ...typeof m === "object" && !Array.isArray(m) || typeof m === "function" ? m : {}, default: m })(__vite__cjsImport0_react)`, ) }) @@ -154,7 +154,7 @@ describe('transformCjsImport', () => { ), ).toBe( 'import __vite__cjsImport0_react from "./node_modules/.vite/deps/react.js"; ' + - 'const __vite__cjsExportDefault_0 = __vite__cjsImport0_react.__esModule ? __vite__cjsImport0_react.default : __vite__cjsImport0_react; ' + + 'const __vite__cjsExportDefault_0 = __vite__cjsImport0_react.__esModule && Object.prototype.hasOwnProperty.call(__vite__cjsImport0_react, "default") ? __vite__cjsImport0_react.default : __vite__cjsImport0_react; ' + 'export default __vite__cjsExportDefault_0', ) @@ -169,7 +169,7 @@ describe('transformCjsImport', () => { ), ).toBe( 'import __vite__cjsImport0_react from "./node_modules/.vite/deps/react.js"; ' + - 'const __vite__cjsExport_React = __vite__cjsImport0_react.__esModule ? __vite__cjsImport0_react.default : __vite__cjsImport0_react; ' + + 'const __vite__cjsExport_React = __vite__cjsImport0_react.__esModule && Object.prototype.hasOwnProperty.call(__vite__cjsImport0_react, "default") ? __vite__cjsImport0_react.default : __vite__cjsImport0_react; ' + 'export { __vite__cjsExport_React as React }', ) diff --git a/packages/vite/src/node/plugins/importAnalysis.ts b/packages/vite/src/node/plugins/importAnalysis.ts index a4c1b9fd38a033..99b630823ae84c 100644 --- a/packages/vite/src/node/plugins/importAnalysis.ts +++ b/packages/vite/src/node/plugins/importAnalysis.ts @@ -845,7 +845,7 @@ export function createParseErrorInfo( } } // prettier-ignore -const interopHelper = (m: any) => m?.__esModule ? m : { ...(typeof m === 'object' && !Array.isArray(m) || typeof m === 'function' ? m : {}), default: m } +const interopHelper = (m: any) => m?.__esModule && Object.prototype.hasOwnProperty.call(m, 'default') ? m : { ...(typeof m === 'object' && !Array.isArray(m) || typeof m === 'function' ? m : {}), default: m } export function interopNamedImports( str: MagicString, @@ -1010,7 +1010,7 @@ export function transformCjsImport( ) } else if (importedName === 'default') { lines.push( - `const ${localName} = ${cjsModuleName}.__esModule ? ${cjsModuleName}.default : ${cjsModuleName}`, + `const ${localName} = ${cjsModuleName}.__esModule && Object.prototype.hasOwnProperty.call(${cjsModuleName}, "default") ? ${cjsModuleName}.default : ${cjsModuleName}`, ) } else { lines.push(`const ${localName} = ${cjsModuleName}["${importedName}"]`) diff --git a/playground/optimize-deps/cjs-dynamic.js b/playground/optimize-deps/cjs-dynamic.js index b75e4c2d0ba118..aa2585cc1b3647 100644 --- a/playground/optimize-deps/cjs-dynamic.js +++ b/playground/optimize-deps/cjs-dynamic.js @@ -28,6 +28,15 @@ text('.cjs-dynamic-dep-cjs-compiled-from-cjs', 'ok') } + const cjsWithEsModuleTag = await import( + '@vitejs/test-dep-cjs-with-es-module-flag' + ) + console.log('cjsWithEsModuleTag', cjsWithEsModuleTag) + text( + '.cjs-dynamic-dep-cjs-with-es-module-flag', + cjsWithEsModuleTag.default.info, + ) + function App() { const [count, setCount] = useState(0) diff --git a/playground/optimize-deps/cjs.js b/playground/optimize-deps/cjs.js index ba3e0aa783e69c..5d24ac52affe6e 100644 --- a/playground/optimize-deps/cjs.js +++ b/playground/optimize-deps/cjs.js @@ -5,7 +5,7 @@ import React, { useState } from 'react' import ReactDOM from 'react-dom/client' import { Socket } from 'phoenix' import clip from 'clipboard' - +import m from '@vitejs/test-dep-cjs-with-es-module-flag' // Test exporting a name that was already imported export { useState } from 'react' export { useState as anotherNameForUseState } from 'react' @@ -19,6 +19,8 @@ if (typeof Socket === 'function') { text('.cjs-phoenix', 'ok') } +text('.cjs-with-es-module-flag', m.info) + function App() { const [count, setCount] = useState(0) diff --git a/playground/optimize-deps/dep-cjs-with-es-module-flag/index.js b/playground/optimize-deps/dep-cjs-with-es-module-flag/index.js new file mode 100644 index 00000000000000..4b006a74d82270 --- /dev/null +++ b/playground/optimize-deps/dep-cjs-with-es-module-flag/index.js @@ -0,0 +1,4 @@ +module.exports = { + __esModule: true, + info: 'ok', +} diff --git a/playground/optimize-deps/dep-cjs-with-es-module-flag/package.json b/playground/optimize-deps/dep-cjs-with-es-module-flag/package.json new file mode 100644 index 00000000000000..d17358e7152afe --- /dev/null +++ b/playground/optimize-deps/dep-cjs-with-es-module-flag/package.json @@ -0,0 +1,5 @@ +{ + "name": "@vitejs/test-dep-cjs-with-es-module-flag", + "version": "1.0.0", + "main": "index.js" +} diff --git a/playground/optimize-deps/index.html b/playground/optimize-deps/index.html index 9b992b7dd4892a..01bf85354694fc 100644 --- a/playground/optimize-deps/index.html +++ b/playground/optimize-deps/index.html @@ -6,6 +6,8 @@

CommonJS w/ named imports (phoenix)

fail

CommonJS w/ default export (clipboard)

fail
+

CommonJS w/ default export (dep-cjs-with-es-module-flag)

+
fail
@@ -19,6 +21,8 @@

CommonJS dynamic import default (dep-cjs-compiled-from-esm)

CommonJS dynamic import default (dep-cjs-compiled-from-cjs)

+

CommonJS dynamic import default (dep-cjs-with-es-module-flag)

+
diff --git a/playground/optimize-deps/package.json b/playground/optimize-deps/package.json index e5f8d8a22dfcef..967e7bd8ecb93d 100644 --- a/playground/optimize-deps/package.json +++ b/playground/optimize-deps/package.json @@ -36,6 +36,7 @@ "@vitejs/test-dep-with-optional-peer-dep-submodule": "file:./dep-with-optional-peer-dep-submodule", "@vitejs/test-dep-non-optimized": "file:./dep-non-optimized", "@vitejs/test-added-in-entries": "file:./added-in-entries", + "@vitejs/test-dep-cjs-with-es-module-flag": "file:./dep-cjs-with-es-module-flag", "lodash-es": "^4.17.21", "@vitejs/test-nested-exclude": "file:./nested-exclude", "phoenix": "^1.7.11", diff --git a/playground/optimize-deps/vite.config.js b/playground/optimize-deps/vite.config.js index a2c2fdf3c6d5e7..c717db43324e32 100644 --- a/playground/optimize-deps/vite.config.js +++ b/playground/optimize-deps/vite.config.js @@ -22,6 +22,7 @@ export default defineConfig({ '@vitejs/test-dep-optimize-exports-with-glob/**/*', '@vitejs/test-dep-optimize-exports-with-root-glob/**/*.js', '@vitejs/test-dep-optimize-with-glob/**/*.js', + '@vitejs/test-dep-cjs-with-es-module-flag', ], exclude: ['@vitejs/test-nested-exclude', '@vitejs/test-dep-non-optimized'], esbuildOptions: { diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 603da0897e4f80..d90ce26caca168 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -906,6 +906,9 @@ importers: '@vitejs/test-dep-cjs-with-assets': specifier: file:./dep-cjs-with-assets version: file:playground/optimize-deps/dep-cjs-with-assets + '@vitejs/test-dep-cjs-with-es-module-flag': + specifier: file:./dep-cjs-with-es-module-flag + version: file:playground/optimize-deps/dep-cjs-with-es-module-flag '@vitejs/test-dep-css-require': specifier: file:./dep-css-require version: file:playground/optimize-deps/dep-css-require @@ -1027,6 +1030,8 @@ importers: playground/optimize-deps/dep-cjs-with-assets: {} + playground/optimize-deps/dep-cjs-with-es-module-flag: {} + playground/optimize-deps/dep-css-require: {} playground/optimize-deps/dep-esbuild-plugin-transform: {} @@ -10572,6 +10577,11 @@ packages: name: '@vitejs/test-dep-cjs-with-assets' dev: false + file:playground/optimize-deps/dep-cjs-with-es-module-flag: + resolution: {directory: playground/optimize-deps/dep-cjs-with-es-module-flag, type: directory} + name: '@vitejs/test-dep-cjs-with-es-module-flag' + dev: false + file:playground/optimize-deps/dep-css-require: resolution: {directory: playground/optimize-deps/dep-css-require, type: directory} name: '@vitejs/test-dep-css-require'