diff --git a/packages/playground/css/__tests__/css.spec.ts b/packages/playground/css/__tests__/css.spec.ts index 9869bb34d2c690..e666ca40517d57 100644 --- a/packages/playground/css/__tests__/css.spec.ts +++ b/packages/playground/css/__tests__/css.spec.ts @@ -413,3 +413,13 @@ test("relative path rewritten in Less's data-uri", async () => { /^url\("data:image\/svg\+xml,%3Csvg/ ) }) + +test('PostCSS source.input.from includes query', async () => { + const code = await page.textContent('.postcss-source-input') + // should resolve assets + expect(code).toContain( + isBuild + ? '/postcss-source-input.css?used&query=foo' + : '/postcss-source-input.css?query=foo' + ) +}) diff --git a/packages/playground/css/index.html b/packages/playground/css/index.html index fef6a0be393748..15e81192cec7f1 100644 --- a/packages/playground/css/index.html +++ b/packages/playground/css/index.html @@ -135,6 +135,9 @@

CSS

Raw Support


+
+  

PostCSS source.input.from. Should include query

+

 
 
 
diff --git a/packages/playground/css/main.js b/packages/playground/css/main.js
index 0d03aafbf0ec7f..f728b0251066d1 100644
--- a/packages/playground/css/main.js
+++ b/packages/playground/css/main.js
@@ -87,3 +87,6 @@ Promise.all(Object.keys(glob).map((key) => glob[key]())).then((res) => {
 // globEager
 const globEager = import.meta.globEager('./glob-import/*.css')
 text('.imported-css-globEager', JSON.stringify(globEager, null, 2))
+
+import postcssSourceInput from './postcss-source-input.css?query=foo'
+text('.postcss-source-input', postcssSourceInput)
diff --git a/packages/playground/css/postcss-source-input.css b/packages/playground/css/postcss-source-input.css
new file mode 100644
index 00000000000000..c6c3cb0c16dece
--- /dev/null
+++ b/packages/playground/css/postcss-source-input.css
@@ -0,0 +1 @@
+@source-input;
diff --git a/packages/playground/css/postcss.config.js b/packages/playground/css/postcss.config.js
index f3d6ac9548b6a9..e90b4f9c987820 100644
--- a/packages/playground/css/postcss.config.js
+++ b/packages/playground/css/postcss.config.js
@@ -1,5 +1,5 @@
 module.exports = {
-  plugins: [require('postcss-nested'), testDirDep]
+  plugins: [require('postcss-nested'), testDirDep, testSourceInput]
 }
 
 const fs = require('fs')
@@ -35,3 +35,16 @@ function testDirDep() {
   }
 }
 testDirDep.postcss = true
+
+function testSourceInput() {
+  return {
+    postcssPlugin: 'source-input',
+    AtRule(atRule) {
+      if (atRule.name === 'source-input') {
+        atRule.after(`/* ${atRule.source.input.from} */`)
+        atRule.remove()
+      }
+    }
+  }
+}
+testSourceInput.postcss = true
diff --git a/packages/vite/src/node/plugins/css.ts b/packages/vite/src/node/plugins/css.ts
index 04c4ebeea95332..cd57acd1690902 100644
--- a/packages/vite/src/node/plugins/css.ts
+++ b/packages/vite/src/node/plugins/css.ts
@@ -799,8 +799,8 @@ async function compileCSS(
     .default(postcssPlugins)
     .process(code, {
       ...postcssOptions,
-      to: cleanUrl(id),
-      from: cleanUrl(id),
+      to: id,
+      from: id,
       map: {
         inline: false,
         annotation: false,