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.