【读书后台管理系统】—前端框架搭建(一)

【读书后台管理系统】---前端框架搭建(一)

一、项目初始化

注:该项目是基于vue-element-admin下进行的

bash 复制代码
git clone https://github.com/PanJiaChen/vue-element-admin
cd vue-element-admin
npm i
npm run dev

二、项目精简

删除 src/views 下的源码,保留:

  • dashboard:首页
  • error-page:异常页面
  • login:登录
  • redirect:重定向
  • 对 src/router/index 进行相应修改
  • 删除 src/router/modules 文件夹
  • 删除 src/vendor 文件夹

三、项目配置

通过 src/settings.js 进行全局配置:

  • title:站点标题
  • showSettings:是否显示右侧悬浮配置按钮
  • tagsView:是否显示页面标签功能条
  • fixedHeader:是否将头部布局固定
  • sidebarLogo:菜单栏中是否显示LOGO
  • errorLog:默认显示错误日志的环境

四、项目结构

  • api:接口请求
  • assets:静态资源
  • components:通用组件
  • directive:自定义指令
  • filters:自定义过滤器
  • icons:图标组件
  • layout:布局组件
  • router:路由配置
  • store:状态管理
  • styles:自定义样式
  • utils:通用工具方法
  • auth.js:token 存取
  • permission.js:权限检查
  • request.js:axios 请求封装
  • index.js:工具方法
  • views:页面
  • permission.js:登录认证和路由跳转
  • settings.js:全局配置
  • main.js:全局入口文件
  • App.vue:全局入口组件
相关推荐
不法2 分钟前
vue 地图路线渲染
前端·vue.js·ubuntu
我家媳妇儿萌哒哒5 分钟前
Element ui el-dialog 在一个有滚动条的页面,打开一个弹框,完了再打开一个弹框后,滚动条可以滚动,怎么限制不能滚动。
前端·vue.js·ui
得想办法娶到那个女人7 分钟前
Vite + Vue 项目打包为 Electron 桌面应用 完整指南
前端·vue.js·electron
费曼学习法19 分钟前
快速选择算法:如何在 10 亿数据中瞬间找到“第 K 大”?
javascript·算法
用户9623779544821 分钟前
原理分析 | Controller —— SpringBoot 内存马
javascript·后端
写代码的皮筏艇34 分钟前
replace方法
前端·javascript
无心使然41 分钟前
Openlayers调用ArcGis地图服务之五 —— 要素识别(/identify)
前端·vue.js·数据可视化
李李李勃谦1 小时前
Vue3 + Electron + OpenHarmony 跨平台实战:从架构设计到 Markdown 编辑器完整实现
javascript·华为·electron·编辑器·harmonyos
Highcharts.js1 小时前
实战指南:如何构建一套全平台适配的响应式图表系统?
前端·javascript·highcharts·实战代码·响应式图表
77美式1 小时前
手机端键盘弹出导致页面抖动
前端·javascript·uniapp