vs code插件koroFileHeader (代码注释插件)

最新推荐文章于 2024-08-09 08:11:26 发布

造梦者FZ

最新推荐文章于 2024-08-09 08:11:26 发布

阅读量833

点赞数

分类专栏： vue 文章标签： typescript html html5 vue.js visual studio code

本文链接：https://blog.csdn.net/qq_43923146/article/details/116519390

版权

vue 专栏收录该内容

80 篇文章 5 订阅

订阅专栏

vs code插件koroFileHeader (代码注释插件)

1、头部注释
使用vs code插件koroFileHeader ，在设置中配置如下：
在这里插入图片描述

{
    "editor.renderIndentGuides": false,
    "editor.fontSize": 18,
    "editor.tabSize": 2,
    "explorer.compactFolders": false,
    "fileheader.configObj": {


        "createFileTime": true,
        "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",
        "atSymbol": [
            "@",
            "@"
        ],
        "atSymbolObj": {
            "文件后缀": [
                "头部注释@符号",
                "函数注释@符号"
            ]
        },
        "colon": [
            ": ",
            ": "
        ],
        "colonObj": {
            "文件后缀": [
                "头部注释冒号",
                "函数注释冒号"
            ]
        },
        "filePathColon": "路径分隔符替换",
        "showErrorMessage": false,
        "writeLog": false,
        "wideSame": false,
        "wideNum": 13,
        "functionWideNum": 0,
        "CheckFileChange": false,
        "createHeader": true,
        "useWorker": false,
        "designAddHead": false,
        "headDesignName": "random",
        "headDesign": false,
        "cursorModeInternal": false,
        "openFunctionParamsCheck": true,
        "functionParamsShape": "normal"
    },
    // 头部注释内容
    "fileheader.customMade": {
        "Author":"fz", // 创建者
        "LastEditors":"fz", // 最后一次修改者
        "description": "page description", // 此VUE页面描述 描述页面作用
        "Date": "", // 创建时间
        "LastEditTime": "" // 最后一次修改时间
    },
    // 方法注释内容
    "fileheader.cursorMode": {
        "description": "",
        "param": "",
        "return": ""
    }
}

效果如下：
使用快捷键ctrl + Alt + i

<!--
 * @Author: fz //创建者
 * @LastEditors: fz // 最后一次修改者
 * @description: layout菜单 // 此vue文件描述，描述页面作用
 * @Date: 2020-02-14 14:38:31 // 创建时间
 * @LastEditTime: 2020-02-26 10:44:17 // 最后一次修改时间
 -->

2、变量、函数注释
使用快捷键ctrl + Alt + t

<script lang="ts">
  import { Component, Prop, Vue } from 'vue-property-decorator'
  @Component({name: 'SideBar'})
  export default class extends Vue {
	 	// 用户信息
  	public userInfo:any = {}
  	// 菜单列表
  	public menuList: Array<any> = []
  
    /**
     * @description: 获取菜单列表
     * @param {routes}
     * @return: routes数组 或 []
     */
    get routes() {
      return PermissionModule.routes
    }
  
   /**
   * @description: 切换sideBar状态
   * @param {statu: sideBar状态}
   * @return: 
   */
  	public toggleSideBar(statu: boolean){
    	....
    }
 }
</script>