From a8b68432b5a7e3417acb1c2750e9b9d5ddf3bde8 Mon Sep 17 00:00:00 2001 From: sapphi-red <49056869+sapphi-red@users.noreply.github.com> Date: Fri, 24 Nov 2023 20:17:28 +0900 Subject: [PATCH 1/3] fix: js fallback sourcemap content should be using original content --- .../src/node/server/middlewares/transform.ts | 9 +++++++- packages/vite/src/node/server/send.ts | 23 +++++++++++-------- packages/vite/src/node/server/sourcemap.ts | 7 ++++++ 3 files changed, 28 insertions(+), 11 deletions(-) diff --git a/packages/vite/src/node/server/middlewares/transform.ts b/packages/vite/src/node/server/middlewares/transform.ts index 22cb736909dc6b..7b0fb6b1d97979 100644 --- a/packages/vite/src/node/server/middlewares/transform.ts +++ b/packages/vite/src/node/server/middlewares/transform.ts @@ -20,7 +20,7 @@ import { } from '../../utils' import { send } from '../send' import { ERR_LOAD_URL, transformRequest } from '../transformRequest' -import { applySourcemapIgnoreList } from '../sourcemap' +import { applySourcemapIgnoreList, getOriginalContent } from '../sourcemap' import { isHTMLProxy } from '../../plugins/html' import { DEP_VERSION_RE, @@ -205,12 +205,19 @@ export function transformMiddleware( const type = isDirectCSSRequest(url) ? 'css' : 'js' const isDep = DEP_VERSION_RE.test(url) || depsOptimizer?.isOptimizedDepUrl(url) + const filepath = + result.map == null + ? (await server.moduleGraph.getModuleByUrl(url, false))?.file + : undefined + const originalContent = + filepath != null ? await getOriginalContent(filepath) : undefined return send(req, res, result.code, type, { etag: result.etag, // allow browser to cache npm deps! cacheControl: isDep ? 'max-age=31536000,immutable' : 'no-cache', headers: server.config.server.headers, map: result.map, + originalContent, }) } } diff --git a/packages/vite/src/node/server/send.ts b/packages/vite/src/node/server/send.ts index 033b9f317a60d3..bec8d21898fc37 100644 --- a/packages/vite/src/node/server/send.ts +++ b/packages/vite/src/node/server/send.ts @@ -27,6 +27,7 @@ export interface SendOptions { cacheControl?: string headers?: OutgoingHttpHeaders map?: SourceMap | { mappings: '' } | null + originalContent?: string } export function send( @@ -71,7 +72,9 @@ export function send( } // inject fallback sourcemap for js for improved debugging // https://github.com/vitejs/vite/pull/13514#issuecomment-1592431496 - else if (type === 'js' && (!map || map.mappings !== '')) { + // for { mappings: "" }, we don't inject fallback sourcemap + // because it indicates generating a sourcemap is meaningless + else if (type === 'js' && map == null) { const code = content.toString() // if the code has existing inline sourcemap, assume it's correct and skip if (convertSourceMap.mapFileCommentRegex.test(code)) { @@ -79,15 +82,15 @@ export function send( } else { const urlWithoutTimestamp = removeTimestampQuery(req.url!) const ms = new MagicString(code) - content = getCodeWithSourcemap( - type, - code, - ms.generateMap({ - source: path.basename(urlWithoutTimestamp), - hires: 'boundary', - includeContent: true, - }), - ) + const map = ms.generateMap({ + source: path.basename(urlWithoutTimestamp), + hires: 'boundary', + includeContent: !options.originalContent, + }) + if (options.originalContent != null) { + map.sourcesContent = [options.originalContent] + } + content = getCodeWithSourcemap(type, code, map) } } diff --git a/packages/vite/src/node/server/sourcemap.ts b/packages/vite/src/node/server/sourcemap.ts index c8f2c8d88fdacd..650d380a7ffc44 100644 --- a/packages/vite/src/node/server/sourcemap.ts +++ b/packages/vite/src/node/server/sourcemap.ts @@ -65,6 +65,13 @@ export async function injectSourcesContent( } } +export async function getOriginalContent( + filepath: string, +): Promise { + if (virtualSourceRE.test(filepath)) return undefined + return await fsp.readFile(filepath, 'utf-8').catch(() => undefined) +} + export function genSourceMapUrl(map: SourceMap | string): string { if (typeof map !== 'string') { map = JSON.stringify(map) From 220a2672ee043959dd27c813c3ab867c0575f3d8 Mon Sep 17 00:00:00 2001 From: sapphi-red <49056869+sapphi-red@users.noreply.github.com> Date: Sat, 25 Nov 2023 00:13:48 +0900 Subject: [PATCH 2/3] chore: add comment --- packages/vite/src/node/server/send.ts | 1 + 1 file changed, 1 insertion(+) diff --git a/packages/vite/src/node/server/send.ts b/packages/vite/src/node/server/send.ts index bec8d21898fc37..c6de7452824665 100644 --- a/packages/vite/src/node/server/send.ts +++ b/packages/vite/src/node/server/send.ts @@ -27,6 +27,7 @@ export interface SendOptions { cacheControl?: string headers?: OutgoingHttpHeaders map?: SourceMap | { mappings: '' } | null + /** only used when map == null (when the fallback sourcemap is used) */ originalContent?: string } From 6cfe43311d50506d9c418c2caea65d0cd013afd2 Mon Sep 17 00:00:00 2001 From: sapphi-red <49056869+sapphi-red@users.noreply.github.com> Date: Sat, 25 Nov 2023 00:50:37 +0900 Subject: [PATCH 3/3] fix: check type === 'js' --- .../vite/src/node/server/middlewares/transform.ts | 14 ++++++++------ packages/vite/src/node/server/send.ts | 2 +- 2 files changed, 9 insertions(+), 7 deletions(-) diff --git a/packages/vite/src/node/server/middlewares/transform.ts b/packages/vite/src/node/server/middlewares/transform.ts index 7b0fb6b1d97979..5c7ec55bd8fb55 100644 --- a/packages/vite/src/node/server/middlewares/transform.ts +++ b/packages/vite/src/node/server/middlewares/transform.ts @@ -205,12 +205,14 @@ export function transformMiddleware( const type = isDirectCSSRequest(url) ? 'css' : 'js' const isDep = DEP_VERSION_RE.test(url) || depsOptimizer?.isOptimizedDepUrl(url) - const filepath = - result.map == null - ? (await server.moduleGraph.getModuleByUrl(url, false))?.file - : undefined - const originalContent = - filepath != null ? await getOriginalContent(filepath) : undefined + let originalContent: string | undefined + if (type === 'js' && result.map == null) { + const filepath = ( + await server.moduleGraph.getModuleByUrl(url, false) + )?.file + originalContent = + filepath != null ? await getOriginalContent(filepath) : undefined + } return send(req, res, result.code, type, { etag: result.etag, // allow browser to cache npm deps! diff --git a/packages/vite/src/node/server/send.ts b/packages/vite/src/node/server/send.ts index c6de7452824665..414fa4fe998175 100644 --- a/packages/vite/src/node/server/send.ts +++ b/packages/vite/src/node/server/send.ts @@ -27,7 +27,7 @@ export interface SendOptions { cacheControl?: string headers?: OutgoingHttpHeaders map?: SourceMap | { mappings: '' } | null - /** only used when map == null (when the fallback sourcemap is used) */ + /** only used when type === 'js' && map == null (when the fallback sourcemap is used) */ originalContent?: string }