vscode配置前端注释模板

926 阅读1分钟

打开配置文件

  1. windows:ctrl + shift + p打开
  2. MAC:command + shift + p

image.png

配置文件内容

css

image.png

css.json

{
    "Print to cssTitle": {
      "prefix": "cssNoteTitle",
      "body": [
        "/*",
        " *@description: ",
        " *@author: lihaili",
        " *@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: lihaili",
        " *@date: ${CURRENT_YEAR}-${CURRENT_MONTH}-${CURRENT_DATE} ${CURRENT_HOUR}:${CURRENT_MINUTE}:${CURRENT_SECOND}",
        "*/"
      ],
      "description": "Item对应css类注释"
    }
  }

用法:在<style></style>标签中间 输入css会出现下面的选项

Title 对应css注释标题
Item 对应css类注释
注意: 使用sass或less等css语言需重新设置less.jsonsass.json


js

js.json

{
  "Print to jsNoteTitle": {
    "prefix": "jsNoteTitle",
    "body": [
      "/*",
      " *@description:",
      " *@author: lihaili",
      " *@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}",
      " *@description:",
      " *@author: lihaili",
      " *@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: lihaili",
      " *@date: ${CURRENT_YEAR}-${CURRENT_MONTH}-${CURRENT_DATE} ${CURRENT_HOUR}:${CURRENT_MINUTE}:${CURRENT_SECOND}",
      "*/"
    ],
    "description": ""
  },
  "Print to jsVariable": {
    "prefix": "jsVariable",
    "body": [
      "/*",
      " *@description:",
      " *@author: lihaili",
      " *@date: ${CURRENT_YEAR}-${CURRENT_MONTH}-${CURRENT_DATE} ${CURRENT_HOUR}:${CURRENT_MINUTE}:${CURRENT_SECOND}",
      " *@variable1: ${1:变量1}",
      " *@variable2: ${2:变量2}",
      "*/"
    ],
    "description": ""
  }
}

用法:用法和css类似, 在script标签内输入js出现提示

注意: jsNoteTitle 对应开始标题注释
Jsfn 对应方法注释
JsModify 对应方法修改注释
JsVariable 对应变量注释


最重要的是:  将作者名改为自己的名字,注释时请填写描述和时间若出现排版错乱请修改body数组里面的字符串内容 换行使用\n 空格就是空格

参考来源