全棧的自我修養: 6使用vue ui進行vue.js環境搭建
It is only with the heart that one can see rightly. What is essential is invisible to the eye.
用心才能看得清事物的本質，真正重要的東西是肉眼看不見的。
當你看到這篇文章的時候，暫且認為你對如何做一個網站有了興趣.
前言
上幾篇文章曾經講過使用 vue-cli 和新版本的 @vue/cli 通過命令的方式創建項目和一些常用的配置，但直接用手動點一下創建項目她不香嗎!?
這也是我們第一個前后端示例項目的開始
Phil Karlton 曾說“在 CS 領域中，有兩件事是非常難的，一個是緩存失效，一個是命名。”
這里隨便起個名字吧，這個項目就叫 kola 了，做一個簡單的權限管理系統吧
安裝@vue/cli
這里還是要安裝 @vue/cli, 如果已經安裝了請忽略
epimetheus$ npm install -g @vue/cli
安裝速度還是比較慢的，大家可以喝杯水
安裝完成后可以 vue --version 看下版本號
epimetheus$ vue --version
@vue/cli 4.4.6
創建 Vue 項目
在終端輸入命令
$ vue ui
🚀 Starting GUI...
🌠 Ready on http://localhost:8000
這里選擇創建, 然后創建一個新項目
這里先選擇默認，畢竟我不會配呀
創建可能需要等一會
在這里我們可以通過自定義，添加一些其他展示項
這里我們點擊插件，添加一下 vue-route, vuex
通過 +添加插件，通過搜索選擇一些插件進行安裝，這里安裝下 element 插件, 選擇默認配置直接安裝即可
同樣的方式安裝下 axios 插件
然后我們看看項目能否運行起來
在任務里面我們可以看到 serve、build、lint 和 inspect
點運行，即會運行我們的項目了，成功后點啟動項目就能看見我們的項目
如果編譯失敗了，可以在配置中先將
ESLint configuration中 保存時檢查 先關閉
這樣就暫時大功告成了
項目結構
通過 vscode 打開這個項目，發現多了 plugins 目錄，這里面放了插件的默認配置，查看 main.js, 可以看出 vue-router、store、elementui 和 axios 已經進行了默認配置，是不是比我們手動配置香了了呢，她香了
git
參考
- @vue/cli : https://cli.vuejs.org/zh/guide/
