VSCode扩展工具 1. koroFileHeader 注释插件的使用

11,264 阅读1分钟

koroFileHeader 注释插件

  1. 安装:
    • vscode侧边栏扩展 -> 搜索koroFileHeader -> 安装
  2. 使用:
    • 头部注释:Ctrl + alt + i

      直接按住快捷键,即可在当前文件头部生成

    • 函数注释:Ctrl + alt + t

      鼠标光标移到到目标函数的上一行,再按快捷键

koroFileHeader 使用出现的问题

  • ctrl+alt+t 函数注释快捷键失效
    • 问题原因:
    • 问题解决方案
      • 修改快捷键:
        1. VScode工具栏:文件 -> 首选项 -> 键盘快捷方式

        2. 查找Ctrl+alt+t,是cursorTip命令,双击修改成其他快捷键,如Ctrl+alt+b,用该快捷键去重新注释

定制个人注释配置项

  • 函数注释示例:
/**
 * @func downloadExprotFile
 * @desc 根据文件流下载文件
 * @param {string} fileStream 文件流
 * @param {string} name 文件名
 * @param {string} extension 文件后缀
 * @param {string} [type] 文件类型(当不知道类型时可以选择不写)
 * @returns {object} undefined
 * @example 
 *        downloadExprotFile(data, '证件申办表', 'docx')
 *       .then(res => { this.$message.success('导出成功') })
 *       .catch(errMsg => { this.$message.error(errMsg || '导出失败') })
 */
export const downloadExprotFile = (fileStream, name, extension, type = "") => {
  return new Promise((resolve, reject) => {
    const blob = new Blob([fileStream], {type: type || fileStream.type});
    const fileName = `${name}.${extension}`;
    if ("download" in document.createElement("a") && fileStream.type) { // 非IE下载
      const elink = document.createElement("a");
      elink.download = fileName;
      elink.style.display = "none";
      elink.href = URL.createObjectURL(blob);
      document.body.appendChild(elink);
      elink.click();
      URL.revokeObjectURL(elink.href);
      document.body.removeChild(elink);
      resolve(fileStream)
    } else { // IE10+下载
      navigator.msSaveBlob(blob, fileName);
      reject(fileStream)
    }
  })
};
  • 头部注释示例:
<!--
 * @Author       : JK
 * @Date         : 2021-09-10 11:44:34
 * @LastEditors  : JK
 * @LastEditTime : 2021-09-10 16:02:23
 * @FilePath     : \personal\outer\cosmeticDentistry\CDPro\src\components\Extension.vue
 * @Description  : 
 * Copyright 2021 OBKoro1, All Rights Reserved. 
 * 2021-09-10 11:44:34
-->
  • vscode侧边栏下方管理 -> 设置 -> setting.json
{
  // ……
  // koro1FileHeader start
  // 插件配置选项
  "fileheader.configObj": {
    "createFileTime": true, // 当前时间/创建文件时间, 设为false更改为当前生成注释的时间
    "language": {
      "languagetest": {
        "head": "/$$",
        "middle": " $ @",
        "end": " $/"
      }
    },
    "autoAdd": true,
    "autoAddLine": 100,
    "autoAlready": true,
    "annotationStr": {
      "head": "/*",
      "middle": " * @",
      "end": " */",
      "use": false
    },
    "headInsertLine": {
      "php": 2,
      "sh": 2
    },
    "beforeAnnotation": {
      "文件后缀": "该文件后缀的头部注释之前添加某些内容"
    },
    "afterAnnotation": {
      "文件后缀": "该文件后缀的头部注释之后添加某些内容"
    },
    "specialOptions": {
      "特殊字段": "自定义比如LastEditTime/LastEditors"
    },
    "switch": {
      "newlineAddAnnotation": true
    },
    "supportAutoLanguage": [],
    "prohibitAutoAdd": [
      "json"
    ],
    "folderBlacklist": [
      "node_modules",
      "文件夹禁止自动添加头部注释"
    ],
    "prohibitItemAutoAdd": [
      "项目的全称, 整个项目禁止自动添加头部注释, 可以使用快捷键添加"
    ],
    "moveCursor": true,
    "dateFormat": "YYYY-MM-DD HH:mm:ss", // moment.js的format方法的参数
    "atSymbol": [
      "@",
      "@"
    ],
    "atSymbolObj": {
      "文件后缀": [
        "头部注释@符号",
        "函数注释@符号"
      ]
    },
    "colon": [
      ": ",
      ": "
    ],
    "colonObj": {
      "文件后缀": [
        "头部注释冒号",
        "函数注释冒号"
      ]
    },
    "filePathColon": "路径分隔符替换",
    "showErrorMessage": false,
    "writeLog": false,
    "wideSame": true, // // 设置为true开启等宽设置
    "wideNum": 13, // 头部注释等宽设置wideSame
    "functionWideNum": 0, // 函数注释等宽设置:0 默认关闭 设置一个正整数即可开启 比如12
    "CheckFileChange": false,
    "createHeader": true, // 新建文件自动添加头部注释
    "useWorker": false,
    "designAddHead": false,
    "headDesignName": "random",
    "headDesign": false,
    "cursorModeInternalAll": {},
    "openFunctionParamsCheck": true, // 函数注释自动提取函数的参数
    "functionParamsShape": [
      "{",
      "}"
    ],
    "functionBlankSpaceAll": {},
    "functionTypeSymbol": "*",
    "typeParamOrder": "type param", // 参数类型 和 参数的位置自定义
    "customHasHeadEnd": {},
    "throttleTime": 60000
  },
  // 在光标处插入函数注释
  "fileheader.cursorMode": {
    "func": "",
    "description": "",
    "param": "Do not edit",
    "return": "Do not edit",
    "example": "",
  },
  // 头部注释
  "fileheader.customMade": {
    "Author": "JK",
    "Date": "Do not edit",
    "LastEditors": "JK",
    "LastEditTime": "Do not edit",
    "FilePath": "no item name",  // 去掉项目名称,  only file name可以去掉路径,只展示文件名
    "Description": "",
    "custom_string_obkoro1_copyright": "Copyright ${now_year} OBKoro1, All Rights Reserved. ", // 版权声明 保留所有权利 自动替换年份
    "custom_string_obkoro1_date": "Do not edit", // 版权时间
  },
  // koro1FileHeader end
  // ……
}

JavaScript的相关规范注释