能寫vue的編輯器/ide有很多，我個人比較推薦用VSCode 來寫vue，就連vue的作者尤雨溪也在微博上說過自己也用的是VSCode 。

我們今天講講該如何用VSCode 開發vue。跟大多數 IDE 一樣，VSCode 也有擴充套件和主題市場，包含海量外掛。使用VSCode 開發vue一定要安裝幾個強大的外掛，提高工作效率。比如VSCode下面的Vetur就是這樣一款必備的Vue開發工具。下面就開始介紹一下它的一些功能吧。

Vetur支援.vue檔案的語法高亮顯示，除了支援template模板以外，還支援大多數主流的前端開發指令碼和外掛，比如Sass和TypeScript，完整的支援高亮的語法如下所示：。語法高亮是所有ide必備的功能之一，沒有語法高亮寫起程式碼實在是不舒服。

Vetur預設使用 eslint-plugin-vue@beta 來檢測 <template>，錯誤檢測能夠幫助我們在開發過程發現xie

Vetur推薦使用2個空格來規定 editor.tabSize 和 editor.insertSpace，對於html和css/scss/less格式使用js-beautify來規範，js/ts的格式使用 TypeScript"s language service，同時這些配置是可以改變的。有了自動格式化功能，寫程式碼時可以減少注意格式花的時間，把時間精力放在程式碼本身，大大提升寫程式碼效率。

我是vue的粉絲，使用vue有一段時間了，我一直使用webstrom編寫前端頁面，所以習慣了使用，還好webstrom有vue外掛，但webstrom是收費的，並且比較吃記憶體，比較卡，如果你之前沒有用過webstrom的話，不推薦你使用webstrom，以下是webstrom編寫vue專案程式碼的截圖：

但我推薦使用sublime來寫vue,因為sublime有vue的外掛支援，並sublime是免費的，也屬於輕編輯器。除了sublime還有兩個推薦，atom和vs code。

用來寫Vue的編輯器有很多，下面我來說一說我平時寫Vue使用的編輯器——Visual Studio Code

Visual Studio Code簡稱VS code，首先vs code是一款免費的編輯器；同時支援外掛擴充套件；可以下載針對Vue的擴充套件，這樣就可以對vue有語法提示、語法高亮，使用起來就比較方便；vs code編輯器的介面也是非常清新簡潔，對各種型別檔案都有不同的圖示，非常值得推薦的

總結：

當然還有其他編輯器，比如subline text3、webstrom等，都可以用來寫Vue，選擇一款適合自己的編輯器就可以了，我個人話比較推薦vs code；

我覺得vscode最方便，拉取專案，上傳專案都超級方便。

快捷鍵設定也是不難，還能弄箇中文外掛，報錯外掛，自動補全外掛，個人覺得超讚。