diff --git a/packages/vite/src/node/plugins/html.ts b/packages/vite/src/node/plugins/html.ts index 1731a8aad57e5e..6abc7b4309fd0f 100644 --- a/packages/vite/src/node/plugins/html.ts +++ b/packages/vite/src/node/plugins/html.ts @@ -1,7 +1,7 @@ import path from 'path' import { Plugin } from '../plugin' import { ViteDevServer } from '../server' -import { OutputAsset, OutputBundle, OutputChunk } from 'rollup' +import { OutputAsset, OutputBundle, OutputChunk, RollupError } from 'rollup' import { cleanUrl, generateCodeFrame, @@ -25,7 +25,8 @@ import { AttributeNode, NodeTransform, NodeTypes, - ElementNode + ElementNode, + CompilerError } from '@vue/compiler-dom' const htmlProxyRE = /\?html-proxy&index=(\d+)\.js$/ @@ -114,14 +115,7 @@ export async function traverseHtml( nodeTransforms: [visitor] }) } catch (e) { - const parseError = { - loc: filePath, - frame: '', - ...formatParseError(e, filePath, html) - } - throw new Error( - `Unable to parse ${JSON.stringify(parseError.loc)}\n${parseError.frame}` - ) + handleParseError(e, html, filePath) } } @@ -148,17 +142,44 @@ export function getScriptInfo(node: ElementNode): { return { src, isModule, isAsync } } -function formatParseError(e: any, id: string, html: string): Error { - // normalize the error to rollup format - if (e.loc) { - e.frame = generateCodeFrame(html, e.loc.start.offset) - e.loc = { +/** + * Format Vue @type {CompilerError} to @type {RollupError} + */ +function formatParseError( + compilerError: CompilerError, + id: string, + html: string +): RollupError { + const formattedError = { ...compilerError } as RollupError + if (compilerError.loc) { + formattedError.frame = generateCodeFrame( + html, + compilerError.loc.start.offset + ) + formattedError.loc = { file: id, - line: e.loc.start.line, - column: e.loc.start.column + line: compilerError.loc.start.line, + column: compilerError.loc.start.column } } - return e + return formattedError +} + +function handleParseError( + compilerError: CompilerError, + html: string, + filePath: string +) { + const parseError = { + loc: filePath, + frame: '', + ...formatParseError(compilerError, filePath, html) + } + throw new Error( + `Unable to parse HTML; ${compilerError.message}\n at ${JSON.stringify( + parseError.loc + )}\n${parseError.frame}` + ) } /**