vue-element-admin 正在参加 2020 年度 OSC 中国开源项目评选,请投票支持!
vue-element-admin 在 2020 年度 OSC 中国开源项目评选 中已获得 {{ projectVoteCount }} 票,请投票支持!
投票让它出道
已投票
vue-element-admin 获得 2020 年度 OSC 中国开源项目评选「最佳人气项目」 !
vue-element-admin 获得 2020 年度 OSC 中国开源项目评选「最佳人气项目」「最积极运营项目」 !
vue-element-admin 获得 2020 年度 OSC 中国开源项目评选「最积极运营项目」 !

软件简介

vue-element-admin 是一个后台前端解决方案,它基于 vue 和 element-ui实现。它使用了最新的前端技术栈,内置了 i18n 国际化解决方案,动态路由,权限验证,提炼了典型的业务模型,提供了丰富的功能组件,它可以帮助你快速搭建企业级中后台产品原型。

功能

  • 登录/注销

  • 权限验证

  • 侧边栏

  • 面包屑

  • 富文本编辑器

  • Markdown编辑器

  • JSON编辑器

  • 列表拖拽

  • plitPane

  • Dropzone

  • Sticky

  • CountTo

  • echarts图表

  • 401,404错误页面

  • 错误日志

  • 导出excel

  • table example

  • 动态table example

  • 拖拽table example

  • 内联编辑table example

  • form example

  • 多环境发布

  • dashboard

  • 二次登录

  • 动态侧边栏(支持多级路由)

  • mock数据

  • cache tabs example

  • screenfull

  • markdown2html

  • views-tab

开发

    # 克隆项目
    git clone https://gitee.com/panjiachen/vue-element-admin.git

    # 安装依赖
    npm install
    //or # 建议不要用cnpm  安装有各种诡异的bug 可以通过如下操作解决npm速度慢的问题
    npm install --registry=https://registry.npm.taobao.org

    # 本地开发 开启服务
    npm run dev

浏览器访问 http://localhost:9527

发布

    # 发布测试环境 带webpack ananalyzer
    npm run build:sit-preview

    # 构建生成环境
    npm run build:prod

状态管理

后台只有user和app配置相关状态使用vuex存在全局,其它数据都由每个业务页面自己管理。

效果图

两步验证登录 支持微信和qq

真正的动态换肤

展开阅读全文

代码

的 Gitee 指数为
超过 的项目

评论 (38)

加载中
(Use `node --trace-warnings ...` to show where the warning was created) npm ERR! code 128 npm ERR! command failed npm ERR! command git ls-remote ssh://git@github.com/nhn/raphael.git npm ERR! git@github.com: Permission denied (publickey). npm ERR! fatal: Could not read from remote repository. npm ERR! npm ERR! Please make sure you have the correct access rights npm ERR! and the repository exists. npm ERR! A complete log of this run can be found in:
03/08 00:00
回复
举报
clone git 就要一个用户名,密码,都蒙了
2020/11/19 13:03
回复
举报
那是填你自己的git账号密码,使用git是要登录的
2020/11/24 15:47
回复
举报
GloryAdmin是一个基于springboot2.1.9.RELEASE 和vue-admin-template搭建的后台框架 https://my.oschina.net/artglory/blog/4375086#h1_1
2020/07/14 23:01
回复
举报
挺好用的
2020/06/22 10:15
回复
举报
elementui做的系统普遍不流畅是怎么回事?
2020/06/19 08:38
回复
举报
欢迎交流ElementUI的封装方便开发版:#http://115.159.65.195:8080/vefdoc#
2019/12/17 12:55
回复
举报
请问,哪个分支代码有国际化模块呀
2019/08/13 16:14
回复
举报
我用这个的时候发现了一些不合理的地方,自己优化了下
2019/08/03 20:00
回复
举报
欢迎使用elmentui增删改查功能自动生成工具, #MoliCode#
2019/08/02 13:04
回复
举报
各位大佬,一刷新就得重新登录,token存在,但是不拉去信息了,怎么解决?
2019/04/03 18:02
回复
举报
watch一下
2019/07/08 21:36
回复
举报
更多评论
发表于大前端专区
2020/06/22 07:46

vue-element-admin 4.4.0 发布,后台集成方案

vue-element-admin 4.4.0 发布了,vue-element-admin 是一个后台集成解决方案,它基于 vue 和 element。它使用了最新的前端技术栈,内置了 i18 国际化解决方案,动态路由,权限验证,提炼了典型的业务模型,提供了丰富的功能组件,它可以帮助你快速搭建企业级中后台产品原型。 在新版本中将原来的 vue-cli@3 升级为 vue-cli@4。 主要是为了解决: npm run dev 会自动开两个 tab #2944 npm run build:prod 页面白屏的问题 #3271 ...

2
29
发表于大前端专区
2020/06/19 07:33

vue-element-admin 4.3.1 发布,后台集成方案

vue-element-admin 4.3.1 发布了,vue-element-admin 是一个后台集成解决方案,它基于 vue 和 element。它使用了最新的前端技术栈,内置了 i18 国际化解决方案,动态路由,权限验证,提炼了典型的业务模型,提供了丰富的功能组件,它可以帮助你快速搭建企业级中后台产品原型。 新版本更新内容如下: 新功能 侧边栏 icon 支持 el-icon,在声明路由时直接使用 icon class 即可,例如: meta: { title: 'Example', ...

5
28
发表于大前端专区
2020/06/10 07:12

vue-element-admin 4.3.0 和 4.2.2 发布,后台集成方案

vue-element-admin 4.3.0 和 4.2.2 发布了。vue-element-admin 是一个后台集成解决方案,它基于 vue 和 element。它使用了最新的前端技术栈,内置了 i18 国际化解决方案,动态路由,权限验证,提炼了典型的业务模型,提供了丰富的功能组件,它可以帮助你快速搭建企业级中后台产品原型。 4.3.0 版本更新如下: Breaking Changes chore: change node-sass to dart-sass(#3040 by @Cat7373 ) /deep/ 已不适用,需要使用 ::v-deep进...

6
33
发表于大前端专区
2019/05/28 07:01

vue-element-admin 4.2.1 发布,后台集成方案

vue-element-admin 4.2.1 发布了,vue-element-admin 是一个后台集成解决方案,它基于 vue 和 element。它使用了最新的前端技术栈,内置了 i18 国际化解决方案,动态路由,权限验证,提炼了典型的业务模型,提供了丰富的功能组件,它可以帮助你快速搭建企业级中后台产品原型。 新版本更新内容如下: 修复 修复 charts 图表 在 keep-alive中的 bug(#2119) 修复 同时引用多个 Tinymce 富文本 时的 bug(#2152) 优化 添加 autopref...

2
31
发表于大前端专区
2019/05/22 07:18

vue-element-admin 4.2.0 发布,后台集成方案

vue-element-admin 4.2.0 发布了,vue-element-admin 是一个后台集成解决方案,它基于 vue 和 element。它使用了最新的前端技术栈,内置了 i18 国际化解决方案,动态路由,权限验证,提炼了典型的业务模型,提供了丰富的功能组件,它可以帮助你快速搭建企业级中后台产品原型。 新版本更新内容如下: 新功能 新增 Spanish 文档 (#2070 by @yamelsenih ) vuex store 自动导入时支持嵌套文件夹 (#2047 by @yamelsenih ) svg 组件支...

3
25
发表于大前端专区
2019/05/06 06:57

vue-element-admin 4.1.0 发布,全面优化代码注释

vue-element-admin 4.1.0 发布了,vue-element-admin 是一个后台集成解决方案,它基于 vue 和 element。它使用了最新的前端技术栈,内置了 i18 国际化解决方案,动态路由,权限验证,提炼了典型的业务模型,提供了丰富的功能组件,它可以帮助你快速搭建企业级中后台产品原型。 新版更新内容如下: 新功能 页面title修改为动态的,会随着页面的变化而变化,不再是写死的 (#1910 by @ren8179 ) 新增 profile 个人详情页 (#1953 b...

6
31
发表于大前端专区
2019/04/12 07:14

vue-element-admin 4.0.1 发布,后台集成方案

vue-element-admin 4.0.1 发布了,vue-element-admin 是一个后台集成解决方案,它基于 vue 和 element。它使用了最新的前端技术栈,内置了 i18 国际化解决方案,动态路由,权限验证,提炼了典型的业务模型,提供了丰富的功能组件,它可以帮助你快速搭建企业级中后台产品原型。 新版更新内容如下: 新功能 修改 vuex 模块为自动导入(#1815 by @Estelle00 ) 新增 mock-server 支持热更新 (#1850 ) 侧边栏新增 高亮选项 activeMenu...

5
37
发表于大前端专区
2019/04/03 00:05

vue-element-admin 4.0.0 正式版发布

v4.0版本正式发布。 重大改变 基于 vue-cli@3进行构建 调整了项目的目录结构 mock 文件移至根目录下 layout 从 views 文件夹下移至 src 下 使用了最新的 eslint-plugin-vue@5,重新格式化了代码 现在可以在不刷新页面的情况下 remove routes 更新了husky@1.3.1 增加了 jest 单元测试 新增了 npm run preview、 npm run test:uni、 npm run new指令 使用了新的 mock 方式,解决了之前 mock 若干问题 vuex 启用了 模块化 namespac...

17
41
发表于大前端专区
2019/03/27 07:04

vue-element-admin 4.0.0 beta 发布,后台集成方案

vue-element-admin 4.0.0 beta 发布了,vue-element-admin 是一个后台集成解决方案,它基于 vue 和 element。它使用了最新的前端技术栈,内置了 i18 国际化解决方案,动态路由,权限验证,提炼了典型的业务模型,提供了丰富的功能组件,它可以帮助你快速搭建企业级中后台产品原型。 新版更新总结来说:就是 4.0 版本改了很多东西,是一次不兼容更新。更新内容如下: 重大改变 基于 vue-cli@3进行构建 调整了项目的目录结构 mock...

13
48
发表于大前端专区
2019/01/02 07:14

vue-element-admin 3.10.0 发布,后台集成解决方案

vue-element-admin 3.10.0 发布了,vue-element-admin 是一个后台集成解决方案,它基于 vue 和 element。它使用了最新的前端技术栈,内置了 i18 国际化解决方案,动态路由,权限验证,提炼了典型的业务模型,提供了丰富的功能组件,它可以帮助你快速搭建企业级中后台产品原型。 更新内容如下: feature[Component]: 新增 tui.editor 组件 #1374 feature[PDF]: 新增 PDF demo #1469 feature[Breadcrumb]: 新增 Breadcrumb 面包屑...

0
46
发表于大前端专区
2018/10/23 06:50

vue-element-admin 3.9.2 发布,后台集成解决方案

vue-element-admin 是一个后台集成解决方案,它基于 vue 和 element。它使用了最新的前端技术栈,内置了 i18 国际化解决方案,动态路由,权限验证,提炼了典型的业务模型,提供了丰富的功能组件,它可以帮助你快速搭建企业级中后台产品原型。 3.9.2 更新内容 demo 支持西班牙语 #1196 (by @rmenor) feature[Pagination]: 新增了 Pagination 分页组件 #1213 perf[TagsView]: 重构了 moveToTarget 函数 #1195 (by @frank10000 ) ...

1
56
发表于大前端专区
2018/10/10 07:51

vue-element-admin v3.9.1 发布,后台集成方案

vue-element-admin v3.9.1 已发布,更新内容: feature[TagsView]: 支持鼠标中键关闭 TagsView #1149 feature[Breadcrumb]: 增加 pathToRegexp 来处理 path,以便让面包屑支持动态路径 #1148 feature[Excel]: Excel 导出新增 bookType 选项 #1144 perf[Sidebar]:当 submenu 被选中时高亮 #1154 perf[Chore]: 使用 templateParameters 来简化 index.html 模板 #1156 (by @happystory ) fix[TagsView]: 修复 visitedViews bug fix...

1
27
发表于大前端专区
2018/09/18 11:04

vue-element-admin v3.9.0 发布,后台集成方案

vue-element-admin v3.9.0 已发布,更新内容: feature[Tinymce]: 支持 i18n #994 (by @mimimile) feature[tagsView]: 支持刷新 #1033 feature:[sidebar]: 支持 external-link 外链 #991 feature: 支持全局自定义布局大小 #1024 feature: 登录后重定向到之前想访问的页面地址 #1046 feature: 增加了svgo指令来优化 svg (文档) #1096 feature: 新增了 Typescript demo vue-typescript-admin-template (by @Armour ) refactor[tag...

1
33
发表于大前端专区
2018/08/16 07:51

vue-element-admin v3.8.0 发布,后台集成方案

vue-element-admin v3.8.0 已发布,从该版本起开始使用 webpack4 和 vue-loader@15 ,依赖的第三方库也已升级至最新版本。 如果想继续使用 webpack3 ,请使用 webpack3 分支。 vue-element-admin 是基于 vue+element 的后台集成方案,功能包括: 登录/注销 权限验证 多环境发布 动态侧边栏(支持多级路由) 动态面包屑 国际化多语言 多种动态换肤 快捷导航(标签页) 富文本编辑器 Markdown 编辑器 JSON 编辑器 Screenfull 全屏 ...

5
26
发表于大前端专区
2018/07/15 07:47

vue-element-admin v3.7.2 发布,后台集成方案

vue-element-admin v3.7.2 已发布,更新内容如下: 新增了 lint-staged 进行提交格式化校验 #818 优化了[ArticleDetail]: refine el-col :span #841 by @ZYSzys 优化了[login]: 修复了登录页 input placeholder 国际化问题 #844 优化了部分样式 重构了(SidebarItem): optimizate SidebarItem #845 by @bowencool 修复了[build.js]: 修复了预览模式bug #819 修复了[TagsView]: 右击菜单定位问题 #850 修复了[css]: 小屏幕样式问题...

6
34
发表于大前端专区
2018/03/27 07:49

vue-element-admin v3.6.4 发布,后台集成方案

vue-element-admin v3.6.4 已发布,更新如下: 优化: index.html script 标签插入位置 #507 优化: 使用 2 空格替代一个 tab #522 优化: 使用 Object.keys 来遍历 #518 优化[editor-dashboard]: 优化 css z-index #509 优化[excel]: 重构了 excel 导出函数 #536 修复[menu]: 菜单在是有一个可显示子元素的情况下会有问题 #484 修复[Tinmyce]: 富文本全屏 ui bug #513 修复[ImageCropper]: 上传头像组件关闭问题 #520 修复[TodoLi...

5
55
发表于大前端专区
2018/03/14 16:46

vue-element-admin v3.6.3 发布,后台集成方案

vue-element-admin v3.6.3 已发布,更新内容: 优化 [Tinymce]:使其支持在 dialog 中上传图片 && 增加 SetContent listener 31b7fa6 7cacd5a 优化 [i18n]:TagsView 右键 contextmenu 支持国际化 #490 优化 [Charts]:增加 resize mixin 使图表支持响应式 #480 更新 [ImageCropper]:更新 vue-image-crop-upload t至最新版本 #503 修复 [Icons]:图标展示页面复制 bug #494 vue-element-admin 是基于 vue+element 的后台集成方...

4
66
发表于大前端专区
2018/01/24 07:37

vue-element-admin v3.6.1 发布,后台集成方案

vue-element-admin v3.6.1 已发布,更新内容: 新增 TreeTable 在开发模式中设置 cheap-source-map 为默认打包方式 vue-element-admin 是基于 vue+element 的后台集成方案,功能包括: 登录/注销 权限验证 多环境发布 动态侧边栏(支持多级路由) 动态面包屑 国际化多语言 多种动态换肤 快捷导航(标签页) 富文本编辑器 Markdown编辑器 JSON编辑器 Screenfull全屏 列表拖拽 Svg Sprite 图标 Dashboard 本地mock数据 Echarts 图表...

1
62
发表于大前端专区
2018/01/06 07:57

vue-element-admin v3.5.1 发布,后台集成方案

vue-element-admin v3.5.1 已发布,更新内容: 新增 postcss-url 插件 优化upload-excel] 支持拖拽上传excel 优化[permission]:set role => roles 修复侧边栏多级菜单样式问题 #327 修复国际化初始语言bug #388 vue-element-admin 是基于 vue+element 的后台集成方案,功能包括: 登录/注销 权限验证 多环境发布 动态侧边栏(支持多级路由) 动态面包屑 国际化多语言 多种动态换肤 快捷导航(标签页) 富文本编辑器 Markdown编辑器...

6
112
发表了资讯
2017/12/07 07:36

vue-element-admin v3.1.1 发布,后台集成方案

vue-element-admin v3.1.1 已发布,更新内容: 将国际化 generateTitle 方法提取到 utils 中 acebaea 修复侧边栏在默些特殊情况下的 bug d09923f vue-element-admin 是基于 vue+element 的后台集成方案,功能包括: 登录/注销 权限验证 侧边栏 面包屑 富文本编辑器 Markdown 编辑器 JSON 编辑器 列表拖拽 plitPane Dropzone Sticky CountTo echarts 图表 401,404错误页面 错误日志 导出 excel table example 动态 table exampl...

3
45
没有更多内容
加载失败,请刷新页面
点击加载更多
加载中
下一页
发表了博客
2019/04/24 14:44

vue-element-admin

[toc] <p align="center"> <img width="320" src="https://wpimg.wallstcn.com/ecc53a42-d79b-42e2-8852-5126b810a4c8.svg"> </p> <p align="center"> <a href="https://github.com/vuejs/vue"> <img src="https://img.shields.io/badge/vue-2.6.10-brightgreen.svg" alt="vue"> </a> <a href="https://github.com/ElemeFE/element"> <img src="https://img.shields.io/badge/element--ui-2.7.0-brightgreen.svg" alt="element-...

0
2
发表了博客
2020/11/27 00:57

vue-element-admin教程

vue-element-admin 是一个后台前端解决方案,它基于 vue 和 element-ui实现。它使用了最新的前端技术栈,内置了 i18 国际化解决方案,动态路由,权限验证,提炼了典型的业务模型,提供了丰富的功能组件,它可以帮助你快速搭建企业级中后台产品原型。 vue-element-admin让后端程序员也能轻松上手做一些前端页面,而且配置打包都很简单。 vue-element-admin官方教程 一、安装vue-element-admin 1、先clone个项目 git clone https:...

0
0
发表了博客
2020/01/02 22:28

vue-element-admin安装

URL: https://panjiachen.github.io/vue-element-admin-site/zh/ 测试了下面两个方案: 集成方案: vue-element-admin 基础模板: vue-admin-template 建议 你可以把 vue-element-admin当做工具箱或者集成方案仓库,在 vue-admin-template 的基础上进行二次开发,想要什么功能或者组件就去 vue-element-admin 那里复制过来。 操作步骤: # 克隆项目 git clone https://github.com/PanJiaChen/vue-element-admin.git # 进入项...

0
0
发表了博客
2019/11/08 15:42

vue.js 的 vue-element-admin 实践开发

官方网址: https://panjiachen.github.io/vue-element-admin-site/zh/ 一:面包屑导航,根目录文字修改: 定位到文件 vue-element-supply-chain\src\components\Breadcrumb\index.vue,40行 修改 title 二:去掉页面切换时的动态效果: 定位到文件 vue-element-supply-chain\src\layout\components\AppMain.vue ,去掉3,7行的 <!-- <transition name="fade-transform" mode="out-in"> --> <!-- </transition> --> 三:启动时,...

0
0
发表了博客
2019/03/28 18:19

vue-element-admin 使用总结

官网https://panjiachen.github.io/vue-element-admin-site/zh/guide/#%E5%8A%9F%E8%83%BD vue项目做的少,elementUI也是最近才接触,所以文档看了一周才有了点思路,最难的就是用户登录权限部分 目录结构 页面都在/src/views 下 登录权限 登录在src/views/login/index.vue ,登录只是账号密码,登录后获取用户信息其中包含用户角色,路由配置在src/router/index.js,路由中配置了每个路由对应的角色 侧边栏动态渲染 src/router...

0
0
发表了博客
2019/09/29 11:46

vue-element-admin 学习笔记

20190929 vue相关 vue-ref ref 是被用来给元素或子组件注册引用信息的。引用信息将会注册在父组件的 $refs 对象上。 html5-autocomplete autocomplete 属性规定输入字段是否应该启用自动完成功能。 自动完成允许浏览器预测对字段的输入。当用户在字段开始键入时,浏览器基于之前键入过的值,应该显示出在字段中填写的选项。 注释:autocomplete 属性适用于 <form>,以及下面的 <input> 类型:text, search, url, telephone, ema...

0
0
发表了博客
2019/10/18 14:34

vue-element-admin后台的安装

# 克隆项目 git clone https://github.com/PanJiaChen/vue-element-admin.git # 进入项目目录 cd vue-element-admin # 安装依赖 npm install # 建议不要用 cnpm 安装 会有各种诡异的bug 可以通过如下操作解决 npm 下载速度慢的问题 npm install --registry=https://registry.npm.taobao.org # 本地开发 启动项目 npm run dev 下载项目的时候run install时,有可能会产生两个错误: 出现-4048错误     升级你的nodeJS版...

0
0
发表了博客
2020/02/08 19:48

vue-element-admin完整项目实例

项目运行地址:https://panjiachen.github.io/vue-element-admin/#/login 项目地址:https://github.com/PanJiaChen/vue-element-admin 项目地址:(国际化)https://github.com/PanJiaChen/vue-element-admin/tree/i18n 项目介绍:https://panjiachen.gitee.io/vue-element-admin-site/zh/guide/ # clone the project git clone https://github.com/PanJiaChen/vue-element-admin.git # enter the project directory cd vue-e...

0
1
发表了博客
2020/11/23 07:42

vue-element-admin开源项目介绍

一 vue-element-admin 1 简介 vue-element-admin是基于element-ui 的一套后台管理系统集成方案。 GitHub地址:https://github.com/PanJiaChen/vue-element-admin 项目在线预览:https://panjiachen.gitee.io/vue-element-admin 2 安装 # 1 解压压缩包 # 2 进入目录 cd vue-element-admin-master # 3 安装依赖 npm install # 4 启动执行,浏览器自动弹出并访问http://localhost:9527/ npm run dev 如果上面的install报错 则先执行...

0
0
发表了博客
2020/12/12 12:08

【小白教程】vue-element-admin 环境搭建

window基础环境 1,Git: Git-2.27.0-64-bit 2,JDK: jdk-8u231-windows-x64 3,Node.js :node-v12.8.0-x64 4,python:python-2.7.2.amd64 5,vscode 百度自行安装 6,VSCode配置Git 请参照热心网友 https://blog.csdn.net/weixin_40965293/article/details/80319982 敲黑板!!!上面的东西我都给你们打包好了 百度云网盘:https://pan.baidu.com/s/1rU2FPmyL7ru5-HQk4NsFag 提取码:9ddz 7,Git配置完后,在VSCode中执行以...

0
0
没有更多内容
加载失败,请刷新页面
点击加载更多
加载中
下一页
发表于大前端专区
2020/07/31 15:26

前端问题

请问这种在页面用什么展示,<el-form>可以吗?本人前端小白,求指教啊

1
0
发表于大前端专区
2019/06/13 15:11

VUE异步初始化数据

业务场景: 页面需要展示table,其中一列为某一数据库表的ID字段,而页面显示为该表内容的name字段。 所以 需要进入页面时异步加载出这一列关联的表数据。 问题: 如果进入页面由于网络原因或者多次刷新就会造成没加载完就使用。 控制台打印错误信息:【TypeError: Cannot read property 'length' of null at VueComponent.formatStyle...】 怎么避免这类问题发生???新人刚接触vue。...

5
0
没有更多内容
加载失败,请刷新页面
点击加载更多
加载中
下一页
38 评论
1.2K 收藏
分享
OSCHINA
登录后可查看更多优质内容
返回顶部
顶部