vue-element-admin一個基於 vue2.0 和 Eelement 的控制面板 UI 框架，這是使用vue技術棧開發的前端程式設計師的首選管理系統模板，模板以及非常的成熟了，並且有相關的社群和維護人員，開發時候遇到問題也不要慌。

推薦指數：star:star:62.1k
Github 地址：https://github.com/PanJiaChen/vue-element-admin
Demo體驗：https://panjiachen.github.io/vue-element-admin/#/dashboard

文件：https://panjiachen.github.io/vue-element-admin-site/zh/

今天就來說一下，怎使用這個模板，以及寫好了專案，怎麼樣把專案打包成靜態檔案，部署在伺服器上。

1：去github上面下載或者克隆
Github 地址：https://github.com/PanJiaChen/vue-element-admin
我這裡使用簡單粗暴的方式，直接下點選載按

2：把專案匯入vscode，點開終端，並且在專案裡面安裝依賴。

npm install --registry=https://registry.npm.taobao.org

建議不要用 cnpm 安裝 會有各種詭異的bug 可以通過如下操作解決 npm 下載速度慢的問題

安裝完成會發現專案目錄中多了一個依賴資料夾

3：執行本地開發 啟動專案

npm run dev

4：瀏覽器開啟
執行成功就使用瀏覽器開啟http://localhost:9527/

可以在這個後臺管理系統的模板的基礎上，修改一些自己需要的程式碼，變成自己的開發的專案了，此處自行發揮，省略一萬字。

修改vue-element-admin左側導航欄的圖示
1：開啟阿里向量圖示庫https://www.iconfont.cn/
選擇一個圖示下載

選擇下載格式給svg的格式
2：
把我們下載的icon圖示的index.svg檔案複製到/src/icons/svg資料夾下

3：開啟src/router/index.js

在meta：{ icon}中引入即可。

4:
可以看到我從阿里向量下載下來的圖示，已經放到左側導航欄的圖示上去了~~

————————————————
版權宣告：本文為CSDN博主「祈澈菇涼」的原創文章，遵循CC 4.0 BY-SA版權協議，轉載請附上原文出處連結及本宣告。
原文連結：https://blog.csdn.net/qq_36538012/article/details/110523362