fix(css): backport #18113, fix missing source file warning with sass modern api custom importer (#18183)

Co-authored-by: Hiroshi Ogawa <[email protected]>

Author: sapphi-red

packages/vite/src/node/plugins/css.ts

@@ -2267,7 +2267,7 @@ const makeModernScssWorker = (
               fileURLToPath(canonicalUrl),
               options.filename,
             )
-            return { contents, syntax }
+            return { contents, syntax, sourceMapUrl: canonicalUrl }
           },
         }
         sassOptions.importers = [
@@ -2353,7 +2353,7 @@ const makeModernCompilerScssWorker = (
           )
           const contents =
             result.contents ?? (await fsp.readFile(result.file, 'utf-8'))
-          return { contents, syntax }
+          return { contents, syntax, sourceMapUrl: canonicalUrl }
         },
       }
       sassOptions.importers = [

playground/css-sourcemap/__tests__/css-sourcemap.spec.ts

@@ -139,14 +139,19 @@ describe.runIf(isServe)('serve', () => {
     expect(formatSourcemapForSnapshot(map)).toMatchInlineSnapshot(`
       {
         "ignoreList": [],
-        "mappings": "AACE;EACE",
+        "mappings": "AAGE;EACE,UCJM",
         "sources": [
           "/root/imported.sass",
+          "/root/imported-nested.sass",
         ],
         "sourcesContent": [
-          ".imported
+          "@import "/imported-nested.sass"
+
+      .imported
         &-sass
-          color: red
+          color: $primary
+      ",
+          "$primary: red
       ",
         ],
         "version": 3,

playground/css-sourcemap/imported-nested.sass

@@ -0,0 +1 @@
+$primary: red

playground/css-sourcemap/imported.sass

@@ -1,3 +1,5 @@
+@import "/imported-nested.sass"
+
 .imported
   &-sass
-    color: red
+    color: $primary