解析yylAdmin系统的安装使用
yylAdmin
Gitee:https://gitee.com/skyselang/yylAdmin
Github:https://github.com/skyselang/yylAdmin
簡介
yylAdmin是一個極簡后臺管理系統,只有登錄退出、權限管理、日志管理等基本功能,方便擴展;前后端分離,后端采用ThinkPHP6,前端采用Vue2;項目由后端yylAdmin和前端yylAdminWeb組成。
- yylAdmin
- yylAdminWeb
演示
地址:https://demo.yyladmin.top/#/login?redirect=%2Fdashboard
賬號:yyladmin、admin
密碼:123456
提示:演示賬號只有部分權限,請下載源碼安裝體驗全部功能
準備
- PhpStudy
- Git
- Node
- Composer
- ThinkPHP
- Vue
- Element
要求
- PHP >= 7.1
- MySQL >= 5.6
- Redis
安裝
PHP部分
# 克隆項目 git clone https://gitee.com/skyselang/yylAdmin.git # 進入項目目錄 cd yylAdmin # 安裝依賴 composer install # 可以通過composer鏡像解決速度慢的問題 composer config -g repo.packagist composer https://mirrors.aliyun.com/composer/ # 導入數據庫 數據庫文件:public/private/yyladmin.sql # 配置 重命名.env.example為.env,修改里面配置 或者直接修改config文件夾里面的相應配置
登錄后復制
WEB部分
# 克隆項目 git clone https://gitee.com/skyselang/yylAdminWeb.git # 進入項目目錄 cd yylAdminWeb # 安裝依賴 npm install # 可以通過npm鏡像解決速度慢的問題 npm install --registry=https://registry.npm.taobao.org # 或者使用cnpm,安裝后使用cnpm替代npm,如 cnpm install npm install -g cnpm --registry=https://registry.npm.taobao.org # 配置 在.env*環境變量文件里面修改接口地址 # 啟動服務 npm run dev
登錄后復制
訪問
地址:http://localhost:9527
賬號:yyladmin
密碼:123456
管理員:skyselang
密碼:123456
開發
PHP部分
- 編寫接口代碼:app/admin/controller/AdminLog.php
<img width="100%" src="./public/static/img/devphp1.jpg">
- 添加菜單信息
<img width="100%" src="./public/static/img/devphp2.jpg">
- 分配相應權限
<img width="100%" src="./public/static/img/devphp3.jpg">
WEB部分
- 新建接口文件:src/api/admin.js
<img width="100%" src="./public/static/img/devweb1.jpg">
- 新建頁面文件:src/views/admin/log.vue
<img width="100%" src="./public/static/img/devweb2.jpg">
- 添加路由信息:src/router/index.js
<img width="100%" src="./public/static/img/devweb3.jpg">
刷新權限
- 退出重新登錄
<img width="100%" src="./public/static/img/devref.jpg">
發布
# 構建測試環境 npm run build:stage # 構建生產環境 npm run build:prod
登錄后復制
其它
# 預覽發布環境效果 npm run preview # 預覽發布環境效果 + 靜態資源分析 npm run preview -- --report # 代碼格式檢查 npm run lint # 代碼格式檢查并自動修復 npm run lint -- --fix
登錄后復制
預覽
<img width="100%" src="./public/static/img/yyladmin_login.jpg">
<img width="100%" src="./public/static/img/yyladmin.jpg">
FQA
npm
- 推薦使用cnpm:cnpm
- 刪除node_modules文件夾后使用cnpm重新安裝依賴
ui
- 使用的是element-ui:element-ui
browser
- 支持Chrome、Firefox、QQ、360、Edge等主流瀏覽器,不支持IE以及瀏覽器的兼容模式(IE內核)
debug
- 調試模式下根據接口返回錯誤信息排查,或者提Issue
協議
- Apache2開源協議,完全免費使用
- Copyright skyselang https://gitee.com/skyselang
以上就是解析yylAdmin系統的安裝使用的詳細內容,更多請關注風君子博客其它相關文章!
總結
以上是生活随笔為你收集整理的解析yylAdmin系统的安装使用的全部內容,希望文章能夠幫你解決所遇到的問題。