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

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

一、项目初始化

注:该项目是基于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:全局入口组件
相关推荐
晴殇i1 小时前
DOM嵌套关系全解析:前端必备的4大判断方法与性能优化实战
前端·javascript·面试
QuantumLeap丶1 小时前
《uni-app跨平台开发完全指南》- 04 - 页面布局与样式基础
vue.js·微信小程序·uni-app
字节拾光1 小时前
console.log 打印 DOM 后内容变了?核心原因是 “引用” 而非 “快照”
javascript
掘金安东尼2 小时前
GPT-6 会带来科学革命?奥特曼最新设想:AI CEO、便宜医疗与全新计算机
前端·vue.js·github
全马必破三2 小时前
React的设计理念与核心特性
前端·react.js·前端框架
洞窝技术2 小时前
前端人必看的 node_modules 瘦身秘籍:从臃肿到轻盈,Umi 项目依赖优化实战
前端·vue.js·react.js
Asort2 小时前
React函数组件深度解析:从基础到最佳实践
前端·javascript·react.js
Qinana2 小时前
🌐 从 HTML/CSS/JS 到页面:浏览器渲染全流程详解
前端·程序员·前端框架
Justineo2 小时前
TemPad Dev:设计与实现
前端·javascript·css
AAA简单玩转程序设计3 小时前
救命!HTML按钮点了没反应?3分钟学会给网页“装脑子”
javascript·html