From 1565a02eb83d7f4d370967e4dc9c519b0cc5cd03 Mon Sep 17 00:00:00 2001 From: Hiroshi Ogawa Date: Sat, 24 Aug 2024 11:24:00 +0900 Subject: [PATCH 1/6] fix: fix sass modern source map --- packages/vite/src/node/plugins/css.ts | 10 ++++++++++ 1 file changed, 10 insertions(+) diff --git a/packages/vite/src/node/plugins/css.ts b/packages/vite/src/node/plugins/css.ts index e447a486fc39b7..b65b356db7f4b2 100644 --- a/packages/vite/src/node/plugins/css.ts +++ b/packages/vite/src/node/plugins/css.ts @@ -2276,6 +2276,11 @@ const makeModernScssWorker = ( ] const result = await sass.compileStringAsync(data, sassOptions) + if (result.sourceMap) { + result.sourceMap.sources = result.sourceMap.sources.map((url) => + url.startsWith('file://') ? fileURLToPath(url) : url, + ) + } return { css: result.css, map: result.sourceMap ? JSON.stringify(result.sourceMap) : undefined, @@ -2362,6 +2367,11 @@ const makeModernCompilerScssWorker = ( ] const result = await compiler.compileStringAsync(data, sassOptions) + if (result.sourceMap) { + result.sourceMap.sources = result.sourceMap.sources.map((url) => + url.startsWith('file://') ? fileURLToPath(url) : url, + ) + } return { css: result.css, map: result.sourceMap ? JSON.stringify(result.sourceMap) : undefined, From b746818f9fdecad36492c6869749d758df7cb853 Mon Sep 17 00:00:00 2001 From: Hiroshi Ogawa Date: Sat, 24 Aug 2024 11:32:37 +0900 Subject: [PATCH 2/6] wip --- playground/css-sourcemap/vite.config.js | 3 +++ 1 file changed, 3 insertions(+) diff --git a/playground/css-sourcemap/vite.config.js b/playground/css-sourcemap/vite.config.js index e51cf320ad76e1..490bdd144e5672 100644 --- a/playground/css-sourcemap/vite.config.js +++ b/playground/css-sourcemap/vite.config.js @@ -31,6 +31,9 @@ export default defineConfig({ } }, }, + sass: { + api: 'modern-compiler', + }, }, }, build: { From 93a38b927547134fe522ac00785a84e27ff7ae28 Mon Sep 17 00:00:00 2001 From: Hiroshi Ogawa Date: Sat, 24 Aug 2024 11:51:58 +0900 Subject: [PATCH 3/6] Revert "fix: fix sass modern source map" This reverts commit 1565a02eb83d7f4d370967e4dc9c519b0cc5cd03. --- packages/vite/src/node/plugins/css.ts | 10 ---------- 1 file changed, 10 deletions(-) diff --git a/packages/vite/src/node/plugins/css.ts b/packages/vite/src/node/plugins/css.ts index b65b356db7f4b2..e447a486fc39b7 100644 --- a/packages/vite/src/node/plugins/css.ts +++ b/packages/vite/src/node/plugins/css.ts @@ -2276,11 +2276,6 @@ const makeModernScssWorker = ( ] const result = await sass.compileStringAsync(data, sassOptions) - if (result.sourceMap) { - result.sourceMap.sources = result.sourceMap.sources.map((url) => - url.startsWith('file://') ? fileURLToPath(url) : url, - ) - } return { css: result.css, map: result.sourceMap ? JSON.stringify(result.sourceMap) : undefined, @@ -2367,11 +2362,6 @@ const makeModernCompilerScssWorker = ( ] const result = await compiler.compileStringAsync(data, sassOptions) - if (result.sourceMap) { - result.sourceMap.sources = result.sourceMap.sources.map((url) => - url.startsWith('file://') ? fileURLToPath(url) : url, - ) - } return { css: result.css, map: result.sourceMap ? JSON.stringify(result.sourceMap) : undefined, From 0f60e3e72df19bfd4cf42330c44ede16b5993ad6 Mon Sep 17 00:00:00 2001 From: Hiroshi Ogawa Date: Sat, 24 Aug 2024 11:52:36 +0900 Subject: [PATCH 4/6] refactor: move outside --- packages/vite/src/node/plugins/css.ts | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/packages/vite/src/node/plugins/css.ts b/packages/vite/src/node/plugins/css.ts index e447a486fc39b7..05227b3fc89292 100644 --- a/packages/vite/src/node/plugins/css.ts +++ b/packages/vite/src/node/plugins/css.ts @@ -2438,6 +2438,12 @@ const scssProcessor = ( ? JSON.parse(result.map.toString()) : undefined + if (map) { + map.sources = map.sources.map((url) => + url.startsWith('file://') ? normalizePath(fileURLToPath(url)) : url, + ) + } + return { code: result.css.toString(), map, From ab60d87fdc61b544ba5d539bfa59a3664b78e05b Mon Sep 17 00:00:00 2001 From: Hiroshi Ogawa Date: Sat, 24 Aug 2024 12:03:25 +0900 Subject: [PATCH 5/6] test: copy tests --- .../sass-modern-compiler.spec.ts | 1 + .../__tests__/sass-modern/sass-modern.spec.ts | 1 + .../vite.config-sass-modern-compiler.js | 15 +++++++++++++++ .../css-sourcemap/vite.config-sass-modern.js | 15 +++++++++++++++ playground/css-sourcemap/vite.config.js | 3 --- playground/vitestGlobalSetup.ts | 10 ++++++++++ 6 files changed, 42 insertions(+), 3 deletions(-) create mode 100644 playground/css-sourcemap/__tests__/sass-modern-compiler/sass-modern-compiler.spec.ts create mode 100644 playground/css-sourcemap/__tests__/sass-modern/sass-modern.spec.ts create mode 100644 playground/css-sourcemap/vite.config-sass-modern-compiler.js create mode 100644 playground/css-sourcemap/vite.config-sass-modern.js diff --git a/playground/css-sourcemap/__tests__/sass-modern-compiler/sass-modern-compiler.spec.ts b/playground/css-sourcemap/__tests__/sass-modern-compiler/sass-modern-compiler.spec.ts new file mode 100644 index 00000000000000..371c61a76d0049 --- /dev/null +++ b/playground/css-sourcemap/__tests__/sass-modern-compiler/sass-modern-compiler.spec.ts @@ -0,0 +1 @@ +import '../css-sourcemap.spec' diff --git a/playground/css-sourcemap/__tests__/sass-modern/sass-modern.spec.ts b/playground/css-sourcemap/__tests__/sass-modern/sass-modern.spec.ts new file mode 100644 index 00000000000000..371c61a76d0049 --- /dev/null +++ b/playground/css-sourcemap/__tests__/sass-modern/sass-modern.spec.ts @@ -0,0 +1 @@ +import '../css-sourcemap.spec' diff --git a/playground/css-sourcemap/vite.config-sass-modern-compiler.js b/playground/css-sourcemap/vite.config-sass-modern-compiler.js new file mode 100644 index 00000000000000..83ba1b829b55c8 --- /dev/null +++ b/playground/css-sourcemap/vite.config-sass-modern-compiler.js @@ -0,0 +1,15 @@ +import { defineConfig, mergeConfig } from 'vite' +import baseConfig from './vite.config.js' + +export default mergeConfig( + baseConfig, + defineConfig({ + css: { + preprocessorOptions: { + sass: { + api: 'modern-compiler', + }, + }, + }, + }), +) diff --git a/playground/css-sourcemap/vite.config-sass-modern.js b/playground/css-sourcemap/vite.config-sass-modern.js new file mode 100644 index 00000000000000..739507a13caf27 --- /dev/null +++ b/playground/css-sourcemap/vite.config-sass-modern.js @@ -0,0 +1,15 @@ +import { defineConfig, mergeConfig } from 'vite' +import baseConfig from './vite.config.js' + +export default mergeConfig( + baseConfig, + defineConfig({ + css: { + preprocessorOptions: { + sass: { + api: 'modern', + }, + }, + }, + }), +) diff --git a/playground/css-sourcemap/vite.config.js b/playground/css-sourcemap/vite.config.js index 490bdd144e5672..e51cf320ad76e1 100644 --- a/playground/css-sourcemap/vite.config.js +++ b/playground/css-sourcemap/vite.config.js @@ -31,9 +31,6 @@ export default defineConfig({ } }, }, - sass: { - api: 'modern-compiler', - }, }, }, build: { diff --git a/playground/vitestGlobalSetup.ts b/playground/vitestGlobalSetup.ts index d97dec019d411e..33557acd43245f 100644 --- a/playground/vitestGlobalSetup.ts +++ b/playground/vitestGlobalSetup.ts @@ -52,6 +52,16 @@ export async function setup({ provide }: GlobalSetupContext): Promise { path.resolve(tempDir, 'css__sass-modern-compiler'), { recursive: true }, ) + await fs.cp( + path.resolve(tempDir, 'css-sourcemap'), + path.resolve(tempDir, 'css-sourcemap__sass-modern'), + { recursive: true }, + ) + await fs.cp( + path.resolve(tempDir, 'css-sourcemap'), + path.resolve(tempDir, 'css-sourcemap__sass-modern-compiler'), + { recursive: true }, + ) } export async function teardown(): Promise { From f43c24ae3cf7d94eb67f25ef130e40e2e73de8e0 Mon Sep 17 00:00:00 2001 From: Hiroshi Ogawa Date: Sat, 24 Aug 2024 12:07:46 +0900 Subject: [PATCH 6/6] test: minor refactor --- playground/vitestGlobalSetup.ts | 32 ++++++++++++-------------------- 1 file changed, 12 insertions(+), 20 deletions(-) diff --git a/playground/vitestGlobalSetup.ts b/playground/vitestGlobalSetup.ts index 33557acd43245f..b47918f042e2d2 100644 --- a/playground/vitestGlobalSetup.ts +++ b/playground/vitestGlobalSetup.ts @@ -42,26 +42,18 @@ export async function setup({ provide }: GlobalSetupContext): Promise { } }) // also setup dedicated copy for "variant" tests - await fs.cp( - path.resolve(tempDir, 'css'), - path.resolve(tempDir, 'css__sass-modern'), - { recursive: true }, - ) - await fs.cp( - path.resolve(tempDir, 'css'), - path.resolve(tempDir, 'css__sass-modern-compiler'), - { recursive: true }, - ) - await fs.cp( - path.resolve(tempDir, 'css-sourcemap'), - path.resolve(tempDir, 'css-sourcemap__sass-modern'), - { recursive: true }, - ) - await fs.cp( - path.resolve(tempDir, 'css-sourcemap'), - path.resolve(tempDir, 'css-sourcemap__sass-modern-compiler'), - { recursive: true }, - ) + for (const [original, variants] of [ + ['css', ['sass-modern', 'sass-modern-compiler']], + ['css-sourcemap', ['sass-modern', 'sass-modern-compiler']], + ] as const) { + for (const variant of variants) { + await fs.cp( + path.resolve(tempDir, original), + path.resolve(tempDir, `${original}__${variant}`), + { recursive: true }, + ) + } + } } export async function teardown(): Promise {