大家好，我是雄雄，歡迎關注微信公眾號：雄雄的小課堂。

今天，給大家分享一個非常非常使用的小技巧，那就是：“在webstrom中創建一個簡單的vue模板”，根據這個方法，你可以任意的創建html模板、JavaScript模板、以及其他你想要的模板。

下面我們就來一步步的看看，如何創建vue的模板。

分析：上面這段代碼是在HTML文件中寫了個簡單的vue示例，相信大家很快的就看出來運行結果是什么，沒錯，就是在頁面中輸出【我的名字叫：王炎霸】。在初學vue時，這段代碼我們每創建一個vue示例，幾乎都會寫類似的代碼，所以就會出現重復工作。

為了省事，我們可以將這段代碼一并打包放在一個模板中，待下次使用時直接拿來用即可，會省好多工作。

點擊webstrom的文件，然后點擊設置，打開設置界面。（我都已經漢化了，英文版的對照這個找就可以）

點擊“編輯器”->實時模板->Vue->點擊右邊的“+”按鈕

選擇“動態模板”

最后填寫縮寫，比如我這里是vue，在html代碼中我們就可以通過寫vue來直接快速生成簡單的vue示例。

描述隨便寫寫

模板文本：就是我們在html頁面中復制過來的。

最后點擊“定義”，選擇“HTML”

最后點擊應用，確定。

然后我們回到html頁面中，直接在空文檔中輸入vue，然后按tab鍵，即可直接出來示例代碼。

操作完畢，你會了嗎？

總結

以上是生活随笔為你收集整理的学会它，可以替你写100行 200行 300行……的代码的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。