目錄結構:
目錄/文件 說明
| build | 項目構建(webpack)相關代碼 |
| config | 配置目錄，包括端口號等。我們初學可以使用默認的。 |
| node_modules | npm 加載的項目依賴模塊 |
| src | 這裡是我們要開發的目錄，基本上要做的事情都在這個目錄裡。裡包含了幾個目錄及文件： assets 放置一些圖片，如logo等 components 目錄裡面放了一個組件文件，可以不用 App.vue 項目入口文件，我們也可以直接將組件寫這裡，而不使用 components 目錄 main.js 項目的核心文件 |
| static | 靜態資源目錄，如圖片、字體等 |
| test | 初始測試目錄，可刪除 |
| .xxxx | 文件 這些是一些配置文件，包括語法配置，git配置等 |
| index.html | 首頁入口文件 |
| package.json | 項目配置文件 |
| README.md | 項目的說明文檔，markdown 格式 |
修改src/components/HelloWorld.vue
static資料夾內存放的是“真正的”靜態資源，他們不會被webpack處理。
認識babel與ESLint
- babel是一個轉碼器，因為目前瀏覽器對於新型態JavaScript語法支援度不高，babel-loader可將ES6或ES7語法轉為支援度高的ES5的語法。
- ESLint目的是改善程式碼品質，發現與修正程式碼的問題並達到一制性，所以有安裝此套件的話，常常會在編譯執行時看到很多warning訊息，如果安裝之後想要忽略ESLint檢查，可以到.eslintignore文件中做修改。
src資料夾底下架構
而我們主要編輯的code檔案會放在src這個資料夾內，src資料夾內架構如下圖：
main.js是整個專案的主要入口點，他會去連接到這個專案主要的根實體App.vue。
參考:
https://www.runoob.com/vue2/vue-directory-structure.html
https://ithelp.ithome.com.tw/articles/10193761
Yiru@Studio - 關於我 - 意如