vue|一个基于vue3+vite+ts的完整项目 typescript|vue

文章图片

VUE VBEN ADMIN2.0 介绍 vue-vben-admin-2.0 是一个全新的开源系统,基于ant-design-vue2.x,typescript4,vue3,vite实现的 vue3 风格的后台管理系统。
项目基于ant-design-vue,typescript,vue3.0,vite,tailwindcss,tsx实现的 vue3 风格的后台管理系统，
gitHub 地址 vue-vben-admin2.0 - main 分支
预览地址 2.0 在线预览
文档 2.0 文档还没开始写。后续补上。
预安装环境要求

Node.js: - 版本最好大于 12.0.0
yarn > npm > cnpm: - 包管理工具.

UI 框架

Tailwind CSS
Ant Design Vue 2.0

图标

Ant Design Vue Icon Component - 按需引入所需图标.
Iconify - 使用任何图标集中的图标 Ic?nes
PurgeIcons - 仅打包所使用到的图标.

插件

Vue Router Next
Vuex Next
vuex-module-decorators - vuex 模块化
vite-plugin-mock - 基于 vite 的 mock 插件.
vue-i18n - 国际化
lodash-es - JavaScript 实用程序库
moment - 时间操作库
axios - Http 数据交互
TypeScript

建议开发环境

Git: - 版本管理工具
Visual Studio Code - (VSCode): 最新版本
- VS Code Extensions
  - Iconify IntelliSense
  - Tailwind CSS IntelliSense - Tailwind Css 样式联想
  - Vetur - vue 开发必备
  - ESLint - 脚本代码检查
  - Prettier - 代码格式化
  - Stylelint - css 格式化

安装

//使git对文件名大小写敏感 git config core.ignorecase false// 拉取项目代码git clone https://github.com/anncwb/vue-vben-admin.git vue-vben-admin-2.0cd vue-vben-admin-2.0// 如果使用别的包，可以执行安装 // 如果未安装yarn，请运行：npm install -g yarn yarn install

使用开发环境

yarn serve

打包

yarn build # 打包yarn build:no-cache # 打包，执行之前会先删除缓存yarn report # 生成构建包表表预览

格式化

yarn lint:stylelint # 样式格式化yarn lint:prettier # js/ts代码格式化

其他

yarn reinstall # 删除依赖重新装，兼容windowyarn preview # 本地进行打包预览yarn log # 生成CHANGELOGyarn clean:cache # 删除缓存yarn clean:lib # 删除node_modules，兼容window系统

Git 提交规范

参考 vue 规范 (Angular)
- feat 增加新功能
- fix 修复问题/BUG
- style 代码风格相关无影响运行结果的
- perf 优化/性能提升
- refactor 重构
- revert 撤销修改
- test 测试相关
- docs 文档/注释
- chore 依赖更新/脚手架配置修改等
- workflow 工作流改进
- ci 持续集成
- types 类型定义文件更改
- wip 删除文件