diff --git a/e2e/cases/plugin-api/plugin-transform-error-handle/index.test.ts b/e2e/cases/plugin-api/plugin-transform-error-handle/index.test.ts index 274b32d33b..1b5c04a630 100644 --- a/e2e/cases/plugin-api/plugin-transform-error-handle/index.test.ts +++ b/e2e/cases/plugin-api/plugin-transform-error-handle/index.test.ts @@ -8,8 +8,7 @@ rspackOnlyTest('should handle transform error in dev mode', async () => { await expectPoll(() => logs.some( - (log) => - log.includes('transform error') && log.includes('Failed to compile'), + (log) => log.includes('transform error') && log.includes('Build error:'), ), ).toBeTruthy(); diff --git a/e2e/cases/server/overlay-type-errors/index.test.ts b/e2e/cases/server/overlay-type-errors/index.test.ts index a211948938..08b68ea2b4 100644 --- a/e2e/cases/server/overlay-type-errors/index.test.ts +++ b/e2e/cases/server/overlay-type-errors/index.test.ts @@ -24,10 +24,10 @@ test('should display type errors on overlay correctly', async ({ page }) => { await expect(errorOverlay.locator('.title')).toHaveText('Build failed'); - // The first span is "TS2322: " - const firstSpan = errorOverlay.locator('span').first(); - expect(await firstSpan.textContent()).toEqual('TS2322: '); - expect(await firstSpan.getAttribute('style')).toEqual('color:#888;'); + // Get "TS2322: " + const tsSpan = errorOverlay.locator('span').getByText('TS2322: '); + expect(await tsSpan.textContent()).toEqual('TS2322: '); + expect(await tsSpan.getAttribute('style')).toEqual('color:#888;'); // The first link is "./path/to/src/index.ts:3:1" const firstLink = errorOverlay.locator('.file-link').first(); diff --git a/packages/core/src/helpers/format.ts b/packages/core/src/helpers/format.ts index 3ed577725e..140a623dde 100644 --- a/packages/core/src/helpers/format.ts +++ b/packages/core/src/helpers/format.ts @@ -1,6 +1,13 @@ import type { StatsCompilation, StatsError } from '@rspack/core'; import color from '../../compiled/picocolors/index.js'; +const formatFileName = (fileName: string) => { + // add default column add lines for linking + return /:\d+:\d+/.test(fileName) + ? `File: ${color.cyan(fileName)}\n` + : `File: ${color.cyan(fileName)}:1:1\n`; +}; + function resolveFileName(stats: StatsError) { // Get the real source file path with stats.moduleIdentifier. // e.g. moduleIdentifier is "builtin:react-refresh-loader!/Users/x/src/App.jsx" @@ -10,15 +17,14 @@ function resolveFileName(stats: StatsError) { if (matched) { const fileName = matched.pop(); if (fileName) { - // add default column add lines for linking - return `File: ${fileName}:1:1\n`; + return formatFileName(fileName); } } } // fallback to file or moduleName if moduleIdentifier parse failed const file = stats.file || stats.moduleName; - return file ? `File: ${file}\n` : ''; + return file ? formatFileName(file) : ''; } function resolveModuleTrace(stats: StatsError) { diff --git a/packages/core/src/helpers/stats.ts b/packages/core/src/helpers/stats.ts index 1f183a4b69..64c3417c4a 100644 --- a/packages/core/src/helpers/stats.ts +++ b/packages/core/src/helpers/stats.ts @@ -6,18 +6,15 @@ import { isMultiCompiler } from './'; import { formatStatsMessages } from './format.js'; function formatErrorMessage(errors: string[]) { - const title = color.bold(color.red('Compile error: ')); + const title = color.bold(color.red('Build error: ')); if (!errors.length) { return `${title}\n${color.yellow(`For more details, please setting 'stats.errors: true' `)}`; } - const tip = color.yellow( - 'Failed to compile, check the errors for troubleshooting.', - ); const text = `${errors.join('\n\n')}\n`; - return `${title}\n${tip}\n${text}`; + return `${title}\n${text}`; } export const getAllStatsErrors = ( diff --git a/website/docs/en/guide/faq/exceptions.mdx b/website/docs/en/guide/faq/exceptions.mdx index f420d360b1..a059eec9b0 100644 --- a/website/docs/en/guide/faq/exceptions.mdx +++ b/website/docs/en/guide/faq/exceptions.mdx @@ -8,7 +8,7 @@ When this happens, you can specify directories or modules that need to be compil --- -### Compile error `Error: [object Object] is not a PostCSS plugin` ? +### Build error `Error: [object Object] is not a PostCSS plugin` ? Currently, Rsbuild is using PostCSS v8. If you encounter the `Error: [object Object] is not a PostCSS plugin` error during the compilation process, it is usually caused by referencing the wrong version of PostCSS, for example, the version of `postcss` (peerDependencies) in `cssnano` does not meet expectations. @@ -25,7 +25,7 @@ npm ls postcss --- -### Compile error `You may need additional loader`? +### Build error `You may need additional loader`? If the following error message is encountered during the compilation process, it means that there are individual files that cannot be compiled correctly.