diff --git a/Dockerfile b/Dockerfile index 72ed022..9b5f001 100644 --- a/Dockerfile +++ b/Dockerfile @@ -15,4 +15,4 @@ VOLUME ["/etc/nginx/nginx.conf", "/usr/share/nginx/html"] CMD ["nginx","-g","daemon off;"] -# docker build -t docker.ges.bjgastx.com/itc-web:1.1.1 . +# docker build -t docker.ges.bjgastx.com/itc-web:1.1.3 . diff --git a/build/script/postBuild.ts b/build/script/postBuild.ts index 42635d8..b418e36 100644 --- a/build/script/postBuild.ts +++ b/build/script/postBuild.ts @@ -15,8 +15,21 @@ export const runBuild = async () => { } console.log(`✨ ${colors.cyan(`[${pkg.name}]`)}` + ' - build successfully!'); - } catch (error) { - console.log(colors.red('vite build error:\n' + error)); + } catch (error: any) { + console.error('\n'); + console.error(colors.red('╔══════════════════════════════════════════════════════════════════╗')); + console.error(colors.red('║ 构建后处理错误 ║')); + console.error(colors.red('╚══════════════════════════════════════════════════════════════════╝')); + console.error('\n'); + console.error(colors.yellow('错误详情:')); + console.error(error); + + if (error.stack) { + console.error('\n'); + console.error(colors.yellow('错误堆栈:')); + console.error(error.stack); + } + process.exit(1); } }; diff --git a/build/vite/plugin/errorReporter.ts b/build/vite/plugin/errorReporter.ts new file mode 100644 index 0000000..f5713e8 --- /dev/null +++ b/build/vite/plugin/errorReporter.ts @@ -0,0 +1,99 @@ +import { PluginOption } from 'vite'; +import colors from 'picocolors'; + +// 用于跟踪当前正在处理的文件 +let currentProcessingFile: string | null = null; + +/** + * 增强构建错误报告的 Vite 插件 + * 用于捕获和显示详细的 Vue 编译错误信息 + */ +export function configErrorReporterPlugin(): PluginOption { + return { + name: 'vite-plugin-error-reporter', + enforce: 'pre', + + // 捕获转换开始 + transform(code, id) { + if (id.endsWith('.vue')) { + currentProcessingFile = id; + } + return null; + }, + + // 捕获构建错误 + buildEnd(error) { + if (error) { + console.error('\n'); + console.error(colors.red('╔══════════════════════════════════════════════════════════════════╗')); + console.error(colors.red('║ 构建错误详细信息 ║')); + console.error(colors.red('╚══════════════════════════════════════════════════════════════════╝')); + console.error('\n'); + + // 显示当前正在处理的文件 + if (currentProcessingFile) { + console.error(colors.red('当前正在处理的文件:')); + console.error(colors.cyan(currentProcessingFile)); + console.error('\n'); + } + + // 显示错误堆栈 + if (error.stack) { + console.error(colors.yellow('错误堆栈:')); + console.error(error.stack); + console.error('\n'); + } + + // 尝试提取文件路径 + const errorMessage = (error as any).message || ''; + const fileMatch = errorMessage.match(/in\s+([\w\-/.\\]+\.vue)/i) || + errorMessage.match(/at\s+([\w\-/.\\]+\.vue)/i) || + errorMessage.match(/([\w\-/.\\]+\.vue)/i); + + if (fileMatch) { + console.error(colors.yellow('可能出错的文件:')); + console.error(colors.cyan(fileMatch[1])); + console.error('\n'); + } + + // 显示原始错误信息 + console.error(colors.yellow('错误信息:')); + console.error(errorMessage); + console.error('\n'); + + // 提示常见解决方案 + console.error(colors.yellow('常见解决方案:')); + console.error('1. 检查 Vue 模板中