Skip to content

Commit ead2dec

Browse files
authored
fix(dev): incorrect sourcemap when optimized CJS is imported (#20458)
1 parent e49f505 commit ead2dec

File tree

2 files changed

+46
-100
lines changed

2 files changed

+46
-100
lines changed

packages/vite/src/node/__tests__/plugins/import.spec.ts

Lines changed: 32 additions & 96 deletions
Original file line numberDiff line numberDiff line change
@@ -1,29 +1,39 @@
11
import { beforeEach, describe, expect, test, vi } from 'vitest'
22
import { transformCjsImport } from '../../plugins/importAnalysis'
33

4-
describe('transformCjsImport', () => {
5-
const url = './node_modules/.vite/deps/react.js'
6-
const rawUrl = 'react'
4+
describe('runTransform', () => {
75
const config: any = {
86
command: 'serve',
97
logger: {
108
warn: vi.fn(),
119
},
1210
}
1311

12+
function runTransformCjsImport(importExp: string) {
13+
const result = transformCjsImport(
14+
importExp,
15+
'./node_modules/.vite/deps/react.js',
16+
'react',
17+
0,
18+
'modA',
19+
config,
20+
)
21+
if (result !== undefined) {
22+
expect(result.split('\n').length, 'result line count').toBe(
23+
importExp.split('\n').length,
24+
)
25+
}
26+
return result
27+
}
28+
1429
beforeEach(() => {
1530
config.logger.warn.mockClear()
1631
})
1732

1833
test('import specifier', () => {
1934
expect(
20-
transformCjsImport(
35+
runTransformCjsImport(
2136
'import { useState, Component, "👋" as fake } from "react"',
22-
url,
23-
rawUrl,
24-
0,
25-
'',
26-
config,
2737
),
2838
).toBe(
2939
'import __vite__cjsImport0_react from "./node_modules/.vite/deps/react.js"; ' +
@@ -34,90 +44,44 @@ describe('transformCjsImport', () => {
3444
})
3545

3646
test('import default specifier', () => {
37-
expect(
38-
transformCjsImport(
39-
'import React from "react"',
40-
url,
41-
rawUrl,
42-
0,
43-
'',
44-
config,
45-
),
46-
).toBe(
47+
expect(runTransformCjsImport('import React from "react"')).toBe(
4748
'import __vite__cjsImport0_react from "./node_modules/.vite/deps/react.js"; ' +
4849
'const React = __vite__cjsImport0_react.__esModule ? __vite__cjsImport0_react.default : __vite__cjsImport0_react',
4950
)
5051

5152
expect(
52-
transformCjsImport(
53-
'import { default as React } from "react"',
54-
url,
55-
rawUrl,
56-
0,
57-
'',
58-
config,
59-
),
53+
runTransformCjsImport('import { default as React } from "react"'),
6054
).toBe(
6155
'import __vite__cjsImport0_react from "./node_modules/.vite/deps/react.js"; ' +
6256
'const React = __vite__cjsImport0_react.__esModule ? __vite__cjsImport0_react.default : __vite__cjsImport0_react',
6357
)
6458
})
6559

6660
test('import all specifier', () => {
67-
expect(
68-
transformCjsImport(
69-
'import * as react from "react"',
70-
url,
71-
rawUrl,
72-
0,
73-
'',
74-
config,
75-
),
76-
).toBe(
61+
expect(runTransformCjsImport('import * as react from "react"')).toBe(
7762
'import __vite__cjsImport0_react from "./node_modules/.vite/deps/react.js"; ' +
78-
`const react = ((m) => m?.__esModule ? m : { ...typeof m === "object" && !Array.isArray(m) || typeof m === "function" ? m : {}, default: m })(__vite__cjsImport0_react)`,
63+
`const react = ((m) => m?.__esModule ? m : { ...typeof m === "object" && !Array.isArray(m) || typeof m === "function" ? m : {}, default: m})(__vite__cjsImport0_react)`,
7964
)
8065
})
8166

8267
test('export all specifier', () => {
83-
expect(
84-
transformCjsImport(
85-
'export * from "react"',
86-
url,
87-
rawUrl,
88-
0,
89-
'modA',
90-
config,
91-
),
92-
).toBe(undefined)
68+
expect(runTransformCjsImport('export * from "react"')).toBe(undefined)
9369

9470
expect(config.logger.warn).toBeCalledWith(
9571
expect.stringContaining(`export * from "react"\` in modA`),
9672
)
9773

98-
expect(
99-
transformCjsImport(
100-
'export * as react from "react"',
101-
url,
102-
rawUrl,
103-
0,
104-
'',
105-
config,
106-
),
107-
).toBe(undefined)
74+
expect(runTransformCjsImport('export * as react from "react"')).toBe(
75+
undefined,
76+
)
10877

10978
expect(config.logger.warn).toBeCalledTimes(1)
11079
})
11180

11281
test('export name specifier', () => {
11382
expect(
114-
transformCjsImport(
83+
runTransformCjsImport(
11584
'export { useState, Component, "👋" } from "react"',
116-
url,
117-
rawUrl,
118-
0,
119-
'',
120-
config,
12185
),
12286
).toBe(
12387
'import __vite__cjsImport0_react from "./node_modules/.vite/deps/react.js"; ' +
@@ -128,13 +92,8 @@ describe('transformCjsImport', () => {
12892
)
12993

13094
expect(
131-
transformCjsImport(
95+
runTransformCjsImport(
13296
'export { useState as useStateAlias, Component as ComponentAlias, "👋" as "👍" } from "react"',
133-
url,
134-
rawUrl,
135-
0,
136-
'',
137-
config,
13897
),
13998
).toBe(
14099
'import __vite__cjsImport0_react from "./node_modules/.vite/deps/react.js"; ' +
@@ -146,45 +105,22 @@ describe('transformCjsImport', () => {
146105
})
147106

148107
test('export default specifier', () => {
149-
expect(
150-
transformCjsImport(
151-
'export { default } from "react"',
152-
url,
153-
rawUrl,
154-
0,
155-
'',
156-
config,
157-
),
158-
).toBe(
108+
expect(runTransformCjsImport('export { default } from "react"')).toBe(
159109
'import __vite__cjsImport0_react from "./node_modules/.vite/deps/react.js"; ' +
160110
'const __vite__cjsExportDefault_0 = __vite__cjsImport0_react.__esModule ? __vite__cjsImport0_react.default : __vite__cjsImport0_react; ' +
161111
'export default __vite__cjsExportDefault_0',
162112
)
163113

164114
expect(
165-
transformCjsImport(
166-
'export { default as React} from "react"',
167-
url,
168-
rawUrl,
169-
0,
170-
'',
171-
config,
172-
),
115+
runTransformCjsImport('export { default as React} from "react"'),
173116
).toBe(
174117
'import __vite__cjsImport0_react from "./node_modules/.vite/deps/react.js"; ' +
175118
'const __vite__cjsExportI_React = __vite__cjsImport0_react.__esModule ? __vite__cjsImport0_react.default : __vite__cjsImport0_react; ' +
176119
'export { __vite__cjsExportI_React as React }',
177120
)
178121

179122
expect(
180-
transformCjsImport(
181-
'export { Component as default } from "react"',
182-
url,
183-
rawUrl,
184-
0,
185-
'',
186-
config,
187-
),
123+
runTransformCjsImport('export { Component as default } from "react"'),
188124
).toBe(
189125
'import __vite__cjsImport0_react from "./node_modules/.vite/deps/react.js"; ' +
190126
'const __vite__cjsExportDefault_0 = __vite__cjsImport0_react["Component"]; ' +

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

Lines changed: 14 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -897,8 +897,18 @@ export function createParseErrorInfo(
897897
showCodeFrame: !probablyBinary,
898898
}
899899
}
900-
// prettier-ignore
901-
const interopHelper = (m: any) => m?.__esModule ? m : { ...(typeof m === 'object' && !Array.isArray(m) || typeof m === 'function' ? m : {}), default: m }
900+
901+
const interopHelper = (m: any) =>
902+
m?.__esModule
903+
? m
904+
: {
905+
...((typeof m === 'object' && !Array.isArray(m)) ||
906+
typeof m === 'function'
907+
? m
908+
: {}),
909+
default: m,
910+
}
911+
const interopHelperStr = interopHelper.toString().replaceAll('\n', '')
902912

903913
export function interopNamedImports(
904914
str: MagicString,
@@ -922,7 +932,7 @@ export function interopNamedImports(
922932
str.overwrite(
923933
expStart,
924934
expEnd,
925-
`import('${rewrittenUrl}').then(m => (${interopHelper.toString()})(m.default))` +
935+
`import('${rewrittenUrl}').then(m => (${interopHelperStr})(m.default))` +
926936
getLineBreaks(exp),
927937
{ contentOnly: true },
928938
)
@@ -1058,7 +1068,7 @@ export function transformCjsImport(
10581068
importNames.forEach(({ importedName, localName }) => {
10591069
if (importedName === '*') {
10601070
lines.push(
1061-
`const ${localName} = (${interopHelper.toString()})(${cjsModuleName})`,
1071+
`const ${localName} = (${interopHelperStr})(${cjsModuleName})`,
10621072
)
10631073
} else if (importedName === 'default') {
10641074
lines.push(

0 commit comments

Comments
 (0)