# Vue-cli
參考：https://ithelp.ithome.com.tw/articles/10246450

## 安裝
1. 你的開發環境已安裝Node.js(若沒有，則請至[官方網站](https://nodejs.org/en)安裝穩定版本)
1. 利用以下指令全域安裝vue-cli

    npm install -g @vue/cli
    # OR
    yarn global add @vue/cli

## 建立本地專案
1. 在終端機輸入：`vue create projectName`

> 建立專案時預錯時，參考解決方法：[1](https://blog.csdn.net/crystal4000/article/details/119327458#:~:text=%E8%A7%A3%E5%86%B3%E6%96%B9%E6%A1%88%EF%BC%9A%20%E4%BB%A5%E7%B3%BB%E7%B5%B1%E7%AE%A1%E7%90%86%E5%93%A1%E6%AC%8A%E9%99%90%E5%9F%B7%E8%A1%8C%20PowerShell%EF%BC%8C%E5%9F%B7%E8%A1%8C%E4%BB%A5%E4%B8%8B%E6%8C%87%E4%BB%A4%3A%20Set-ExecutionPolicy,RemoteSigned%201%20%E4%BD%BF%E4%BD%9C%E6%A5%AD%E7%B3%BB%E7%B5%B1%E6%8E%A5%E5%8F%97%E6%89%80%E6%9C%89%E8%87%AA%E8%A8%82%E6%88%96%E4%BF%A1%E4%BB%BB%E4%BE%86%E6%BA%90%E7%9A%84%20Script%EF%BC%8C%E5%A6%82%E6%AD%A4%E5%95%8F%E9%A1%8C%E4%BE%BF%E8%A7%A3%E6%B1%BA%E5%95%A6%E3%80%82), [2](https://israynotarray.com/other/20200510/1067127387/)

2. 選開資料夾，並在終端機輸入下列指令

    cd projectName // 移動到剛建立的專案資料夾
    npm run serve // 利用指令運行我們的vue專案

3. 在`localhost:8080`就能看到運行的vue專案

## 專案結構
* README.md
* 所有關於運行的細節都寫在裡面，包含日後build的指令。
* babel.config.js
* 由於一開始的preset我們有選Babel，這個檔案會放有關Babel的設定，協助將你的程式碼轉為ES5之前的檔案。
* node_modules
* 放置專案內所有安裝的js套件，注意此資料夾已經預先被加入gitignore了。
* package.json
* 存放此專案的資訊，其中包含著安裝的套件、版本、關鍵字等資訊。
* public
* 此資料夾中包含著最重要的原始html檔案，也是我們最終vue實體綁定的對象，若你有想加入的CDN，也可以直接加在html檔案上。
* src
* 最為常用的資料夾，裡面包含著所有運行的主程式、組件以及與專案相關的額外資源(圖片等)，你會發現幾乎所有的操作都在裡面完成。
* src/App.vue
* 專案的進入點