vs code工具中設置html5 快速生成vue模板


vs code工具中設置html5 快速生成vue模板

1.編輯html.json文件
2.替換需要自動生成的代碼
3.在新建的html中輸入vh回車即可


1.編輯html.json文件(在用戶片段里面找不到html.json)

 

在用戶片段里面找不到html.json,新建全局代碼片段文件,文件名為html.json

 

然后copy代碼,也可以自定義自己需要的模板。

 

 

 

輸入html,選擇html.json文件


2.替換需要自動生成的代碼

{
  "html5-vue": {
    "prefix": "vh", // 對應的是使用這個模板的快捷鍵
    "body": [
      "<!DOCTYPE html>",
      "<html lang=\"en\">",
      "<head>",
      "\t<meta charset=\"UTF-8\">",
      "\t<meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">",
      "\t<meta http-equiv=\"X-UA-Compatible\" content=\"ie=edge\">",
      "\t<title>Document</title>",
      "\t<script src=\"./lib/vue_2.5.22.js\"></script>",     
      "</head>\n",
      "<body>",
      "\t<div id =\"app\"> </div>\n",
      "\t<script>",
      "\t //創建Vue實例,得到 ViewModel",
      "\t const vm = new Vue({",
      "\t\tel: '#app',",
      "\t\tdata: {},",
      "\t\tmethods: {}",
      "\t });",
      "\t</script>",
      "</body>\n",
      "</html>"
    ],
    "description": "HT-H5" // 模板的描述
    }
}



3.在新建的html中輸入vh回車即可

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM