目录

Naive-Ui-Admin-发布后台管理系统-高颜值Admin骨架-看看是不是你想要的

Naive Ui Admin 发布后台管理系统 高颜值Admin骨架 看看是不是你想要的

https://i-blog.csdnimg.cn/blog_migrate/3e0d2196d6ce111443c17968facf4b63.png

简介

Naive Ui Admin 是一个免费开源的中后台模版,使用了最新的 vue3 , vite2 , TypeScript 等主流技术开发,开箱即用的中后台前端解决方案,也可用于学习参考。

特性

  • 最新技术栈 :使用 Vue3/vite2 等前端前沿技术开发
  • TypeScript
    应用程序级 JavaScript 的语言
  • 主题 :可配置的主题
  • Mock 数据 内置 Mock 数据方案
  • 权限 内置完善的动态路由权限生成方案
  • 组件 二次封装了多个常用的组件

页面功能

  • ✨ Features

  • 菜单模式(左侧/顶部)
  • 权限(固定角色/动态路由菜单)
  • 主题(深色/浅色)引用 naiveui 特性,黑暗主题/自定义组件,暗黑主题信手捏来
  • 系统主题(十种安全色,可切换预览,可自定义)
  • 导航风格(三种,可自由搭配,暗色侧边/白色侧边和通栏/暗色侧边和顶部通栏)
  • 多页签,持久化,拖拽,关闭,固定
  • 面包屑,图标,子菜单下拉联动展示
  • 漂亮的锁屏界面
  • 在线配置抽屉(布局预览功能)
  • 主控台,简单写了一下,能看了
  • 工作台随意撸了一下(不想写style)用 tailwindcss大开杀戒了
  • echarts,官网例子很全了,没啥好撸的,偷懒再次引用vben作者的代码,再感谢一次,哈哈
  • 主控台,工作台,自适应支持
  • 左侧菜单屏幕可视宽度<=950 自动收起
  • 页脚是否显示,可配置
  • 新增页面缓存,演示页面在>工作台>动态卡片>输入框
系统看板
  • 主控台
  • 监控页
  • 工作台

效果展示

https://i-blog.csdnimg.cn/blog_migrate/663b68a28d9872451f18ce57923a4c9f.png

https://i-blog.csdnimg.cn/blog_migrate/b03959af0db73d24f4866cd769dd4bd5.png

https://i-blog.csdnimg.cn/blog_migrate/6e756ed4a9296dea9ae69109f2284bcf.png

https://i-blog.csdnimg.cn/blog_migrate/2fb44b4581a6c2630c45e9a402a63e18.png

https://i-blog.csdnimg.cn/blog_migrate/817d19961d20306539f898694c4f5ba1.png

https://i-blog.csdnimg.cn/blog_migrate/47f42735d2baccf20556b78a4e2b7fb1.png

预览

账号:admin,密码:123456

文档

  • 待完善

准备

  • 和 -项目开发环境
    • 熟悉 vite 特性
    • 熟悉 Vue 基础语法
    • 熟悉 TypeScript 基本语法
    • 熟悉 es6 基本语法
    • 熟悉 vue-router 基本使用
    • ui 基本使用
    • mockjs 基本语法

安装使用

  • 获取项目代码
git clone https://github.com/jekip/naive-ui-admin.git
  • 安装依赖
cd naive-ui-admin

yarn install
  • 运行
yarn dev
  • 打包
yarn build

更新日志

浏览器支持

本地开发推荐使用 Chrome 80+ 浏览器

支持现代浏览器, 不支持 IE

IEEdgeFirefoxChromeSafari
not supportlast 2 versionslast 2 versionslast 2 versionslast 2 versions

维护者