本文介紹了一個基于Vue CLI 5.x / Vite 2.x、Vue 3.x和Ant Design Vue 3.x的基礎后臺管理系統模板。該模板還包括RBAC權限系統、JSON Schema動態表單、動態表格以及漂亮的鎖屏界面等功能。

安裝和使用

首先，按照以下步驟進行安裝和使用：

  1. 進入項目目錄：

    cd vue3-antd-admin

  2. 安裝依賴：

    yarn install

  3. 運行開發服務器：

    yarn serve

  4. 打包項目：

    yarn build

VSCode配置

為了更好地開發和編輯該項目，建議進行以下VSCode配置：

  1. 安裝推薦插件：在項目根目錄下的.vscode文件夾中，安裝推薦的插件。
  2. 安裝Volar并禁用Vetur：在插件市場中搜索并安裝Volar插件，并禁用Vetur插件。重新啟動VSCode即可生效。關于更詳細的Vue3 IDE配置，可參考官方文檔。

項目技術棧

該項目使用了Vue 3.x全家桶、Ant Design Vue 3.x和TypeScript 4.x。通過這個項目，我們可以實踐Vue 3.x的新特性和玩法。相比于Vue 2.x的Options API，Vue 3.x的Composition API更加靈活，使我們能夠更靈活地組合組件邏輯。我們可以輕松地使用hooks替代以前的mixin等寫法。如果想了解更多關于hooks的內容，可以參考vueuse。

項目簡介

該基礎后臺管理系統模板中，默認情況下，rootadmin賬號支持多點登錄，而其他新建的賬號默認只能單點登錄。建議在本地拉取后端代碼并運行，以避免多人同時操作時產生沖突和誤解。

通過本文的介紹，您可以快速上手這個基于Vue3.x + Ant Design Vue3.x + TypeScript Hooks的基礎后臺管理系統模板。希望該模板能為您的開發工作提供便利，并能夠滿足您的需求。