1.查詢IntelliJ IDEA是否已經安裝vue.js

 注:之前有寫過關於使用cmd命令搭建vue專案的全部過程，詳情在此

開啟IDEA編輯器，快捷鍵Ctrl+Alt+S開啟Settings(設定)------>Plugins------>搜尋vue.js（圖中已經安裝，沒有安裝的點選Install JetBrains plugins...進行安裝即可），安裝成功後重啟IDEA。

2.IDEA安裝好vue.js後，接著Ctrl+Alt+S開啟設定------>Editor------>File Types------>HTML，點選右側+號，新增*.vue，最後點選Apply。

3.設定JS

繼續Ctrl+Alt+S(Settings)------>Language & Frameworks------>JavaScript選擇ECMAScript 6和Prefer Strict mode。

4.用vue-cli構建和執行專案

開啟命令列工具cmd(Window+R)，或者在IDEA中的Terminal裡面進入想要構建專案的目錄，輸入vue init webpack mypro(mypro是自己想要構建的專案名稱)，回車後如下圖：

5.進入構建之後的專案資料夾：cd mypro，輸入npm install ，專案資料夾中會出現node_modules資料夾。

6.最後執行npm run dev(執行專案之前記得把config資料夾中的index.js中的autoOpenBrowser設定為true,這樣的話npm run dev瀏覽器會自動開啟專案)。執行結果如下圖：

7.在IDEA中新建.vue格式的檔案

開發的時候IDEA編輯器中是沒有.vue格式檔案的，所以需要在編輯器中設定。

接著Ctrl+Alt+S(Settings)------>Editor------>File and Code Templates

設定完成後就可以直接在專案中新建.vue格式檔案了~~~

新建的home.vue結果：