https://zhuanlan.zhihu.com/p/34735529
首先說明下，這個插件是用idea開發的，在idea上同樣適用。有興趣的朋友可以直接git下來開發自己的小插件。
插件基於的webstorm版本是2017.3.5。所以建議升級使用最新版的webstorm。
webstorm是我非常喜歡的一款編輯器。用來開發前端代碼，自帶的智能提示功能我非常喜歡，能夠滿足我絕大部分編碼要求。
但在使用vue+element開發系統時，沒有找到好的代碼提示工具。雖然通過webstorm的live template功能能夠手動添加代碼片段提示。
但是，在編碼時，element元素上有很多屬性和事件，我是沒法記住（哈哈，也許大神的你可以全部記住。）。所以還是得常常到官網上去查看每個屬性什么意思。
為了能夠在開發中解決這些問題，提高開發效率，我決定做個小小的webstorm插件。
哈哈，首先貼出插件源碼地址：
jiaolong1021/ElementPlugin
https://link.zhihu.com/?target=https%3A//github.com/jiaolong1021/ElementPlugin
有興趣的朋友，可以自己在這個基礎上開發屬於自己的小插件。
如果你想直接下載安裝可以按下面步驟操作：
接下來介紹下插件的基本功能吧：
1、標簽文檔說明查看 （快捷鍵：ctrl + q）
通過在標簽上按下ctrl+q快捷鍵，你能夠查看該標簽元素有哪些參數、哪些事件。哈哈，這樣就可以不用動不動就去看官網了。
2、代碼塊提示功能（live templates）快捷鍵： ctrl + space
哈哈，這樣是不是可以提高代碼的編寫效率。
3、標簽提示
輸入<后寫el-等會自動出現element標簽元素。哈哈，對於有些不熟悉element有哪些元素的朋友可以方便自己去找。
4、屬性編寫提示以及屬性值自動完成
帶有藍色向上箭頭的屬性屬element獨有屬性
5. element方法提示 (以 elm 開始)
方法包括（message, alert, confirm, notify, prompt）
在標簽后打個空格，webstorm會自動提示該元素包含的屬性。本想把所有該元素自身包含的屬性放在最前面，奈何本人功底有限，沒有找到開發idea插件元素屬性置前的方法，如果有熟悉的朋友可以告訴我哦，我再加上去。
如果大家有什么疑問或者好的想法，可以直接聯系我哦。
qq: 2278371826
email： shenjiaolong1021@163.com