egova-urbanpro-web

前端框架技术路线

Vite + Vue3 + TypeScript + Ant Design Vue + ZartUI-Web

包管理工具

pnpm

1 安装

1.1 脚手架

1.1.1 安装脚手架

pnpm add -g egova-urbanpro-cli

1.1.2 创建项目

# egova-urbanpro-cli create [options] [template]
egova-urbanpro-cli create

1.1.3 创建组件

# egova-urbanpro-cli [options] component <name> [folder]
egova-urbanpro-cli component component-name src/components

注：[folder] 可省略，默认为 src/components，创建的组件将自动以字母 C 开头

• components 内组件应该以字母 C 开头，意为组件
• views 内组件应该以字母 V 开头，意为页面

1.1.4 安装项目依赖

pnpm install

1.2 IDE 支持

推荐使用 Visual Studio Code

1.2.1 VSCode 插件

• Vue Language Features (Volar)
• Prettier
• ESLint
• Stylelint

1.3 项目结构

根据代码仓库规范与业务划分原则，将核心平台仓库拆分为 web、core、extend、projects 仓库，业务代码仓库按同样规则拆分，项目结构如下：

egova-urbanpro
├── egova-urbanpro-platform                 # 核心平台
│   ├── egova-urbanpro-core                 # 核心平台 core
│   ├── egova-urbanpro-extend               # 核心平台 extend
│   └── egova-urbanpro-web                  # 核心平台 web
├── egova-urbanpro-mis                      # MIS 业务
│   ├── egova-urbanpro-mis-core
│   ├── egova-urbanpro-mis-extend
│   └── egova-urbanpro-mis-projects
└── zartui-web                              # ZartUI

2 命令

2.1 开发

pnpm dev

2.2 打包

pnpm build

2.3 打包预览

pnpm preview

2.4 打包文件分析统计

pnpm analyse

2.5 Lint with ESLint & Stylelint

# 检查修复
pnpm lint

# 仅检查 es
pnpm lint:es

# 仅检查 style
pnpm lint:style

3 开发说明

3.1 环境变量

系统环境变量定义在 .env.development 中：

########## 代理配置 ##########
# 主代理
PROXY_PATH_API=http://localhost:8080

# GIS 代理
PROXY_PATH_API_GIS=http://localhost:8080

开发时，不建议修改 .env.development 文件，应该新建 .env.development.local 文件定义本地变量。此文件会被 git 忽略，不会提交。

参考文档 环境变量和模式

3.2 开发文档

系统开发说明