首頁  >  文章  >  開發工具  >  淺談VSCode中配置並產生自訂範本的方法

淺談VSCode中配置並產生自訂範本的方法

青灯夜游
青灯夜游轉載
2021-08-03 19:36:044394瀏覽

VSCode如何快速產生自訂模板​​?本篇文章為大家介紹一下在VSCode中配置並產生自訂範本的方法。

淺談VSCode中配置並產生自訂範本的方法

1. 安裝VSCode

#下載位址:https://code.visualstudio.com/

安裝完成後啟動vsCode , 此處省略一萬字....【推薦學習:《vscode教程》】

2 . 喚出VSCode控制台

Windows 快速鍵: Ctrl Shift P

macOS 快速鍵 : command Shift P

淺談VSCode中配置並產生自訂範本的方法

#3.輸入「snippets」並選擇

淺談VSCode中配置並產生自訂範本的方法

4.  如下有許多程式碼片段進行自訂編寫

淺談VSCode中配置並產生自訂範本的方法

#5. 我們以vue 檔案進行示範( 輸入vue )選擇vue.json

淺談VSCode中配置並產生自訂範本的方法

#6. vsCode 自動產生vue.json 檔案如下

淺談VSCode中配置並產生自訂範本的方法

#7. 將vue.json 檔案改為下列配置(可依個人需求進行修改範本內容)

{
"Print to console": {
"prefix": "vue",
"body": [
"<template>",
"  <div></div>",
"</template>",
"",
"<script>",
"export default {",
"  components: {},",
"  props: {},",
"  data() {",
"    return {",
"    };",
"  },",
"  watch: {},",
"  computed: {},",
"  methods: {},",
"  created() {},",
"  mounted() {}",
"};",
"</script>",
"<style lang=\"scss\" scoped>",
"</style>"
],
"description": "A vue file template"
}
}

8. 在專案中新建一個vue 檔案輸入「 vue 」 按下回車鍵或Tab鍵,範本就自動產生了

淺談VSCode中配置並產生自訂範本的方法

原文網址:https://juejin.cn/post/6974605121942454280

作者:三豬技術團隊

更多程式設計相關知識,請造訪:程式設計入門! !

以上是淺談VSCode中配置並產生自訂範本的方法的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述:
本文轉載於:掘金--三猪技术团队。如有侵權,請聯絡admin@php.cn刪除