test: run css sourcemap playground for legacy sass

playground/css/vite.config-sass-legacy.js

@@ -0,0 +1,33 @@
+import path from 'node:path'
+import { pathToFileURL } from 'node:url'
+import { defineConfig } from 'vite'
+import baseConfig from './vite.config.js'
+
+export default defineConfig({
+  ...baseConfig,
+  css: {
+    ...baseConfig.css,
+    preprocessorOptions: {
+      ...baseConfig.css.preprocessorOptions,
+      scss: {
+        api: 'legacy',
+        importer: [
+          function (url) {
+            return url === 'virtual-dep' ? { contents: '' } : null
+          },
+          function (url) {
+            return url === 'virtual-file-absolute'
+              ? {
+                  contents: `@use "${pathToFileURL(path.join(import.meta.dirname, 'file-absolute.scss')).href}"`,
+                }
+              : null
+          },
+          function (url) {
+            return url.endsWith('.wxss') ? { contents: '' } : null
+          },
+        ],
+        silenceDeprecations: ['legacy-js-api'],
+      },
+    },
+  },
+})

playground/css/vite.config-sass-modern.js

@@ -1,5 +1,3 @@
-import { pathToFileURL } from 'node:url'
-import path from 'node:path'
 import { defineConfig } from 'vite'
 import baseConfig from './vite.config.js'
 
@@ -10,36 +8,10 @@ export default defineConfig({
     preprocessorOptions: {
       ...baseConfig.css.preprocessorOptions,
       scss: {
+        .../** @type {import('vite').SassPreprocessorOptions & { api?: undefined }} */ (
+          baseConfig.css.preprocessorOptions.scss
+        ),
         api: 'modern',
-        additionalData: `$injectedColor: orange;`,
-        importers: [
-          {
-            canonicalize(url) {
-              return url === 'virtual-dep'
-                ? new URL('custom-importer:virtual-dep')
-                : null
-            },
-            load() {
-              return {
-                contents: ``,
-                syntax: 'scss',
-              }
-            },
-          },
-          {
-            canonicalize(url) {
-              return url === 'virtual-file-absolute'
-                ? new URL('custom-importer:virtual-file-absolute')
-                : null
-            },
-            load() {
-              return {
-                contents: `@use "${pathToFileURL(path.join(import.meta.dirname, 'file-absolute.scss')).href}"`,
-                syntax: 'scss',
-              }
-            },
-          },
-        ],
       },
     },
   },

playground/css/vite.config.js

@@ -61,24 +61,35 @@ export default defineConfig({
     },
     preprocessorOptions: {
       scss: {
-        api: 'legacy',
         additionalData: `$injectedColor: orange;`,
-        importer: [
-          function (url) {
-            return url === 'virtual-dep' ? { contents: '' } : null
+        importers: [
+          {
+            canonicalize(url) {
+              return url === 'virtual-dep'
+                ? new URL('custom-importer:virtual-dep')
+                : null
+            },
+            load() {
+              return {
+                contents: ``,
+                syntax: 'scss',
+              }
+            },
           },
-          function (url) {
-            return url === 'virtual-file-absolute'
-              ? {
-                  contents: `@use "${pathToFileURL(path.join(import.meta.dirname, 'file-absolute.scss')).href}"`,
-                }
-              : null
-          },
-          function (url) {
-            return url.endsWith('.wxss') ? { contents: '' } : null
+          {
+            canonicalize(url) {
+              return url === 'virtual-file-absolute'
+                ? new URL('custom-importer:virtual-file-absolute')
+                : null
+            },
+            load() {
+              return {
+                contents: `@use "${pathToFileURL(path.join(import.meta.dirname, 'file-absolute.scss')).href}"`,
+                syntax: 'scss',
+              }
+            },
           },
         ],
-        silenceDeprecations: ['legacy-js-api'],
       },
       styl: {
         additionalData: `$injectedColor ?= orange`,