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

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

一、项目初始化

注:该项目是基于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:全局入口组件
相关推荐
秋氘渔8 分钟前
Vue 3 组合式API中的生命周期钩子函数介绍
前端·javascript·vue.js
拉不动的猪17 分钟前
requestAnimationFrame 与 JS 事件循环:宏任务执行顺序分析
前端·javascript·面试
han_17 分钟前
开发提效利器 - 用好Snippets
前端·javascript·visual studio code
mCell37 分钟前
为什么在 Agent 时代,我选择了 Bun?
javascript·agent·bun
谎言西西里2 小时前
掌握原型链,写出不翻车的 JS 继承
javascript
我笔记3 小时前
vue 子父调用
前端·javascript·vue.js
2401_860319523 小时前
在React Native鸿蒙跨平台开发中实现一个冒泡排序算法并将其应用于数据排序,如何进行复制数组以避免直接修改状态中的数组
javascript·算法·react native·react.js·harmonyos
毕设源码-朱学姐3 小时前
【开题答辩全过程】以 基于vue.js的校园二手平台为例,包含答辩的问题和答案
前端·javascript·vue.js
m0_471199633 小时前
【JavaScript】Set 和 Map 核心区别与实战用法(ES6 集合全解析)
前端·javascript·es6
执笔诉情殇〆4 小时前
使用AES加密方法,对Springboot+Vue项目进行前后端数据加密
vue.js·spring boot·后端