vue模板快速生成

vue  模板  快速生成 

每一次都手動敲重復代碼的話，是一個很繁瑣的事情，通過vscode自帶代碼片段可以解決我們大部分問題

文件 => 首選項 => 用戶代碼片段=>選擇H5.json

代碼片段

{
    "VUE": {
        "prefix": "vue", // 觸發的關鍵字 輸入vue按下tab鍵
        "body": [
            "<div id=\"app\">{{message}}</div>", //遇到代碼內有""的，需要用\進行轉義
            "<script src=\"../js/vue.js\"></script>",
            "<script>",
            "\tlet app = new Vue({",
            "\tel: '#app',",  //\t表示制表符
            "\tdata: {",
            "\t\tmessage: 'hello world'",
            "\t}",
            "\t})",
            "</script>"
        ],
    }
}

1. 每一行的代碼都需要用 " " 包裹，遇到代碼內有 " 的，需要用 \ 進行轉義
2. \t 表示制表符
3. 空的一行必須用 "" 包裹
4. $1代表光標第一次出現的位置， $2 代表按下tab后光標第二次出現的位置 $0表示光標最后出現的位置

vue模板快速生成