abstract：最近開發(fā)Vue，也用過(guò)很多文本編輯器，總覺得找不到一款好的編輯器來(lái)開發(fā)Vue，所以想問(wèn)問(wèn)那些編輯器的生態(tài)圈對(duì)Vue友好一點(diǎn)提到 Vue 的編輯器支持，一般都是談對(duì) Vue 的 Single File Component 的支持了。如果現(xiàn)在急著用，什么用的習(xí)慣就用什么好。Atom, VSCode, Sublime, Vim 對(duì) *.vue 文件都有不錯(cuò)的 syntax highlighting。但是

最近開發(fā)Vue，也用過(guò)很多文本編輯器，總覺得找不到一款好的編輯器來(lái)開發(fā)Vue，所以想問(wèn)問(wèn)那些編輯器的生態(tài)圈對(duì)Vue友好一點(diǎn)

提到 Vue 的編輯器支持，一般都是談對(duì) Vue 的 Single File Component 的支持了。

如果現(xiàn)在急著用，什么用的習(xí)慣就用什么好。Atom, VSCode, Sublime, Vim 對(duì) *.vue 文件都有不錯(cuò)的 syntax highlighting。
但是，長(zhǎng)期來(lái)看，請(qǐng)關(guān)注 VSCode。

VSCode 在最近重新恢復(fù)了 embedded language 的 syntax highlighting?，F(xiàn)在編輯 Vue 的文件大概這樣：

在下個(gè)月 VSCode 會(huì)加入 embedded language 的 intelliSense。也就是說(shuō)，可以通過(guò)插件讓編輯上圖的代碼時(shí)，編輯 <template> 中的內(nèi)容時(shí)使用 html/pug 的提示，<script> 中用 js/ts 的提示，<style> 中用 css/scss 的提示之類。

但并不止這些。

其它的功能，比如 peek definition （快速查看定義），jump to definition 之類的功能，也是可以通過(guò)插件在 *.vue 文件中實(shí)現(xiàn)的。
個(gè)人覺得這些功能寫起 Vue 來(lái)還是幫助很大的。用 Vuex 在 Component 中寫的 getter，直接一個(gè) ?+F12 就可以看到 getter 的定義。反過(guò)來(lái)，在 getter 的定義上一個(gè) ?+F12，可以顯示所有使用這個(gè) getter 的 Component。

現(xiàn)在 VSCode 中 Vue 的插件并不是很好用。打算下個(gè)月 VSCode 加入對(duì) embedded language 的 intelliSense 后自己做一個(gè)。
如果有希望實(shí)現(xiàn)的功能歡迎留言。