Vue3+Vite2.6+TypeScript+Ant-design-vue构建企业级中后台响应式管理后台

简介: Vue3+Vite2.6+TypeScript+Ant-design-vue构建企业级中后台响应式管理后台

文档教程



image.png


点这里直达


文档教程



Github


文档地址


使用项目



克隆项目


git clone https://github.com/hangjob/vue-vite-admin-ts.git



安装依赖



node.js版本需要大于12,vite的编译环境是12以上的版本
npm i


启动应用



npm run dev



发布



npm run build



其他



# eslint代码格式检查
npm run lint 
# eslint自动修复代码
npm run lint:fix


Eslint



eslint 已做过滤配置,只会对package文件中代码做检查


已完成的功能



✅ 使用Vue 3


✅ 使用Vuex 4.x


✅ 使用Vue-router 4.x


✅ 基于Vite 2.6


✅ 基于Ant Design Vue


✅ 整体框架响应式布局


✅ 项目切换


✅ 用户登录拦截,用户退出


✅ 面包屑导航 + 多种布局效果


✅ 基于后台权限,按钮权限设计


✅ 菜单导航 + 多种布局


✅ 内置iconfont字体图标,自动生成组件


✅ 基于axios封装post,get,all,upload,download


✅ http错误重连


✅ 组件权限指令封装


✅ tsx构建全局组件


✅ http网络组件(vue3新特性)


✅ 菜单管理,包含增、删、改、查,菜单是缓存、是否固定、是否隐藏(但展示)、是否隐藏等待 具体功能,查看文档


✅ 包含富文本编辑器,文件打印,图表预览,动画组件,状态详情组件等等


✅ 支持多页面应用


✅ 支持iframe内嵌


✅ 页面刷新


✅ 页面全屏


✅ 右键菜单封装


✅ 滚动条优化


✅ 骨架屏组件预览


✅ 基于封装loadsh深层遍历、查找、无规律查找


✅ 基于mitt全局通信


✅ 基于vxe-table解决万量级表格渲染


✅ Mock数据


✅ Egg.js后端服务,具体操作看文档


✅ sequelize模型增删改查


✅ Eslint代码检查


✅ 开发编辑器全局配置


✅ 打包压缩处理Gzip


待完成



✖️ 主题切换


✖️ 中/英文切换


✖️ iframe缓存


相关文章
|
9天前
|
JavaScript 前端开发 API
Vue.js响应式原理深度解析:从Vue 2到Vue 3的演进
Vue.js响应式原理深度解析:从Vue 2到Vue 3的演进
40 0
|
2月前
|
API
vue3知识点:响应式数据的判断
vue3知识点:响应式数据的判断
27 3
|
2月前
|
缓存 JavaScript UED
优化Vue的响应式性能
【10月更文挑战第13天】优化 Vue 的响应式性能是一个持续的过程,需要不断地探索和实践,以适应不断变化的应用需求和性能挑战。
33 2
|
2月前
|
JavaScript 前端开发 网络架构
如何使用Vue.js构建响应式Web应用
【10月更文挑战第9天】如何使用Vue.js构建响应式Web应用
|
2月前
|
JavaScript 前端开发
如何使用Vue.js构建响应式Web应用程序
【10月更文挑战第9天】如何使用Vue.js构建响应式Web应用程序
|
2月前
|
JavaScript 安全 开发工具
在 Vue 3 中使用 TypeScript
【10月更文挑战第3天】
|
2月前
|
JavaScript 前端开发 数据安全/隐私保护
前端技术分享:使用Vue.js构建响应式表单
【10月更文挑战第1天】前端技术分享:使用Vue.js构建响应式表单
|
2月前
|
JavaScript 前端开发 API
vue3知识点:Vue3.0中的响应式原理和 vue2.x的响应式
vue3知识点:Vue3.0中的响应式原理和 vue2.x的响应式
25 0
|
3月前
vue2的响应式原理学“废”了吗?继续观摩vue3响应式原理Proxy
该文章对比了Vue2与Vue3在响应式原理上的不同,重点介绍了Vue3如何利用Proxy替代Object.defineProperty来实现更高效的数据响应机制,并探讨了这种方式带来的优势与挑战。
vue2的响应式原理学“废”了吗?继续观摩vue3响应式原理Proxy
在 Vue3 中,如何使用 setup 函数创建响应式数据?
在 Vue3 中,如何使用 setup 函数创建响应式数据?