vscode前端代碼注釋模板使用介紹

https://blog.csdn.net/hanwuqia0370/article/details/85777899?utm_medium=distribute.pc_relevant.none-task-blog-BlogCommendFromBaidu-2

 

添加注釋

1. ctrl+shift+p打開
2. 輸入snippets點擊進入用戶代碼片段配置

3. 配置css.json/css
   
   進入之后輸入

4. {
       "Print to cssTitle": {
         "prefix": "cssNoteTitle",
         "body": [
           "/*",
           " *@description: ",
           " *@author: 查嘉磊 ",
           " *@date: ${CURRENT_YEAR}-${CURRENT_MONTH}-${CURRENT_DATE} ${CURRENT_HOUR}:${CURRENT_MINUTE}:${CURRENT_SECOND}",
           " *@version V1.0.5 ",
           "*/"
         ],
         "description": "Title對應css注釋標題"
       },
       "Print to cssItem":{
         "prefix": "cssNoteItem",
         "body": [
           "/*",
           " *@description: ",
           " *@author: 查嘉磊 ",
           " *@date: ${CURRENT_YEAR}-${CURRENT_MONTH}-${CURRENT_DATE} ${CURRENT_HOUR}:${CURRENT_MINUTE}:${CURRENT_SECOND}",
           "*/"
         ],
         "description": "Item對應css類注釋"
       }
     }

   用法：

5. 在<style> </style>標簽中間
   輸入css會出現下面的選項
   

   　　

   Title對應css注釋標題
   Item對應css類注釋
   注意：使用sass或less等css語言需重新設置less.json和sass.json

   配置javascript.json/javascript

6. {
     "Print to jsNoteTitle": {
       "prefix": "jsNoteTitle",
       "body": [
         "/*",
         " *@description:",
         " *@author: 韓武洽",
         " *@date: ${CURRENT_YEAR}-${CURRENT_MONTH}-${CURRENT_DATE} ${CURRENT_HOUR}:${CURRENT_MINUTE}:${CURRENT_SECOND}",
         " *@version: V1.0.5",
         "*/"
       ],
       "description": ""
     },
     "Print to jsfn": {
       "prefix": "jsfn",
       "body": [
         "/*",
         " *@functionName: ${TM_CURRENT_LINE}",
         " *@params1: ${1:參數1}",
         " *@params2: ${2:參數2}",
         " *@params3: ${3:參數3}",
         " *@params4: ${4:參數4}",
         " *@description:",
         " *@author: 韓武洽",
         " *@date: ${CURRENT_YEAR}-${CURRENT_MONTH}-${CURRENT_DATE} ${CURRENT_HOUR}:${CURRENT_MINUTE}:${CURRENT_SECOND}",
         " *@version: V1.0.5",
         "*/"
       ],
       "description": ""
     },
     "Print to jsModify": {
       "prefix": "jsModify",
       "body": [
         "/*",
         " *@description:",
         " *@modifyContent:",
         " *@author: 韓武洽",
         " *@date: ${CURRENT_YEAR}-${CURRENT_MONTH}-${CURRENT_DATE} ${CURRENT_HOUR}:${CURRENT_MINUTE}:${CURRENT_SECOND}",
         "*/"
       ],
       "description": ""
     },
     "Print to jsVariable": {
       "prefix": "jsVariable",
       "body": [
         "/*",
         " *@description:",
         " *@author: 韓武洽",
         " *@date: ${CURRENT_YEAR}-${CURRENT_MONTH}-${CURRENT_DATE} ${CURRENT_HOUR}:${CURRENT_MINUTE}:${CURRENT_SECOND}",
         " *@variable1: ${1:變量1}",
         " *@variable2: ${2:變量2}",
         " *@variable3: ${3:變量3}",
         " *@variable4: ${4:變量4}",
         " *@variable5: ${5:變量5}",
         "*/"
       ],
       "description": ""
     }
   }

   用法：用法和css類似在script標簽內輸入js出現提示