分享一個基於 ABP(.NET 5.0) + vue-element-admin 管理后台

相關內容簡體繁體

分享一個基於 ABP(.NET 5.0) + vue-element-admin 管理后台

本文轉載自查看原文 2022-01-28 21:15 2030 ABP/ .NET 5.0

1、前言

分享一個基於ABP(.NET 5.0) + vue-element-admin項目。希望可以降低新手對於ABP框架的學習成本，感興趣的同學可以下載項目啟動運行一下。對於想選型采用ABP框架的，個人認為: ABP框架本身功能完善、設計封裝優雅、擴展性高、層次划分簡直完美、DDD基礎設施完善，基本適用於大部分項目。唯一致命缺陷在於租戶、用戶主鍵采用了GUID類型，兼容性太差。還有就是相對於JAVA框架來說，實踐開源項目、文檔資料較少。不過很多項目可以忽略這個影響，極力推薦后端直接采用ABP作為框架。然后祝大家春節快樂。

2、Demo項目信息

2.1、在線Demo預覽

(國內) https://xfree.top/simple-admin
(國外) https://zhoufeihong.github.io/XFreeSimpleWeb/

2.2、源碼網址

https://gitee.com/RiverBied/XFreeSimple.git
https://github.com/zhoufeihong/XFreeSimple.git

2.3、支持功能清單

3、如何快速開始

3.1、啟動mysql、redis基礎設施

如果系統已經安裝了Docker Desktop

在如下圖目錄右鍵up.ps1使用Powershell運行或者使用命令行輸入"powershell .\up.ps1"運行，即在本機運行了mysql、redis，同時自動創建數據庫: "x_free_dev_center_1"。

Docker Desktop安裝可以參考: https://docs.docker.com/desktop/windows/install/

已經有Mysql服務、Redis服務

修改appsettings.json下的配置，確保和環境一致。創建"x_free_dev_center_1"數據庫，不然無法啟動，數據庫名稱可以自定義。

"ConnectionStrings": {
    "ApplicationConnection": "Server=127.0.0.1;port=3306;Database=x_free_dev_center_1;User=root; Password=root"
  },
  "Redis": {
    "IsEnabled": true,
    "Configuration": "127.0.0.1:6379,password=123"
  }

3.2、啟動后台服務

編譯解決方案、將XFreeSimpleService.Host設為啟動項目

啟動XFree.Simple.Web

打開swagger地址

網址: http://localhost:41130/swagger/index.html。

出現如下界面則說明后台已經正常啟動。

連接數據庫，可以看到已經自動初始化數據庫表。

3.3、啟動前端項目

使用Visual Code打開項目目錄vue-element-admin

前端基於vue-element-admin方案實現，具體可以參見README.vue-element-admin.md。打開后效果:

安裝依賴、啟動項目

# 安裝依賴
npm install

# 建議不要直接使用 cnpm 安裝依賴，會有各種詭異的 bug。可以通過如下操作解決 npm 下載速度慢的問題
npm install --registry=https://registry.npm.taobao.org

# 啟動服務
npm run dev