fix(frontend): 修复 element-plus 解析失败问题

问题原因:
- element-plus 2.14.x 的 package.json exports 包含 ./*: ./ 通配符
- Vite 5.x 的 import-analysis 在某些场景下无法解析该 exports 配置
- 新机器 git pull + npm install 后 Vite 缓存为空,首次预构建可能失败
- 报错: Failed to resolve entry for package 'element-plus'

解决方案:
1. vite.config.js resolve.alias 添加 element-plus 显式 fallback 路径
   即使 exports 解析失败也能直接定位到 es/index.mjs
2. start.sh 启动前自动清理 .vite 缓存,避免过期缓存问题
3. start.sh 失败自动重试+清缓存机制,提高首次启动成功率
This commit is contained in:
Your Name
2026-07-23 14:49:54 +08:00
parent 6076e174d5
commit 8b1df674ec
2 changed files with 30 additions and 4 deletions
+6 -1
View File
@@ -1,4 +1,5 @@
import { fileURLToPath, URL } from 'node:url' import { fileURLToPath, URL } from 'node:url'
import path from 'node:path'
import { defineConfig } from 'vite' import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue' import vue from '@vitejs/plugin-vue'
@@ -8,7 +9,11 @@ export default defineConfig({
plugins: [vue()], plugins: [vue()],
resolve: { resolve: {
alias: { alias: {
'@': fileURLToPath(new URL('./src', import.meta.url)) '@': fileURLToPath(new URL('./src', import.meta.url)),
// 兜底:若 element-plus exports 解析失败则走 fallback
'element-plus': path.resolve(
fileURLToPath(new URL('node_modules/element-plus/es/index.mjs', import.meta.url))
)
} }
}, },
server: { server: {
+24 -3
View File
@@ -147,6 +147,12 @@ start_frontend() {
# 检查端口并清理 # 检查端口并清理
kill_port $FRONTEND_PORT kill_port $FRONTEND_PORT
# 清理 Vite 缓存,避免 element-plus exports 解析失败
if [ -d "node_modules/.vite" ]; then
echo -e "${YELLOW}清理 Vite 缓存...${NC}"
rm -rf node_modules/.vite
fi
# 后台启动前端 # 后台启动前端
nohup npm run dev -- --host 0.0.0.0 --port $FRONTEND_PORT > /tmp/ipam-frontend.log 2>&1 & nohup npm run dev -- --host 0.0.0.0 --port $FRONTEND_PORT > /tmp/ipam-frontend.log 2>&1 &
FRONTEND_PID=$! FRONTEND_PID=$!
@@ -159,9 +165,24 @@ start_frontend() {
echo " 日志: /tmp/ipam-frontend.log" echo " 日志: /tmp/ipam-frontend.log"
return 0 return 0
else else
echo -e "${RED}❌ 前端服务启动失败${NC}" # 如果启动失败,尝试清缓存重试一次
echo " 查看日志: tail -50 /tmp/ipam-frontend.log" echo -e "${YELLOW}首次启动失败,尝试清理 Vite 缓存重试...${NC}"
return 1 kill -9 $FRONTEND_PID 2>/dev/null
sleep 1
rm -rf node_modules/.vite
nohup npm run dev -- --host 0.0.0.0 --port $FRONTEND_PORT > /tmp/ipam-frontend.log 2>&1 &
FRONTEND_PID=$!
sleep 12
if curl -s http://localhost:$FRONTEND_PORT > /dev/null; then
echo -e "${GREEN}✅ 前端服务启动成功 (端口 $FRONTEND_PORT)${NC}"
echo " PID: $FRONTEND_PID"
echo " 日志: /tmp/ipam-frontend.log"
return 0
else
echo -e "${RED}❌ 前端服务启动失败${NC}"
echo " 查看日志: tail -50 /tmp/ipam-frontend.log"
return 1
fi
fi fi
echo "" echo ""
} }