add error hints (#3350)

* add error hints

* chore: add changeset

Co-authored-by: Nate Moore <nate@skypack.dev>
This commit is contained in:
Fred K. Schott 2022-05-12 10:29:59 -06:00 committed by GitHub
parent 8666f22a0f
commit e48aa2fd1e
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 19 additions and 0 deletions

View file

@ -0,0 +1,5 @@
---
'astro': patch
---
Improve error hints for packages that should be added to `vite.ssr.noExternal`

View file

@ -9,6 +9,7 @@ export interface ErrorWithMetadata {
[name: string]: any; [name: string]: any;
message: string; message: string;
stack: string; stack: string;
hint?: string;
id?: string; id?: string;
frame?: string; frame?: string;
plugin?: string; plugin?: string;
@ -40,6 +41,13 @@ export function fixViteErrorMessage(_err: unknown, server: ViteDevServer) {
return err; return err;
} }
function generateHint(err: ErrorWithMetadata): string | undefined {
if (/Unknown file extension \"\.(jsx|vue|svelte|astro)\" for /.test(err.message)) {
return 'You likely need to add this package to `vite.ssr.noExternal` in your astro config file.';
}
return undefined;
}
/** /**
* Takes any error-like object and returns a standardized Error + metadata object. * Takes any error-like object and returns a standardized Error + metadata object.
* Useful for consistent reporting regardless of where the error surfaced from. * Useful for consistent reporting regardless of where the error surfaced from.
@ -70,9 +78,11 @@ export function collectErrorMetadata(e: any): ErrorWithMetadata {
if (pluginName) { if (pluginName) {
err.plugin = pluginName; err.plugin = pluginName;
} }
err.hint = generateHint(err);
return err; return err;
} }
// Generic error (probably from Vite, and already formatted) // Generic error (probably from Vite, and already formatted)
e.hint = generateHint(e);
return e; return e;
} }

View file

@ -212,6 +212,10 @@ export function formatConfigErrorMessage(err: ZodError) {
export function formatErrorMessage(_err: Error, args: string[] = []): string { export function formatErrorMessage(_err: Error, args: string[] = []): string {
const err = collectErrorMetadata(_err); const err = collectErrorMetadata(_err);
args.push(`${bgRed(black(` error `))}${red(bold(padMultilineString(err.message)))}`); args.push(`${bgRed(black(` error `))}${red(bold(padMultilineString(err.message)))}`);
if (err.hint) {
args.push(` ${bold('Hint:')}`);
args.push(yellow(padMultilineString(err.hint, 4)));
}
if (err.id) { if (err.id) {
args.push(` ${bold('File:')}`); args.push(` ${bold('File:')}`);
args.push(red(` ${err.id}`)); args.push(red(` ${err.id}`));