如何在VScode中添加代碼片斷

拿 VUE 舉例，新建 VUE 文件，輸入前綴，出現代碼段

文件 --->  首選項 ---> 用戶代碼片斷 

在輸入框中輸入 vue ，找到 vue.json ，而後在 vue.json 裏面配置。

以下是 vue.json 的例子

    // "Print to console": {
    //     "prefix": "log",
    //     "body": [
    //         "console.log('$1');",
    //         "$2"
    //     ],
    //     "description": "Log output to console"
    // }

 

prefix ： 在 Intellisense 中選擇代碼片斷時將使用的前綴。

 

body：代碼片斷的內容。使用「$1」和「${1:defaultText}」定義光標位置，使用「$0」定義最終光標位置。使用「${varName}」和「${varName:defaultText}」插入變量值，例如「這是文件：$TM_FILENAME」。

 

description：代碼片斷描述。

 

咱們能夠更改成本身想要的內容

"Print to console": {
    "prefix": "vuec",
    "body": [
      "<template>",
      "  <div>",
      "    $0",
      "  </div>",
      "</template>",
      "",
      "<script>",
      "export default {",
      "  name: '',",
      "",
      "  data () {",
      "    return {",
      "    }",
      "  },",
      "",
      "  methods: {}",
      "}",
      "</script>",
      "",
      "<style lang='stylus' rel='stylesheet/stylus'>",
      "",
      "</style>",
      ""
    ],
    "description": "Log output to console"
  }