From a8ae223968728849870d556082ed5df6204c36b7 Mon Sep 17 00:00:00 2001 From: bluwy Date: Thu, 14 Sep 2023 15:21:41 +0800 Subject: [PATCH 1/3] fix(sourcemap): dont inject fallback sourcemap if have existing --- packages/vite/src/node/server/send.ts | 15 ++++++++---- .../__tests__/js-sourcemap.spec.ts | 24 +++++++++++++++++++ playground/js-sourcemap/foo-with-sourcemap.js | 5 ++++ 3 files changed, 40 insertions(+), 4 deletions(-) create mode 100644 playground/js-sourcemap/foo-with-sourcemap.js diff --git a/packages/vite/src/node/server/send.ts b/packages/vite/src/node/server/send.ts index 564ab54d8de85f..24e7c5b1b6bb34 100644 --- a/packages/vite/src/node/server/send.ts +++ b/packages/vite/src/node/server/send.ts @@ -17,6 +17,8 @@ const alias: Record = { json: 'application/json', } +const sourcemapRe = /^\/\/# sourceMappingURL=.+/m + export interface SendOptions { etag?: string cacheControl?: string @@ -63,13 +65,18 @@ export function send( if (type === 'js' || type === 'css') { content = getCodeWithSourcemap(type, content.toString(), map) } - } else { - if (type === 'js' && (!map || map.mappings !== '')) { + } + // inject fallback sourcemap for js for improved debugging + // https://github.com/vitejs/vite/pull/13514#issuecomment-1592431496 + else if (type === 'js' && (!map || map.mappings !== '')) { + const code = content.toString() + // if the code has existing inline sourcemap, assume it's correct and skip + if (!sourcemapRe.test(code)) { const urlWithoutTimestamp = removeTimestampQuery(req.url!) - const ms = new MagicString(content.toString()) + const ms = new MagicString(code) content = getCodeWithSourcemap( type, - content.toString(), + code, ms.generateMap({ source: path.basename(urlWithoutTimestamp), hires: 'boundary', diff --git a/playground/js-sourcemap/__tests__/js-sourcemap.spec.ts b/playground/js-sourcemap/__tests__/js-sourcemap.spec.ts index 06d073fe5b1e9e..1682d08bce0aa2 100644 --- a/playground/js-sourcemap/__tests__/js-sourcemap.spec.ts +++ b/playground/js-sourcemap/__tests__/js-sourcemap.spec.ts @@ -29,6 +29,30 @@ if (!isBuild) { `) }) + test('js with existing inline sourcemap', async () => { + const res = await page.request.get( + new URL('./foo-with-sourcemap.js', page.url()).href, + ) + const js = await res.text() + + const sourcemapComments = js.match(/\/\/# sourceMappingURL=.+/g).length + expect(sourcemapComments).toBe(1) + + const map = extractSourcemap(js) + expect(formatSourcemapForSnapshot(map)).toMatchInlineSnapshot(` + { + "mappings": "AAAA,MAAM,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,GAAG", + "sources": [ + "", + ], + "sourcesContent": [ + null, + ], + "version": 3, + } + `) + }) + test('ts', async () => { const res = await page.request.get(new URL('./bar.ts', page.url()).href) const js = await res.text() diff --git a/playground/js-sourcemap/foo-with-sourcemap.js b/playground/js-sourcemap/foo-with-sourcemap.js new file mode 100644 index 00000000000000..571667802fbf05 --- /dev/null +++ b/playground/js-sourcemap/foo-with-sourcemap.js @@ -0,0 +1,5 @@ +export const foo = 'foo' + +// default boundary sourcemap with magic-string + +//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIiJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxNQUFNLENBQUMsS0FBSyxDQUFDLEdBQUcsQ0FBQyxDQUFDLENBQUMsQ0FBQyxHQUFHIn0= From 6623c07166675199948c143894ec577211fdddd4 Mon Sep 17 00:00:00 2001 From: bluwy Date: Fri, 15 Sep 2023 16:52:07 +0800 Subject: [PATCH 2/3] refactor: use convert-source-map --- packages/vite/src/node/server/send.ts | 13 +++++++++---- .../js-sourcemap/__tests__/js-sourcemap.spec.ts | 3 ++- 2 files changed, 11 insertions(+), 5 deletions(-) diff --git a/packages/vite/src/node/server/send.ts b/packages/vite/src/node/server/send.ts index 24e7c5b1b6bb34..033b9f317a60d3 100644 --- a/packages/vite/src/node/server/send.ts +++ b/packages/vite/src/node/server/send.ts @@ -4,12 +4,17 @@ import type { ServerResponse, } from 'node:http' import path from 'node:path' +import convertSourceMap from 'convert-source-map' import getEtag from 'etag' import type { SourceMap } from 'rollup' import MagicString from 'magic-string' -import { removeTimestampQuery } from '../utils' +import { createDebugger, removeTimestampQuery } from '../utils' import { getCodeWithSourcemap } from './sourcemap' +const debug = createDebugger('vite:send', { + onlyWhenFocused: true, +}) + const alias: Record = { js: 'application/javascript', css: 'text/css', @@ -17,8 +22,6 @@ const alias: Record = { json: 'application/json', } -const sourcemapRe = /^\/\/# sourceMappingURL=.+/m - export interface SendOptions { etag?: string cacheControl?: string @@ -71,7 +74,9 @@ export function send( else if (type === 'js' && (!map || map.mappings !== '')) { const code = content.toString() // if the code has existing inline sourcemap, assume it's correct and skip - if (!sourcemapRe.test(code)) { + if (convertSourceMap.mapFileCommentRegex.test(code)) { + debug?.(`Skipped injecting fallback sourcemap for ${req.url}`) + } else { const urlWithoutTimestamp = removeTimestampQuery(req.url!) const ms = new MagicString(code) content = getCodeWithSourcemap( diff --git a/playground/js-sourcemap/__tests__/js-sourcemap.spec.ts b/playground/js-sourcemap/__tests__/js-sourcemap.spec.ts index 1682d08bce0aa2..eac7b2a524a9e7 100644 --- a/playground/js-sourcemap/__tests__/js-sourcemap.spec.ts +++ b/playground/js-sourcemap/__tests__/js-sourcemap.spec.ts @@ -1,5 +1,6 @@ import { URL } from 'node:url' import { describe, expect, test } from 'vitest' +import { mapFileCommentRegex } from 'convert-source-map' import { extractSourcemap, findAssetFile, @@ -35,7 +36,7 @@ if (!isBuild) { ) const js = await res.text() - const sourcemapComments = js.match(/\/\/# sourceMappingURL=.+/g).length + const sourcemapComments = js.match(mapFileCommentRegex).length expect(sourcemapComments).toBe(1) const map = extractSourcemap(js) From 016779cf81218458feb59d4fe9491547919d547a Mon Sep 17 00:00:00 2001 From: bluwy Date: Fri, 15 Sep 2023 17:10:25 +0800 Subject: [PATCH 3/3] chore: bump cjs size limit --- packages/vite/rollup.config.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/vite/rollup.config.ts b/packages/vite/rollup.config.ts index 82415fff301b85..5b4d51052b8c20 100644 --- a/packages/vite/rollup.config.ts +++ b/packages/vite/rollup.config.ts @@ -195,7 +195,7 @@ function createCjsConfig(isProduction: boolean) { ...Object.keys(pkg.dependencies), ...(isProduction ? [] : Object.keys(pkg.devDependencies)), ], - plugins: [...createNodePlugins(false, false, false), bundleSizeLimit(155)], + plugins: [...createNodePlugins(false, false, false), bundleSizeLimit(161)], }) }