# Urban Lifeline Web 微前端项目

基于 Import Maps 的微前端架构，包含共享模块和多个业务应用。

## 📦 项目结构

```
urbanLifelineWeb/
├── packages/
│   ├── shared/          # 共享模块 (端口 5000)
│   ├── platform/        # 主平台应用 (端口 5001)
│   ├── bidding/         # 招标管理应用 (端口 5002)
│   └── workcase/        # 案例管理应用 (端口 5003)
└── package.json
```

## 🚀 快速开始

### 1. 安装依赖

```bash
# 一键安装所有包的依赖
npm run install:all

# 或单独安装
npm run install:shared
npm run install:platform
npm run install:bidding
npm run install:workcase
```

### 2. 启动开发服务器

```bash
# 同时启动所有服务
npm run dev:all

# 或单独启动
npm run dev:shared      # http://localhost:5000
npm run dev:platform    # http://localhost:5001
npm run dev:bidding     # http://localhost:5002
npm run dev:workcase    # http://localhost:5003
```

### 3. 构建生产版本

```bash
# 构建所有应用
npm run build:all

# 或单独构建
npm run build:shared
npm run build:platform
npm run build:bidding
npm run build:workcase
```

## 🌐 端口分配

| 服务 | 端口 | 说明 |
|------|------|------|
| Shared | 5000 | 共享组件和工具库 |
| Platform | 5001 | 主平台应用 |
| Bidding | 5002 | 招标管理应用 |
| Workcase | 5003 | 案例管理应用 |

## 🔧 技术栈

- **框架**: Vue 3.5 + TypeScript
- **构建工具**: Vite 6.0
- **UI 组件库**: Element Plus 2.9
- **状态管理**: Pinia 2.2
- **路由**: Vue Router 4.5
- **工具库**: VueUse

## 📝 开发说明

### Import Maps

本项目使用 Import Maps 实现模块共享：

```html
<script type="importmap">
{
  "imports": {
    "@shared/components": "http://localhost:5000/shared/components.js",
    "@shared/utils": "http://localhost:5000/shared/utils.js",
    "@shared/api": "http://localhost:5000/shared/api.js"
  }
}
</script>
```

### API 代理

所有应用的 `/api` 请求会代理到后端服务 `http://localhost:8080`

### 跨域配置

开发环境下所有服务已启用 CORS，支持跨域访问。

## 🔥 注意事项

1. **启动顺序**: 建议先启动 `shared` 服务，再启动其他应用
2. **端口占用**: 确保 5000-5003 端口未被占用
3. **Node 版本**: 建议使用 Node.js 18+ 
4. **依赖安装**: 首次运行前必须执行 `npm run install:all`