From 1566f6141a75cdbd6f33b0cc999611314e5af8ec Mon Sep 17 00:00:00 2001 From: patak Date: Sun, 26 Jun 2022 15:41:20 +0200 Subject: [PATCH] perf: avoid sourcemap chains during dev (#8796) Co-authored-by: yoho --- .../__snapshots__/fixture.test.ts.snap | 184 ++--------- .../src/node/plugins/assetImportMetaUrl.ts | 4 +- packages/vite/src/node/plugins/define.ts | 8 +- .../src/node/plugins/dynamicImportVars.ts | 4 +- .../vite/src/node/plugins/importAnalysis.ts | 4 +- .../vite/src/node/plugins/importMetaGlob.ts | 8 +- .../src/node/plugins/workerImportMetaUrl.ts | 4 +- packages/vite/src/node/utils.ts | 13 +- .../__snapshots__/serve.spec.ts.snap | 312 +++++++++++++++++- .../vue-sourcemap/__tests__/serve.spec.ts | 309 +---------------- .../sourcemap-worker.spec.ts.snap | 14 - .../sourcemap/sourcemap-worker.spec.ts | 19 +- 12 files changed, 378 insertions(+), 505 deletions(-) delete mode 100644 playground/worker/__tests__/sourcemap/__snapshots__/sourcemap-worker.spec.ts.snap diff --git a/packages/vite/src/node/__tests__/plugins/importGlob/__snapshots__/fixture.test.ts.snap b/packages/vite/src/node/__tests__/plugins/importGlob/__snapshots__/fixture.test.ts.snap index 4dc2f50a8f881d..3efbb7a0306f86 100644 --- a/packages/vite/src/node/__tests__/plugins/importGlob/__snapshots__/fixture.test.ts.snap +++ b/packages/vite/src/node/__tests__/plugins/importGlob/__snapshots__/fixture.test.ts.snap @@ -1,164 +1,44 @@ // Vitest Snapshot v1 exports[`fixture > transform 1`] = ` -"import * as __vite_glob_1_0 from \\"./modules/a.ts\\" -import * as __vite_glob_1_1 from \\"./modules/b.ts\\" -import * as __vite_glob_1_2 from \\"./modules/index.ts\\" -import { name as __vite_glob_3_0 } from \\"./modules/a.ts\\" -import { name as __vite_glob_3_1 } from \\"./modules/b.ts\\" -import { name as __vite_glob_3_2 } from \\"./modules/index.ts\\" -import { default as __vite_glob_5_0 } from \\"./modules/a.ts?raw\\" -import { default as __vite_glob_5_1 } from \\"./modules/b.ts?raw\\" -import \\"../../../../../../types/importMeta\\"; -export const basic = Object.assign({ -\\"./modules/a.ts\\": () => import(\\"./modules/a.ts\\"), -\\"./modules/b.ts\\": () => import(\\"./modules/b.ts\\"), -\\"./modules/index.ts\\": () => import(\\"./modules/index.ts\\") -}); -export const basicEager = Object.assign({ -\\"./modules/a.ts\\": __vite_glob_1_0, -\\"./modules/b.ts\\": __vite_glob_1_1, -\\"./modules/index.ts\\": __vite_glob_1_2 -}); -export const ignore = Object.assign({ -\\"./modules/a.ts\\": () => import(\\"./modules/a.ts\\"), -\\"./modules/b.ts\\": () => import(\\"./modules/b.ts\\") -}); -export const namedEager = Object.assign({ -\\"./modules/a.ts\\": __vite_glob_3_0, -\\"./modules/b.ts\\": __vite_glob_3_1, -\\"./modules/index.ts\\": __vite_glob_3_2 -}); -export const namedDefault = Object.assign({ -\\"./modules/a.ts\\": () => import(\\"./modules/a.ts\\").then(m => m[\\"default\\"]), -\\"./modules/b.ts\\": () => import(\\"./modules/b.ts\\").then(m => m[\\"default\\"]), -\\"./modules/index.ts\\": () => import(\\"./modules/index.ts\\").then(m => m[\\"default\\"]) -}); -export const eagerAs = Object.assign({ -\\"./modules/a.ts\\": __vite_glob_5_0, -\\"./modules/b.ts\\": __vite_glob_5_1 -}); -export const rawImportModule = Object.assign({ -\\"./modules/a.ts\\": () => import(\\"./modules/a.ts?raw\\"), -\\"./modules/b.ts\\": () => import(\\"./modules/b.ts?raw\\") -}); -export const excludeSelf = Object.assign({ -\\"./sibling.ts\\": () => import(\\"./sibling.ts\\") -}); -export const customQueryString = Object.assign({ -\\"./sibling.ts\\": () => import(\\"./sibling.ts?custom\\") -}); -export const customQueryObject = Object.assign({ -\\"./sibling.ts\\": () => import(\\"./sibling.ts?foo=bar&raw=true\\") -}); -export const parent = Object.assign({ - -}); -export const rootMixedRelative = Object.assign({ -\\"/css.spec.ts\\": () => import(\\"../../css.spec.ts?url\\").then(m => m[\\"default\\"]), -\\"/define.spec.ts\\": () => import(\\"../../define.spec.ts?url\\").then(m => m[\\"default\\"]), -\\"/esbuild.spec.ts\\": () => import(\\"../../esbuild.spec.ts?url\\").then(m => m[\\"default\\"]), -\\"/import.spec.ts\\": () => import(\\"../../import.spec.ts?url\\").then(m => m[\\"default\\"]), -\\"/importGlob/fixture-b/a.ts\\": () => import(\\"../fixture-b/a.ts?url\\").then(m => m[\\"default\\"]), -\\"/importGlob/fixture-b/b.ts\\": () => import(\\"../fixture-b/b.ts?url\\").then(m => m[\\"default\\"]), -\\"/importGlob/fixture-b/index.ts\\": () => import(\\"../fixture-b/index.ts?url\\").then(m => m[\\"default\\"]) -}); -export const cleverCwd1 = Object.assign({ -\\"./node_modules/framework/pages/hello.page.js\\": () => import(\\"./node_modules/framework/pages/hello.page.js\\") -}); -export const cleverCwd2 = Object.assign({ -\\"./modules/a.ts\\": () => import(\\"./modules/a.ts\\"), -\\"./modules/b.ts\\": () => import(\\"./modules/b.ts\\"), -\\"../fixture-b/a.ts\\": () => import(\\"../fixture-b/a.ts\\"), -\\"../fixture-b/b.ts\\": () => import(\\"../fixture-b/b.ts\\") -}); +"import * as __vite_glob_1_0 from \\"./modules/a.ts\\";import * as __vite_glob_1_1 from \\"./modules/b.ts\\";import * as __vite_glob_1_2 from \\"./modules/index.ts\\";import { name as __vite_glob_3_0 } from \\"./modules/a.ts\\";import { name as __vite_glob_3_1 } from \\"./modules/b.ts\\";import { name as __vite_glob_3_2 } from \\"./modules/index.ts\\";import { default as __vite_glob_5_0 } from \\"./modules/a.ts?raw\\";import { default as __vite_glob_5_1 } from \\"./modules/b.ts?raw\\";import \\"../../../../../../types/importMeta\\"; +export const basic = Object.assign({\\"./modules/a.ts\\": () => import(\\"./modules/a.ts\\"),\\"./modules/b.ts\\": () => import(\\"./modules/b.ts\\"),\\"./modules/index.ts\\": () => import(\\"./modules/index.ts\\")}); +export const basicEager = Object.assign({\\"./modules/a.ts\\": __vite_glob_1_0,\\"./modules/b.ts\\": __vite_glob_1_1,\\"./modules/index.ts\\": __vite_glob_1_2}); +export const ignore = Object.assign({\\"./modules/a.ts\\": () => import(\\"./modules/a.ts\\"),\\"./modules/b.ts\\": () => import(\\"./modules/b.ts\\")}); +export const namedEager = Object.assign({\\"./modules/a.ts\\": __vite_glob_3_0,\\"./modules/b.ts\\": __vite_glob_3_1,\\"./modules/index.ts\\": __vite_glob_3_2}); +export const namedDefault = Object.assign({\\"./modules/a.ts\\": () => import(\\"./modules/a.ts\\").then(m => m[\\"default\\"]),\\"./modules/b.ts\\": () => import(\\"./modules/b.ts\\").then(m => m[\\"default\\"]),\\"./modules/index.ts\\": () => import(\\"./modules/index.ts\\").then(m => m[\\"default\\"])}); +export const eagerAs = Object.assign({\\"./modules/a.ts\\": __vite_glob_5_0,\\"./modules/b.ts\\": __vite_glob_5_1}); +export const rawImportModule = Object.assign({\\"./modules/a.ts\\": () => import(\\"./modules/a.ts?raw\\"),\\"./modules/b.ts\\": () => import(\\"./modules/b.ts?raw\\")}); +export const excludeSelf = Object.assign({\\"./sibling.ts\\": () => import(\\"./sibling.ts\\")}); +export const customQueryString = Object.assign({\\"./sibling.ts\\": () => import(\\"./sibling.ts?custom\\")}); +export const customQueryObject = Object.assign({\\"./sibling.ts\\": () => import(\\"./sibling.ts?foo=bar&raw=true\\")}); +export const parent = Object.assign({}); +export const rootMixedRelative = Object.assign({\\"/css.spec.ts\\": () => import(\\"../../css.spec.ts?url\\").then(m => m[\\"default\\"]),\\"/define.spec.ts\\": () => import(\\"../../define.spec.ts?url\\").then(m => m[\\"default\\"]),\\"/esbuild.spec.ts\\": () => import(\\"../../esbuild.spec.ts?url\\").then(m => m[\\"default\\"]),\\"/import.spec.ts\\": () => import(\\"../../import.spec.ts?url\\").then(m => m[\\"default\\"]),\\"/importGlob/fixture-b/a.ts\\": () => import(\\"../fixture-b/a.ts?url\\").then(m => m[\\"default\\"]),\\"/importGlob/fixture-b/b.ts\\": () => import(\\"../fixture-b/b.ts?url\\").then(m => m[\\"default\\"]),\\"/importGlob/fixture-b/index.ts\\": () => import(\\"../fixture-b/index.ts?url\\").then(m => m[\\"default\\"])}); +export const cleverCwd1 = Object.assign({\\"./node_modules/framework/pages/hello.page.js\\": () => import(\\"./node_modules/framework/pages/hello.page.js\\")}); +export const cleverCwd2 = Object.assign({\\"./modules/a.ts\\": () => import(\\"./modules/a.ts\\"),\\"./modules/b.ts\\": () => import(\\"./modules/b.ts\\"),\\"../fixture-b/a.ts\\": () => import(\\"../fixture-b/a.ts\\"),\\"../fixture-b/b.ts\\": () => import(\\"../fixture-b/b.ts\\")}); " `; exports[`fixture > transform with restoreQueryExtension 1`] = ` -"import * as __vite_glob_1_0 from \\"./modules/a.ts\\" -import * as __vite_glob_1_1 from \\"./modules/b.ts\\" -import * as __vite_glob_1_2 from \\"./modules/index.ts\\" -import { name as __vite_glob_3_0 } from \\"./modules/a.ts\\" -import { name as __vite_glob_3_1 } from \\"./modules/b.ts\\" -import { name as __vite_glob_3_2 } from \\"./modules/index.ts\\" -import { default as __vite_glob_5_0 } from \\"./modules/a.ts?raw\\" -import { default as __vite_glob_5_1 } from \\"./modules/b.ts?raw\\" -import \\"../../../../../../types/importMeta\\"; -export const basic = Object.assign({ -\\"./modules/a.ts\\": () => import(\\"./modules/a.ts\\"), -\\"./modules/b.ts\\": () => import(\\"./modules/b.ts\\"), -\\"./modules/index.ts\\": () => import(\\"./modules/index.ts\\") -}); -export const basicEager = Object.assign({ -\\"./modules/a.ts\\": __vite_glob_1_0, -\\"./modules/b.ts\\": __vite_glob_1_1, -\\"./modules/index.ts\\": __vite_glob_1_2 -}); -export const ignore = Object.assign({ -\\"./modules/a.ts\\": () => import(\\"./modules/a.ts\\"), -\\"./modules/b.ts\\": () => import(\\"./modules/b.ts\\") -}); -export const namedEager = Object.assign({ -\\"./modules/a.ts\\": __vite_glob_3_0, -\\"./modules/b.ts\\": __vite_glob_3_1, -\\"./modules/index.ts\\": __vite_glob_3_2 -}); -export const namedDefault = Object.assign({ -\\"./modules/a.ts\\": () => import(\\"./modules/a.ts\\").then(m => m[\\"default\\"]), -\\"./modules/b.ts\\": () => import(\\"./modules/b.ts\\").then(m => m[\\"default\\"]), -\\"./modules/index.ts\\": () => import(\\"./modules/index.ts\\").then(m => m[\\"default\\"]) -}); -export const eagerAs = Object.assign({ -\\"./modules/a.ts\\": __vite_glob_5_0, -\\"./modules/b.ts\\": __vite_glob_5_1 -}); -export const rawImportModule = Object.assign({ -\\"./modules/a.ts\\": () => import(\\"./modules/a.ts?raw\\"), -\\"./modules/b.ts\\": () => import(\\"./modules/b.ts?raw\\") -}); -export const excludeSelf = Object.assign({ -\\"./sibling.ts\\": () => import(\\"./sibling.ts\\") -}); -export const customQueryString = Object.assign({ -\\"./sibling.ts\\": () => import(\\"./sibling.ts?custom&lang.ts\\") -}); -export const customQueryObject = Object.assign({ -\\"./sibling.ts\\": () => import(\\"./sibling.ts?foo=bar&raw=true&lang.ts\\") -}); -export const parent = Object.assign({ - -}); -export const rootMixedRelative = Object.assign({ -\\"/css.spec.ts\\": () => import(\\"../../css.spec.ts?url&lang.ts\\").then(m => m[\\"default\\"]), -\\"/define.spec.ts\\": () => import(\\"../../define.spec.ts?url&lang.ts\\").then(m => m[\\"default\\"]), -\\"/esbuild.spec.ts\\": () => import(\\"../../esbuild.spec.ts?url&lang.ts\\").then(m => m[\\"default\\"]), -\\"/import.spec.ts\\": () => import(\\"../../import.spec.ts?url&lang.ts\\").then(m => m[\\"default\\"]), -\\"/importGlob/fixture-b/a.ts\\": () => import(\\"../fixture-b/a.ts?url&lang.ts\\").then(m => m[\\"default\\"]), -\\"/importGlob/fixture-b/b.ts\\": () => import(\\"../fixture-b/b.ts?url&lang.ts\\").then(m => m[\\"default\\"]), -\\"/importGlob/fixture-b/index.ts\\": () => import(\\"../fixture-b/index.ts?url&lang.ts\\").then(m => m[\\"default\\"]) -}); -export const cleverCwd1 = Object.assign({ -\\"./node_modules/framework/pages/hello.page.js\\": () => import(\\"./node_modules/framework/pages/hello.page.js\\") -}); -export const cleverCwd2 = Object.assign({ -\\"./modules/a.ts\\": () => import(\\"./modules/a.ts\\"), -\\"./modules/b.ts\\": () => import(\\"./modules/b.ts\\"), -\\"../fixture-b/a.ts\\": () => import(\\"../fixture-b/a.ts\\"), -\\"../fixture-b/b.ts\\": () => import(\\"../fixture-b/b.ts\\") -}); +"import * as __vite_glob_1_0 from \\"./modules/a.ts\\";import * as __vite_glob_1_1 from \\"./modules/b.ts\\";import * as __vite_glob_1_2 from \\"./modules/index.ts\\";import { name as __vite_glob_3_0 } from \\"./modules/a.ts\\";import { name as __vite_glob_3_1 } from \\"./modules/b.ts\\";import { name as __vite_glob_3_2 } from \\"./modules/index.ts\\";import { default as __vite_glob_5_0 } from \\"./modules/a.ts?raw\\";import { default as __vite_glob_5_1 } from \\"./modules/b.ts?raw\\";import \\"../../../../../../types/importMeta\\"; +export const basic = Object.assign({\\"./modules/a.ts\\": () => import(\\"./modules/a.ts\\"),\\"./modules/b.ts\\": () => import(\\"./modules/b.ts\\"),\\"./modules/index.ts\\": () => import(\\"./modules/index.ts\\")}); +export const basicEager = Object.assign({\\"./modules/a.ts\\": __vite_glob_1_0,\\"./modules/b.ts\\": __vite_glob_1_1,\\"./modules/index.ts\\": __vite_glob_1_2}); +export const ignore = Object.assign({\\"./modules/a.ts\\": () => import(\\"./modules/a.ts\\"),\\"./modules/b.ts\\": () => import(\\"./modules/b.ts\\")}); +export const namedEager = Object.assign({\\"./modules/a.ts\\": __vite_glob_3_0,\\"./modules/b.ts\\": __vite_glob_3_1,\\"./modules/index.ts\\": __vite_glob_3_2}); +export const namedDefault = Object.assign({\\"./modules/a.ts\\": () => import(\\"./modules/a.ts\\").then(m => m[\\"default\\"]),\\"./modules/b.ts\\": () => import(\\"./modules/b.ts\\").then(m => m[\\"default\\"]),\\"./modules/index.ts\\": () => import(\\"./modules/index.ts\\").then(m => m[\\"default\\"])}); +export const eagerAs = Object.assign({\\"./modules/a.ts\\": __vite_glob_5_0,\\"./modules/b.ts\\": __vite_glob_5_1}); +export const rawImportModule = Object.assign({\\"./modules/a.ts\\": () => import(\\"./modules/a.ts?raw\\"),\\"./modules/b.ts\\": () => import(\\"./modules/b.ts?raw\\")}); +export const excludeSelf = Object.assign({\\"./sibling.ts\\": () => import(\\"./sibling.ts\\")}); +export const customQueryString = Object.assign({\\"./sibling.ts\\": () => import(\\"./sibling.ts?custom&lang.ts\\")}); +export const customQueryObject = Object.assign({\\"./sibling.ts\\": () => import(\\"./sibling.ts?foo=bar&raw=true&lang.ts\\")}); +export const parent = Object.assign({}); +export const rootMixedRelative = Object.assign({\\"/css.spec.ts\\": () => import(\\"../../css.spec.ts?url&lang.ts\\").then(m => m[\\"default\\"]),\\"/define.spec.ts\\": () => import(\\"../../define.spec.ts?url&lang.ts\\").then(m => m[\\"default\\"]),\\"/esbuild.spec.ts\\": () => import(\\"../../esbuild.spec.ts?url&lang.ts\\").then(m => m[\\"default\\"]),\\"/import.spec.ts\\": () => import(\\"../../import.spec.ts?url&lang.ts\\").then(m => m[\\"default\\"]),\\"/importGlob/fixture-b/a.ts\\": () => import(\\"../fixture-b/a.ts?url&lang.ts\\").then(m => m[\\"default\\"]),\\"/importGlob/fixture-b/b.ts\\": () => import(\\"../fixture-b/b.ts?url&lang.ts\\").then(m => m[\\"default\\"]),\\"/importGlob/fixture-b/index.ts\\": () => import(\\"../fixture-b/index.ts?url&lang.ts\\").then(m => m[\\"default\\"])}); +export const cleverCwd1 = Object.assign({\\"./node_modules/framework/pages/hello.page.js\\": () => import(\\"./node_modules/framework/pages/hello.page.js\\")}); +export const cleverCwd2 = Object.assign({\\"./modules/a.ts\\": () => import(\\"./modules/a.ts\\"),\\"./modules/b.ts\\": () => import(\\"./modules/b.ts\\"),\\"../fixture-b/a.ts\\": () => import(\\"../fixture-b/a.ts\\"),\\"../fixture-b/b.ts\\": () => import(\\"../fixture-b/b.ts\\")}); " `; exports[`fixture > virtual modules 1`] = ` -"Object.assign({ -\\"/modules/a.ts\\": () => import(\\"/modules/a.ts\\"), -\\"/modules/b.ts\\": () => import(\\"/modules/b.ts\\"), -\\"/modules/index.ts\\": () => import(\\"/modules/index.ts\\") -}) -Object.assign({ -\\"/../fixture-b/a.ts\\": () => import(\\"/../fixture-b/a.ts\\"), -\\"/../fixture-b/b.ts\\": () => import(\\"/../fixture-b/b.ts\\"), -\\"/../fixture-b/index.ts\\": () => import(\\"/../fixture-b/index.ts\\") -})" +"Object.assign({\\"/modules/a.ts\\": () => import(\\"/modules/a.ts\\"),\\"/modules/b.ts\\": () => import(\\"/modules/b.ts\\"),\\"/modules/index.ts\\": () => import(\\"/modules/index.ts\\")}) +Object.assign({\\"/../fixture-b/a.ts\\": () => import(\\"/../fixture-b/a.ts\\"),\\"/../fixture-b/b.ts\\": () => import(\\"/../fixture-b/b.ts\\"),\\"/../fixture-b/index.ts\\": () => import(\\"/../fixture-b/index.ts\\")})" `; diff --git a/packages/vite/src/node/plugins/assetImportMetaUrl.ts b/packages/vite/src/node/plugins/assetImportMetaUrl.ts index af3fa325bfce03..6d7a657706cf9c 100644 --- a/packages/vite/src/node/plugins/assetImportMetaUrl.ts +++ b/packages/vite/src/node/plugins/assetImportMetaUrl.ts @@ -3,7 +3,7 @@ import MagicString from 'magic-string' import { stripLiteral } from 'strip-literal' import type { Plugin } from '../plugin' import type { ResolvedConfig } from '../config' -import { transformResult } from '../utils' +import { transformStableResult } from '../utils' import { fileToUrl } from './asset' import { preloadHelperId } from './importAnalysisBuild' @@ -81,7 +81,7 @@ export function assetImportMetaUrlPlugin(config: ResolvedConfig): Plugin { ) } if (s) { - return transformResult(s, id, config) + return transformStableResult(s, id, config) } } return null diff --git a/packages/vite/src/node/plugins/define.ts b/packages/vite/src/node/plugins/define.ts index 9859676e693a23..1baff98c9b5ad0 100644 --- a/packages/vite/src/node/plugins/define.ts +++ b/packages/vite/src/node/plugins/define.ts @@ -1,7 +1,7 @@ import MagicString from 'magic-string' -import type { TransformResult } from 'rollup' import type { ResolvedConfig } from '../config' import type { Plugin } from '../plugin' +import { transformStableResult } from '../utils' import { isCSSRequest } from './css' import { isHTMLRequest } from './html' @@ -144,11 +144,7 @@ export function definePlugin(config: ResolvedConfig): Plugin { return null } - const result: TransformResult = { code: s.toString() } - if (config.build.sourcemap) { - result.map = s.generateMap({ hires: true }) - } - return result + return transformStableResult(s, id, config) } } } diff --git a/packages/vite/src/node/plugins/dynamicImportVars.ts b/packages/vite/src/node/plugins/dynamicImportVars.ts index 7093ded9253a39..97f605c1758d53 100644 --- a/packages/vite/src/node/plugins/dynamicImportVars.ts +++ b/packages/vite/src/node/plugins/dynamicImportVars.ts @@ -11,7 +11,7 @@ import { normalizePath, parseRequest, requestQuerySplitRE, - transformResult + transformStableResult } from '../utils' export const dynamicImportHelperId = '/@vite/dynamic-import-helper' @@ -209,7 +209,7 @@ export function dynamicImportVarsPlugin(config: ResolvedConfig): Plugin { `import __variableDynamicImportRuntimeHelper from "${dynamicImportHelperId}";` ) } - return transformResult(s, importer, config) + return transformStableResult(s, importer, config) } } } diff --git a/packages/vite/src/node/plugins/importAnalysis.ts b/packages/vite/src/node/plugins/importAnalysis.ts index c7b4d5c8bb3f1b..9a39c792388400 100644 --- a/packages/vite/src/node/plugins/importAnalysis.ts +++ b/packages/vite/src/node/plugins/importAnalysis.ts @@ -40,7 +40,7 @@ import { removeImportQuery, stripBomTag, timeFrom, - transformResult, + transformStableResult, unwrapId } from '../utils' import type { ResolvedConfig } from '../config' @@ -711,7 +711,7 @@ export function importAnalysisPlugin(config: ResolvedConfig): Plugin { } if (s) { - return transformResult(s, importer, config) + return transformStableResult(s, importer, config) } else { return source } diff --git a/packages/vite/src/node/plugins/importMetaGlob.ts b/packages/vite/src/node/plugins/importMetaGlob.ts index 661093676626e6..7f3695178fdce9 100644 --- a/packages/vite/src/node/plugins/importMetaGlob.ts +++ b/packages/vite/src/node/plugins/importMetaGlob.ts @@ -17,7 +17,7 @@ import type { Plugin } from '../plugin' import type { ViteDevServer } from '../server' import type { ModuleNode } from '../server/moduleGraph' import type { ResolvedConfig } from '../config' -import { normalizePath, slash, transformResult } from '../utils' +import { normalizePath, slash, transformStableResult } from '../utils' const { isMatch, scan } = micromatch @@ -75,7 +75,7 @@ export function importGlobPlugin(config: ResolvedConfig): Plugin { server!.watcher.add(dirname(file)) }) } - return transformResult(result.s, id, config) + return transformStableResult(result.s, id, config) } } } @@ -426,7 +426,7 @@ export async function transformGlobImport( files.forEach((i) => matchedFiles.add(i)) - const replacement = `Object.assign({\n${objectProps.join(',\n')}\n})` + const replacement = `Object.assign({${objectProps.join(',')}})` s.overwrite(start, end, replacement) return staticImports @@ -435,7 +435,7 @@ export async function transformGlobImport( ) ).flat() - if (staticImports.length) s.prepend(`${staticImports.join('\n')}\n`) + if (staticImports.length) s.prepend(`${staticImports.join(';')};`) return { s, diff --git a/packages/vite/src/node/plugins/workerImportMetaUrl.ts b/packages/vite/src/node/plugins/workerImportMetaUrl.ts index c88046465f0f42..1b05e6d4a137e1 100644 --- a/packages/vite/src/node/plugins/workerImportMetaUrl.ts +++ b/packages/vite/src/node/plugins/workerImportMetaUrl.ts @@ -10,7 +10,7 @@ import { injectQuery, normalizePath, parseRequest, - transformResult + transformStableResult } from '../utils' import { getDepsOptimizer } from '../optimizer' import type { WorkerType } from './worker' @@ -136,7 +136,7 @@ export function workerImportMetaUrlPlugin(config: ResolvedConfig): Plugin { } if (s) { - return transformResult(s, id, config) + return transformStableResult(s, id, config) } return null diff --git a/packages/vite/src/node/utils.ts b/packages/vite/src/node/utils.ts index c554fa0396f87b..e2c7c8862b930a 100644 --- a/packages/vite/src/node/utils.ts +++ b/packages/vite/src/node/utils.ts @@ -1028,16 +1028,21 @@ function normalizeSingleAlias({ return alias } -export function transformResult( +/** + * Transforms transpiled code result where line numbers aren't altered, + * so we can skip sourcemap generation during dev + */ +export function transformStableResult( s: MagicString, id: string, config: ResolvedConfig ): TransformResult { - const isBuild = config.command === 'build' - const needSourceMap = !isBuild || config.build.sourcemap return { code: s.toString(), - map: needSourceMap ? s.generateMap({ hires: true, source: id }) : null + map: + config.command === 'build' && config.build.sourcemap + ? s.generateMap({ hires: true, source: id }) + : null } } diff --git a/playground/vue-sourcemap/__tests__/__snapshots__/serve.spec.ts.snap b/playground/vue-sourcemap/__tests__/__snapshots__/serve.spec.ts.snap index 7a262ecd9a6f82..e91b6ce384c562 100644 --- a/playground/vue-sourcemap/__tests__/__snapshots__/serve.spec.ts.snap +++ b/playground/vue-sourcemap/__tests__/__snapshots__/serve.spec.ts.snap @@ -1,8 +1,149 @@ // Vitest Snapshot v1 +exports[`serve:vue-sourcemap > css 1`] = ` +{ + "mappings": ";AAQA;EACE,UAAU;AACZ", + "sources": [ + "/root/Css.vue", + ], + "sourcesContent": [ + " + + + + + + + + +", + ], + "version": 3, +} +`; + +exports[`serve:vue-sourcemap > css module 1`] = ` +{ + "mappings": ";AAcA;EACE,UAAU;AACZ", + "sources": [ + "/root/Css.vue", + ], + "sourcesContent": [ + " + + + + + + + + +", + ], + "version": 3, +} +`; + +exports[`serve:vue-sourcemap > css scoped 1`] = ` +{ + "mappings": ";AAoBA;EACE,UAAU;AACZ", + "sources": [ + "/root/Css.vue", + ], + "sourcesContent": [ + " + + + + + + + + +", + ], + "version": 3, +} +`; + exports[`serve:vue-sourcemap > js 1`] = ` { - "mappings": "mIAKA,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;;;;;;AAGP;AACd,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;;;;;;;;;;;wBARlB,oBAAiB,WAAd,MAAU", + "mappings": "AAKA,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;;;;;;AAGP;AACd,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;;;;;;;;;;;wBARlB,oBAAiB,WAAd,MAAU", "sources": [ "/root/Js.vue", ], @@ -23,3 +164,172 @@ console.log('setup') "version": 3, } `; + +exports[`serve:vue-sourcemap > less with additionalData 1`] = ` +{ + "mappings": "AAKA;EACE", + "sources": [ + "/root/Less.vue", + ], + "sourcesContent": [ + " + + +", + ], + "version": 3, +} +`; + +exports[`serve:vue-sourcemap > no script 1`] = ` +{ + "mappings": ";;;wBACE,oBAAwB,WAArB,aAAiB", + "sourceRoot": "", + "sources": [ + "/root/NoScript.vue", + ], + "sourcesContent": [ + " +", + ], + "version": 3, +} +`; + +exports[`serve:vue-sourcemap > no template 1`] = ` +{ + "mappings": "AACA,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;;;;;;AAGP;AACd,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;;;;;;;", + "sources": [ + "/root/NoTemplate.vue", + ], + "sourcesContent": [ + " + + +", + ], + "version": 3, +} +`; + +exports[`serve:vue-sourcemap > sass 1`] = ` +{ + "mappings": "AAKA;EACE", + "sources": [ + "/root/Sass.vue", + ], + "sourcesContent": [ + " + + +", + ], + "version": 3, +} +`; + +exports[`serve:vue-sourcemap > sass with import 1`] = ` +{ + "mappings": "AAAA;EACE;;ACOF;EACE", + "sources": [ + "/root/sassWithImportImported.sass", + "/root/SassWithImport.vue", + ], + "sourcesContent": [ + ".sass-with-import-imported + color: red +", + " + + +", + ], + "version": 3, +} +`; + +exports[`serve:vue-sourcemap > src imported 1`] = ` +{ + "mappings": "AAAA;EACE,UAAU;AACZ", + "sources": [ + "/root/src-import/src-import.css", + ], + "sourcesContent": [ + ".src-import { + color: red; +} +", + ], + "version": 3, +} +`; + +exports[`serve:vue-sourcemap > src imported sass 1`] = ` +{ + "mappings": "AAAA;EACE;;ACCF;EACE", + "sources": [ + "/root/src-import/src-import-imported.sass", + "/root/src-import/src-import.sass", + ], + "sourcesContent": [ + ".src-import-sass-imported + color: red +", + "@import './src-import-imported' + +.src-import-sass + color: red +", + ], + "version": 3, +} +`; + +exports[`serve:vue-sourcemap > ts 1`] = ` +{ + "mappings": ";AAKA,QAAQ,IAAI,WAAW;;;;;AAIvB,YAAQ,IAAI,UAAU;;;;;;;;uBARpB,oBAAiB,WAAd,MAAU", + "sources": [ + "/root/Ts.vue", + ], + "sourcesContent": [ + " + + + + +", + ], + "version": 3, +} +`; diff --git a/playground/vue-sourcemap/__tests__/serve.spec.ts b/playground/vue-sourcemap/__tests__/serve.spec.ts index e42a12e87be6a2..1ace0d7d1f4306 100644 --- a/playground/vue-sourcemap/__tests__/serve.spec.ts +++ b/playground/vue-sourcemap/__tests__/serve.spec.ts @@ -29,310 +29,55 @@ describe.runIf(isServe)('serve:vue-sourcemap', () => { const res = await page.request.get(new URL('./Ts.vue', page.url()).href) const js = await res.text() const map = extractSourcemap(js) - expect(formatSourcemapForSnapshot(map)).toMatchInlineSnapshot(` - { - "mappings": ";AAKA,QAAQ,IAAI,WAAW;;;;;AAIvB,YAAQ,IAAI,UAAU;;;;;;;;uBARpB,oBAAiB,WAAd,MAAU", - "sources": [ - "/root/Ts.vue", - ], - "sourcesContent": [ - " - - - - - ", - ], - "version": 3, - } - `) + expect(formatSourcemapForSnapshot(map)).toMatchSnapshot() }) test('css', async () => { const css = await getStyleTagContentIncluding('.css ') const map = extractSourcemap(css) - expect(formatSourcemapForSnapshot(map)).toMatchInlineSnapshot(` - { - "mappings": ";AAQA;EACE,UAAU;AACZ", - "sources": [ - "/root/Css.vue", - ], - "sourcesContent": [ - " - - - - - - - - - ", - ], - "version": 3, - } - `) + expect(formatSourcemapForSnapshot(map)).toMatchSnapshot() }) test('css module', async () => { const css = await getStyleTagContentIncluding('._css-module_') const map = extractSourcemap(css) - expect(formatSourcemapForSnapshot(map)).toMatchInlineSnapshot(` - { - "mappings": ";AAcA;EACE,UAAU;AACZ", - "sources": [ - "/root/Css.vue", - ], - "sourcesContent": [ - " - - - - - - - - - ", - ], - "version": 3, - } - `) + expect(formatSourcemapForSnapshot(map)).toMatchSnapshot() }) test('css scoped', async () => { const css = await getStyleTagContentIncluding('.css-scoped[data-v-') const map = extractSourcemap(css) - expect(formatSourcemapForSnapshot(map)).toMatchInlineSnapshot(` - { - "mappings": ";AAoBA;EACE,UAAU;AACZ", - "sources": [ - "/root/Css.vue", - ], - "sourcesContent": [ - " - - - - - - - - - ", - ], - "version": 3, - } - `) + expect(formatSourcemapForSnapshot(map)).toMatchSnapshot() }) test('sass', async () => { const css = await getStyleTagContentIncluding('.sass ') const map = extractSourcemap(css) - expect(formatSourcemapForSnapshot(map)).toMatchInlineSnapshot(` - { - "mappings": "AAKA;EACE", - "sources": [ - "/root/Sass.vue", - ], - "sourcesContent": [ - " - - - ", - ], - "version": 3, - } - `) + expect(formatSourcemapForSnapshot(map)).toMatchSnapshot() }) test('sass with import', async () => { const css = await getStyleTagContentIncluding('.sass-with-import ') const map = extractSourcemap(css) - expect(formatSourcemapForSnapshot(map)).toMatchInlineSnapshot(` - { - "mappings": "AAAA;EACE;;ACOF;EACE", - "sources": [ - "/root/sassWithImportImported.sass", - "/root/SassWithImport.vue", - ], - "sourcesContent": [ - ".sass-with-import-imported - color: red - ", - " - - - ", - ], - "version": 3, - } - `) + expect(formatSourcemapForSnapshot(map)).toMatchSnapshot() }) test('less with additionalData', async () => { const css = await getStyleTagContentIncluding('.less ') const map = extractSourcemap(css) - expect(formatSourcemapForSnapshot(map)).toMatchInlineSnapshot(` - { - "mappings": "AAKA;EACE", - "sources": [ - "/root/Less.vue", - ], - "sourcesContent": [ - " - - - ", - ], - "version": 3, - } - `) + expect(formatSourcemapForSnapshot(map)).toMatchSnapshot() }) test('src imported', async () => { const css = await getStyleTagContentIncluding('.src-import[data-v-') const map = extractSourcemap(css) - expect(formatSourcemapForSnapshot(map)).toMatchInlineSnapshot(` - { - "mappings": "AAAA;EACE,UAAU;AACZ", - "sources": [ - "/root/src-import/src-import.css", - ], - "sourcesContent": [ - ".src-import { - color: red; - } - ", - ], - "version": 3, - } - `) + expect(formatSourcemapForSnapshot(map)).toMatchSnapshot() }) test('src imported sass', async () => { const css = await getStyleTagContentIncluding('.src-import-sass[data-v-') const map = extractSourcemap(css) - expect(formatSourcemapForSnapshot(map)).toMatchInlineSnapshot(` - { - "mappings": "AAAA;EACE;;ACCF;EACE", - "sources": [ - "/root/src-import/src-import-imported.sass", - "/root/src-import/src-import.sass", - ], - "sourcesContent": [ - ".src-import-sass-imported - color: red - ", - "@import './src-import-imported' - - .src-import-sass - color: red - ", - ], - "version": 3, - } - `) + expect(formatSourcemapForSnapshot(map)).toMatchSnapshot() }) test('no script', async () => { @@ -341,21 +86,7 @@ describe.runIf(isServe)('serve:vue-sourcemap', () => { ) const js = await res.text() const map = extractSourcemap(js) - expect(formatSourcemapForSnapshot(map)).toMatchInlineSnapshot(` - { - "mappings": ";;;wBACE", - "sources": [ - "/root/NoScript.vue", - ], - "sourcesContent": [ - " - ", - ], - "version": 3, - } - `) + expect(formatSourcemapForSnapshot(map)).toMatchSnapshot() }) test('no template', async () => { @@ -364,24 +95,6 @@ describe.runIf(isServe)('serve:vue-sourcemap', () => { ) const js = await res.text() const map = extractSourcemap(js) - expect(formatSourcemapForSnapshot(map)).toMatchInlineSnapshot(` - { - "mappings": "2IACA,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;;;;;;AAGP;AACd,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC", - "sources": [ - "/root/NoTemplate.vue", - ], - "sourcesContent": [ - " - - - ", - ], - "version": 3, - } - `) + expect(formatSourcemapForSnapshot(map)).toMatchSnapshot() }) }) diff --git a/playground/worker/__tests__/sourcemap/__snapshots__/sourcemap-worker.spec.ts.snap b/playground/worker/__tests__/sourcemap/__snapshots__/sourcemap-worker.spec.ts.snap deleted file mode 100644 index 3895aae40ad402..00000000000000 --- a/playground/worker/__tests__/sourcemap/__snapshots__/sourcemap-worker.spec.ts.snap +++ /dev/null @@ -1,14 +0,0 @@ -// Vitest Snapshot v1 - -exports[`serve:worker-sourcemap > nested worker 1`] = ` -{ - "mappings": "AAAA,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,uCAAsB,CAAC;AAClD;AACA,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;AACzB,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;AACjC,CAAC;AACD;AACA,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;AAC/B;AACA,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;AAChB,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;", - "sources": [ - "/root/possible-ts-output-worker.mjs?worker_file", - ], - "sourcesContent": [ - null, - ], - "version": 3, -} -`; diff --git a/playground/worker/__tests__/sourcemap/sourcemap-worker.spec.ts b/playground/worker/__tests__/sourcemap/sourcemap-worker.spec.ts index 801369d8cb7271..a0ad8e7a355b8b 100644 --- a/playground/worker/__tests__/sourcemap/sourcemap-worker.spec.ts +++ b/playground/worker/__tests__/sourcemap/sourcemap-worker.spec.ts @@ -1,13 +1,6 @@ import fs from 'node:fs' import path from 'node:path' -import { - extractSourcemap, - formatSourcemapForSnapshot, - isBuild, - isServe, - page, - testDir -} from '~utils' +import { isBuild, testDir } from '~utils' describe.runIf(isBuild)('build', () => { // assert correct files @@ -120,16 +113,6 @@ describe.runIf(isBuild)('build', () => { }) }) -describe.runIf(isServe)('serve:worker-sourcemap', () => { - test('nested worker', async () => { - const res = await page.request.get( - new URL('./possible-ts-output-worker.mjs?worker_file', page.url()).href - ) - const map = extractSourcemap(await res.text()) - expect(formatSourcemapForSnapshot(map)).toMatchSnapshot() - }) -}) - function getSourceMapUrl(code: string): string { const regex = /\/\/[#@]\s(?:source(?:Mapping)?URL)=\s*(\S+)/g const results = regex.exec(code)