minnan-collect-web

minnan-collect-web

闽南文化非遗采集端。用于给传承人采集闽南文化非遗相关信息。

技术栈

前端核心技术

• 框架: Vue 3
• 语言: TypeScript
• 构建工具: Vite
• 状态管理: Pinia
• 路由管理: Vue Router

UI 组件库

• Ant Design Vue
• Bootstrap

富文本编辑器

• TinyMCE

地图

• @vuemap/vue-amap (高德地图)

工具库

• @imengyu 系列库 (请求库、工具和组件)
• nprogress (进度条)
• vue-esign (电子签名)
• vue-clipboard3 (剪贴板)
• vue3-carousel (轮播图)

项目结构目录组织

src/
├── api/             # API 接口定义
├── assets/          # 静态资源
│   ├── fonts/       # 字体文件
│   ├── images/      # 图片资源
│   └── scss/        # 样式文件
├── common/          # 公共配置和工具
│   ├── config/      # 配置文件
│   └── upload/      # 上传相关
├── components/      # 通用组件
│   ├── content/     # 内容组件
│   ├── controls/    # 控制组件
│   ├── dynamicf/    # 动态表单组件
│   ├── icons/       # 图标组件
│   └── parts/       # 部分组件
├── pages/           # 页面组件
│   ├── admin/       # 管理页面
│   ├── components/  # 页面组件
│   └── forms/       # 表单页面
├── router/          # 路由配置
├── scripts/         # 脚本文件
├── stores/          # Pinia 状态管理
├── App.vue          # 根组件
└── main.ts          # 入口文件

开发与构建

开发命令

# 启动开发服务器
npm run dev

构建命令

# 构建项目
npm run build
# 构建项目然后打包并推送线上
npm run updater update post web

类型检查

# 执行TypeScript类型检查
npm run type-check