fix: code frame was not generated for postcss errors (#14986)

vitejs · Nov 15, 2023 · bedfcfa · bedfcfa
1 parent 2b4e793
commit bedfcfa
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 11 deletions.
diff --git a/packages/vite/src/node/plugins/css.ts b/packages/vite/src/node/plugins/css.ts
@@ -1191,12 +1191,12 @@ async function compileCSS(
           code,
           {
             line: warning.line,
-            column: warning.column,
+            column: warning.column - 1, // 1-based
           },
           warning.endLine !== undefined && warning.endColumn !== undefined
             ? {
                 line: warning.endLine,
-                column: warning.endColumn,
+                column: warning.endColumn - 1, // 1-based
               }
             : undefined,
         )}`
@@ -1207,8 +1207,9 @@ async function compileCSS(
     e.message = `[postcss] ${e.message}`
     e.code = code
     e.loc = {
-      column: e.column,
+      file: e.file,
       line: e.line,
+      column: e.column - 1, // 1-based
     }
     throw e
   }

diff --git a/packages/vite/src/node/server/pluginContainer.ts b/packages/vite/src/node/server/pluginContainer.ts
@@ -62,7 +62,6 @@ import { TraceMap, originalPositionFor } from '@jridgewell/trace-mapping'
 import MagicString from 'magic-string'
 import type { FSWatcher } from 'chokidar'
 import colors from 'picocolors'
-import type * as postcss from 'postcss'
 import type { Plugin } from '../plugin'
 import {
   cleanUrl,
@@ -429,15 +428,10 @@ export async function createPluginContainer(
     position: number | { column: number; line: number } | undefined,
     ctx: Context,
   ) {
-    const err = (
-      typeof e === 'string' ? new Error(e) : e
-    ) as postcss.CssSyntaxError & RollupError
+    const err = (typeof e === 'string' ? new Error(e) : e) as RollupError
     if (err.pluginCode) {
       return err // The plugin likely called `this.error`
     }
-    if (err.file && err.name === 'CssSyntaxError') {
-      err.id = normalizePath(err.file)
-    }
     if (ctx._activePlugin) err.plugin = ctx._activePlugin.name
     if (ctx._activeId && !err.id) err.id = ctx._activeId
     if (ctx._activeCode) {
@@ -483,7 +477,7 @@ export async function createPluginContainer(
           line: (err as any).line,
           column: (err as any).column,
         }
-        err.frame = err.frame || generateCodeFrame(err.id!, err.loc)
+        err.frame = err.frame || generateCodeFrame(ctx._activeCode, err.loc)
       }
 
       if (