前端
技术栈说明
Free FS 前端使用的核心技术和框架。
核心框架
- Vue 3 3.2.40 - 渐进式 JavaScript 框架
- Vite 3.2.5 - 下一代前端构建工具
- Pinia 2.0.23 - 现代化的状态管理库
- Vue Router 4.0.14 - 官方路由管理器
- TypeScript 4.9.5 - JavaScript 的超集,提供类型支持
UI 组件库
- Arco Design Vue 2.44.7 - 字节跳动企业级设计语言和组件库
- Arco Design Pro Vue 2.7.3 - 基于 Arco Design 的中后台解决方案
工具库
- Axios 1.7.4 - 基于 Promise 的 HTTP 客户端
- Day.js 1.11.5 - 轻量级日期处理库
- VueUse 10.0.0 - Vue Composition API 工具集合
- Radash 12.1.0 - 现代化的工具函数库
- Mitt 3.0.0 - 事件总线库
- Query String 8.0.3 - URL 查询字符串解析库
数据可视化
- ECharts 5.4.0 - 强大的数据可视化图表库
- Vue ECharts 6.2.3 - ECharts 的 Vue 3 封装
文件处理
- Spark MD5 3.0.2 - 快速计算文件 MD5 哈希值(用于秒传功能)
- SortableJS 1.15.0 - 拖拽排序库
动画与交互
- GSAP 3.13.0 - 专业级动画库
- Motion V 1.7.4 - Vue 3 动画库
- Vue3 Lottie 3.3.1 - Lottie 动画支持
图标库
- IconPark 1.4.2 - 字节跳动图标库
进度与加载
- NProgress 0.2.0 - 页面顶部进度条
样式处理
- Less 4.1.3 - CSS 预处理器
代码质量工具
- ESLint 8.25.0 - JavaScript/TypeScript 代码检查工具
- Prettier 2.7.1 - 代码格式化工具
- Stylelint 14.16.1 - CSS 代码检查工具
- Husky 8.0.1 - Git Hooks 工具
- lint-staged 13.0.3 - 对暂存文件运行 linter
构建工具
Vite 插件
- @vitejs/plugin-vue 3.1.2 - Vue 3 单文件组件支持
- @vitejs/plugin-vue-jsx 2.0.1 - Vue 3 JSX 支持
- unplugin-vue-components 0.24.1 - 自动导入组件
- vite-plugin-compression 0.5.1 - Gzip/Brotli 压缩
- vite-plugin-imagemin 0.6.1 - 图片压缩
- vite-plugin-monaco-editor 2.0.2 - Monaco Editor 支持
- vite-svg-loader 3.6.0 - SVG 文件加载器
项目结构
free-fs-vue/
├── src/
│ ├── api/ # API 接口定义
│ ├── assets/ # 静态资源
│ ├── components/ # 公共组件
│ ├── config/ # 配置文件
│ ├── directives/ # 自定义指令
│ ├── hooks/ # Composition API Hooks
│ ├── layouts/ # 布局组件
│ ├── router/ # 路由配置
│ ├── stores/ # Pinia 状态管理
│ ├── styles/ # 全局样式
│ ├── utils/ # 工具函数
│ └── views/ # 页面组件
├── config/ # Vite 配置文件
├── public/ # 公共静态资源
└── package.json # 项目依赖配置