简介

vue-typescript-admin-template 是一个后台前端解决方案，它基于 vue, typescript 和 element-ui实现。原始的 Javascript 版本的代码是由 PanJiaChen 开发维护的 vue-element-admin。

github 地址：

https://github.com/Armour/vue-typescript-admin-template

github star: 1.6K+

最新版本：1.0.0，MIT 协议

主要技术栈:

typescript+vue2 + element-ui + echarts + vue-router + webpack + ES6/7 + faker + sass

项目截图

功能

- 登录 / 注销

- 权限验证
  - 页面权限
  - 指令权限
  - 权限配置
  - 二步登录

- 多环境发布
  - Dev / Stage / Prod

- 全局功能
  - 国际化多语言
  - 动态换肤
  - 动态侧边栏（支持多级路由嵌套）
  - 动态面包屑
  - 快捷导航(支持右键操作)
  - 粘贴板
  - Svg 图标
  - 搜索
  - 全屏
  - 设置
  - Mock 数据 / Mock 服务器
  - 支持 PWA

- 组件
  - 编辑器
    - 富文本编辑器
    - Markdown 编辑器
    - JSON 编辑器
  - 头像上传
  - 返回顶部
  - CountTo
  - 拖放区
  - 拖拽弹窗
  - 拖拽看板
  - 拖拽列表
  - 拖拽选择
  - ECharts 图表
  - Mixin
  - 拆分窗格
  - 黏性组件

- 表格
  - 动态表格
  - 拖拽表格
  - 内联编辑表格
  - 复杂表格

- Excel
  - 导出excel
  - 导入excel
  - 前端可视化excel

- Zip
  - 导出zip

- PDF
  - 下载 pdf

- 控制台
- 引导页
- 综合实例
- 错误日志
- 错误页面
  - 401
  - 404

快速上手

git clone https://github.com/Armour/vue-typescript-admin-template.git 

cd vue-typescript-admin-template

# 安装依赖

yarn install

# 启动本地开发环境（自带热启动）

yarn serve

# 构建生产环境 (自带压缩)

yarn build:prod

# 代码格式检查以及自动修复

yarn lint

# 运行单元测试

yarn test:unit

# 运行端对端测试

yarn test:e2e

# 自动生成 svg 组件

yarn run svg

浏览器兼容性

• IE / Edge

IE10, IE11, Edge

• Firefox

last 2 versions

• Chrome

last 2 versions

• Safari

last 2 versions

• Opera

last 2 versions

PS

这个开源项目功能比较全面，主要基于typescript 和 vue，对于同时想学typescript和vue的同学是一个不错的一个参考项目。