# Vue 轻量级后台管理系统基础模板(停止维护,不建议使用)
### [在线预览](https://woai3c.github.io/vue-admin-template)
### [更新日志](https://github.com/woai3c/vue-admin-template/blob/master/update.md)
### 相关依赖
* [vue-router](https://router.vuejs.org/zh/)
* [iview](https://www.iviewui.com/docs/guide/install)
* [axios](https://www.kancloud.cn/yunye/axios/234845)
* [vuex](https://vuex.vuejs.org/zh/)
### 功能
#### 登录页
* 一周七天自动切换不同的壁纸(建议自己配置)
#### 标签栏
* 点击标签切换页面
* 刷新当前标签页
* 关闭其他标签/关闭所有标签
**注意:** 组件的名称和路由的名称一定要一致,例如 `Home.vue` 组件名称 `name: home`,则在路由文件中也要给它设置为 `name: home`,否则页面内容不能缓存
```js
// 在router文件中
{
path: 'home',
name: 'home',
component: () => import('../views/Home.vue')
}
// 在Home.vue中
export default {
name: 'home'
}
```
#### 侧边栏
* 伸展/收缩
* 页面宽度过小自动收缩
* 多级菜单(利用iView组件)
#### 用户相关
* 消息通知
* 用户头像
* 基本资料
#### 动态菜单栏
* 根据数据动态生成菜单
* 在菜单项上添加 hidden 属性可以隐藏该菜单项,但还是可以正常访问页面,具体请看 DEMO 及其相关代码
#### 面包屑
* 展示当前页面的路径
#### 权限控制
* 如果在未登陆的情况下访问指定页面 将会重定向到登陆页
#### [eslint + vscode 自动格式化代码](https://github.com/woai3c/Front-end-articles/blob/master/eslint-vscode-format.md)
具体配置方法请点击上面的链接,如果不需要 eslint,请将相关依赖卸载以及根目录下的 `.eslintrc.js` 删除。
#### [jest 单元测试](https://vue-test-utils.vuejs.org/zh/guides/testing-single-file-components-with-jest.html)
如果不需要,请卸载相关依赖及删除根目录下的 `tests` 目录
#### 页面标题 `document.title`
在 `src/utils/index` 下可设置默认的 `title`,在每个路由配置项上可设置对应的 `title`,具体示例请看代码
#### 其它
* 利用`axios`拦截器 实现了`ajax`请求前展示`loading` 请求结束关闭`loading`
### 注意
* 源码可见 并且添加了必要的注释 可以自行更改
`Index`组件一般情况下只需要传数据就行 其他不用关注
市面上有大量的vue后台管理系统模板 但是功能都太丰富了 而且有很多组件用不上 所以写了这么一个最基础的 只有必要功能的模板
UI库使用的是`iView` 有大量的组件可用
### 使用
#### 下载
```
git clone https://github.com/woai3c/vue-admin-template.git
cd vue-admin-template
npm i
```
#### 开发
```
npm run serve
```
#### 打包
````
npm run build
````
打包后的文件不能放在服务器根目录,否则会出现空白页面。
如果确实要把文件放在服务器根目录则需要更改打包的路径,打开 `vue.config.js` 文件,将如下代码删去即可。
```js
publicPath: './',
```
## License
MIT
## 赞助
![](https://github.com/woai3c/nand2tetris/blob/master/img/wx.jpg)
![](https://github.com/woai3c/nand2tetris/blob/master/img/zfb.jpg)
没有合适的资源?快使用搜索试试~ 我知道了~
管理系统系列--Vue 轻量级后台管理系统基础模板.zip
共44个文件
js:14个
vue:10个
jpg:9个
需积分: 5 0 下载量 139 浏览量
2024-02-25
23:24:11
上传
评论
收藏 4.05MB ZIP 举报
温馨提示
管理系统系列--Vue 轻量级后台管理系统基础模板
资源推荐
资源详情
资源评论
收起资源包目录
管理系统系列--Vue 轻量级后台管理系统基础模板.zip (44个子文件)
kwan02251353
.editorconfig 160B
.browserslistrc 21B
babel.config.js 76B
.eslintrc.js 2KB
update.md 5KB
jest.config.js 61B
src
App.vue 1KB
store
index.js 3KB
assets
imgs
bg03.jpg 343KB
404.jpg 23KB
bg01.jpg 331KB
logo.png 7KB
bg02.jpg 1.01MB
bg06.jpg 405KB
bg00.jpg 951KB
user.jpg 7KB
bg05.jpg 405KB
bg04.jpg 308KB
main.js 385B
api
index.js 136B
utils
request.js 1KB
createRoutes.js 810B
loading.js 350B
index.js 490B
components
404.vue 768B
Login.vue 4KB
Index.vue 24KB
router
index.js 2KB
permission.js 1KB
views
Password.vue 228B
UserInfo.vue 229B
Msg.vue 175B
Other.vue 351B
Home.vue 785B
T1.vue 9KB
LICENSE 1KB
tests
unit
utils.spec.js 226B
package.json 820B
public
favicon.ico 4KB
index.html 558B
package-lock.json 1.47MB
vue.config.js 348B
.gitignore 214B
README.md 3KB
共 44 条
- 1
资源评论
Kwan的解忧杂货铺
- 粉丝: 1w+
- 资源: 3671
上传资源 快速赚钱
- 我的内容管理 展开
- 我的资源 快来上传第一个资源
- 我的收益 登录查看自己的收益
- 我的积分 登录查看自己的积分
- 我的C币 登录后查看C币余额
- 我的收藏
- 我的下载
- 下载帮助
安全验证
文档复制为VIP权益,开通VIP直接复制
信息提交成功