好用的VSCode头部注释插件Fileheader Pro

目录
  • 动机
  • 安装与使用
    • 如何获得它
    • 让它默默添加头部注释
      • 自定义模板
    • 配置项
      • FileheaderPro.disableFileds
      • FileheaderPro.companyName
      • FileheaderPro.currentUserName和FileheaderPro.currentUserEmail
      • FileheaderPro.dateFormat
      • FileheaderPro.autoInsertOnCreateFile
      • FileheaderPro.autoUpdateOnSave
      • 它是怎么实现的?
      • 没有我支持的语言
  • Q & A

动机

有时候需要在代码头部添加像这样的一段注释。这段注释包括了作者、代码版权许可等信息。每次重复添加都会让您觉得非常麻烦。作为开发者的您,时间是自然非常。那么这个插件,就是为这个场景而生,替你无感地默默做完这件事。如果您想要在代码头部添加一些类似这样的ASCII Art。它也能满足您的需求。

/*
 * @Author: IronLu233
 * @Date: 2021-03-10 12:00:00
 * Copyright  你的公司名字. All rights reserved.
 */
/*
#### ########   #######  ##    ## ##       ##     ##  #######   #######   #######
 ##  ##     ## ##     ## ###   ## ##       ##     ## ##     ## ##     ## ##     ##
 ##  ##     ## ##     ## ####  ## ##       ##     ##        ##        ##        ##
 ##  ########  ##     ## ## ## ## ##       ##     ##  #######   #######   #######
 ##  ##   ##   ##     ## ##  #### ##       ##     ## ##               ##        ##
 ##  ##    ##  ##     ## ##   ### ##       ##     ## ##        ##     ## ##     ##
#### ##     ##  #######  ##    ## ########  #######  #########  #######   #######
 * @author        IronLu233 <lrironsora@gmail.com>
 * @date          2022-06-12 22:33:53
 */

这段代码来自这里

安装与使用

如何获得它

让它默默添加头部注释

文件注释中的信息来自于您的版本控制工具,目前插件还只支持Git,再未来它将支持SVN,Mercurial等其它版本控制工具。 因此请您确保在有Git的项目中使用它。

安装后,默认的模板将能复合大部分的使用场景。

当你新建一个文件后,将会自动地为你添加Fileheader。因此大部分情况下您不需要下文中的手动添加

如您需要手动添加到已有代码,打开一个文件后,在您的命令面板里【您可以使用Ctrl(Mac下是Command) + Shift + P】,输入 Fileheader Pro: Add Fileheader并按下回车,就能见到文件注释恰如其分地加入到了您巧夺天工的代码头部。

保存时,您的文件头部注释需要更新时,Fileheader Pro将会自动为您更新。

自定义模板

尽管自带的模板能满足大部分场景。但自定义模板的强大与整活能力,也值得为它去专门配置。

别忘了将你的模板提交到git上,并且让与你一起开发的同学也安装Fileheader Pro

首先我们需要创建一个模板。在您VSCode的命令面板中,执行这样的命令: Fileheader Pro: Generate Custom Fileheader Template;

此时在项目的根目录下的.vscode/fileheader.template.js。 请修改类CustomLanguageProvider。特别是它的getTemplate方法。它的返回值,就决定了您的文件头部注释最后的模样。另外,languages将会决定,在那些语言的文件中它可以被使用。

请务必将所有返回的字符串使用tpl进行模板字符串函数的调用,否则可能会出现一些奇奇怪怪的问题

可以使用variable中的各个字段,对其进行加工处理,放入模板之中。 variables的字段有下列这些

字段 含义
birthtime 文件被创建的时间,如果它被版本控制系统所追踪那么会从版本控制系统中获取创建时间,否则将使用文件在磁盘中创建的时间
mtime 文件被修改时间。获取逻辑同birthime,不建议使用mtime。因为当一个文件被多个人修改时,他们关于mtime的注释,会在代码合并时造成冲突!
authorName 作者名字,会从版本控制工具历史中寻找,如果这个文件是新的,那么它将会使用userName
authorEmail 作者的电子邮箱,回退机制同authorName
userName 用户的名字。对于git来说,会通过git config user.name获取
userEmail 用户的电子邮箱,对于git会通过git config user.email获取
companyName 公司名称。没有公司的可以去工商局登记成立
projectName 当前项目的名称,也就是就是VSCode所打开的文件夹的名称
filePath 当前文件的路径
dirPath 当前文件的目录路径
fileName 当前文件的文件名

Fileheader Pro源代码本身就使用了自定义模板添加头部注释。

所以它也是一个例子

fileheader-pro/fileheader.template.js at main · IronLu233/fileheader-pro (github.com)

配置项

FileheaderPro.disableFileds

对于默认的模板,其中的各个字段都可以通过它来禁用。禁用的字段将不会出现在注释之中。 您可以在VSCode的设置界面中,对其进行修改

默认值是['mtime']。不建议启用mtime。因为当一个文件被多个人修改时,他们关于mtime的注释,会在代码合并时造成冲突!

FileheaderPro.companyName

您需要在设置中,告诉插件公司的名字,因为无法从任何其它地方得到它!

FileheaderPro.currentUserName和FileheaderPro.currentUserEmail

这两个字段可以直接覆盖掉模板中的userNameuserEmail变量,也会间接影响authorNameauthorEmail(当文件并未被版本控制工具追踪的时候)

FileheaderPro.dateFormat

注释中的日期的格式。请参考:momentjs.com/docs/#/disp…

FileheaderPro.autoInsertOnCreateFile

是否启用创建文件时,自动添加文件头部注释。默认它是开启的

FileheaderPro.autoUpdateOnSave

是否保存时更新fileheader。默认启用。

Fileheader Pro内部只在需要的时候更新文件头部注释。

Q & A

它是怎么实现的?

使用了ES6的tagged template

我们可以知道哪一些是固定的字符串,哪一些是用户所使用的变量。接下来请参考这个抽象类

fileheader-pro/FileheaderLanguageProvider.ts at main · IronLu233/fileheader-pro (github.com)

没有我支持的语言

目前支持这些语言

  • Javascript
  • Typescript
  • Python
  • HTML
  • CSS
  • Vue
  • Java 请使用自定义模板,或者发起一个issue。当然,也欢迎提PR来为Fileheader Pro添砖加瓦

以上就是好用的VSCode头部注释插件Fileheader Pro的详细内容,更多关于VSCode头部注释Fileheader Pro的资料请关注我们其它相关文章!

(0)

相关推荐

  • vscode内网访问服务器的方法

    目录 文章背景 1.插件 插件下载 插件安装 2.内网无网络安装ssh无法访问服务器 下载vscode-server-linux-x64.tar.gz 使用vscode-server-linux-x64.tar.gz 文章背景 公司内网需要看代码,用原装工具实在太难受了,于是可以在传入vscode插件 文章由一个ssh插件进行加撰写,如有错误还请谅解. 1.插件 插件下载 插件下载:https://marketplace.visualstudio.com/VSCode下载注意:版本问题很重要,不

  • VScode中集成Git命令详解

    目录 Git/GitHub/GitHub Desktop相关概念 1.Git 2.GitHub 3.GitHub Desktop 一.VScode中使用Git 1.Git的安装 2.本地创建存储库 二.git常用操作 1.暂存更改 2.提交暂存 3.创建分支 4.checkout签出 5.冲突合并 6.文件比较 三.连接远程代码仓库 1.Git 全局设置: 2.使用pull方法 3.使用clone方法 4.持久化账号 Git/GitHub/GitHub Desktop相关概念 1.Git Git

  • vscode配置go开发环境的实战过程

    目录 官网下载地址: 安装: 最终的安装效果: 这里简单介绍一下: 创建第一个Go程序: 安装Go的依赖包: 总结 笔者在网上找了很多关于VSCODE配置Go语言的教程,但是由于版本等种种问题,最终都已失败告终.无奈只能在官方文档上寻求帮助,现在终于可以了!!话不多说,咱们开始吧!! 下载安装包 网上有的教程采用的是数据包安装.msi,有的是采用的是解压包.这二者最终效果都是一样的,但是为了防止不必要的意外,你们还是和我保持一致吧. 官网下载地址: Downloads - The Go Prog

  • vscode远程免密登入Linux服务器的配置方法

    目录 一.Windows端操作 1. 生成私钥和公钥 2. 安装remote SSH插件 3. 配置config 二.Linux服务端操作 1. 将公钥文件内容追加到authorized_keys文件中 2. 修改权限 一.Windows端操作 1. 生成私钥和公钥 cmd终端输入: ssh-keygen -t rsa -b 4096 一直回车 2. 安装remote SSH插件 3. 配置config 打开vscode远程管理器进行免密登入配置,如下图例操作: 打开Configure 进入到公

  • VSCode创建Vue项目的完整步骤教程

    目录 一.配置环境 1.安装VS Code 2.安装node.js 3.安装配置脚手架vue-cli 二.创建vue项目 1.命令方式创建 2.重新初始化依赖 3.启动项目 补充:在VScode中如何使用vue代码 总结 一.配置环境 1.安装VS Code 官网下载 https://code.visualstudio.com/ 下载VS Code,按照步骤安装. 2.安装node.js (1)官网 https://nodejs.org/en/ 下载node.js,按照步骤安装即可,node.j

  • VSCode无法打开源文件及无法打开链接库文件的解决方法

    目录 一.无法打开源文件 二.无法打开文件“XXX.lib” 一.无法打开源文件 依次点击“项目——配置属性——C/C++——常规”,在“附加包含目录”中加入.h文件所在的文件夹路径 二.无法打开文件“XXX.lib” 1.依次点击“项目——配置属性——链接器——常规”,在“附加库目录”中加入.lib所在的文件夹的路径 2.方法①:在“链接器”中找到“输入”,在“附加依赖项”中加入需要加入的xxx.lib;(要用;和其他链接库分隔开) 方法②:也可以用代码的方式链接进来 #pragma comm

  • 好用的VSCode头部注释插件Fileheader Pro

    目录 动机 安装与使用 如何获得它 让它默默添加头部注释 自定义模板 配置项 FileheaderPro.disableFileds FileheaderPro.companyName FileheaderPro.currentUserName和FileheaderPro.currentUserEmail FileheaderPro.dateFormat FileheaderPro.autoInsertOnCreateFile FileheaderPro.autoUpdateOnSave 它是怎

  • VsCode插件自动生成注释插件koroFileHeader使用教程

    目录 VsCode插件自动生成注释插件koroFileHeader使用 PS:vscode使用‘koroFileHeader‘插件生成注释 插件安装 配置插件 插件使用 生成图案注释 VsCode插件自动生成注释插件koroFileHeader使用 强烈推荐的一款VsCode注释插件koroFileHeader,具体使用参考内容. 1.安装插件. 在VsCode里选择Extensions搜索koroFileheader进行安装. 2.根据需要修改默认注释配置,先选择File-Preference

  • VSCode中自动为Python文件添加头部注释

    在实际编写Python文件时,往往需要为文件添加相关说明,例如文件名称.文件作用.创建时间.作者信息.版本号等等.这些信息往往是固定模板的,因此希望有一种方式可以自动的为我们添加上这些信息.下面介绍一种在VS Code中自动为python文件添加头部注释的方法. 依次单击菜单栏 "File"-"Preferences"-"User Snippets",然后选择python后会生成python.json文件,将该文件内容替换为以下内容: { &qu

  • 使用VSCode 创建一个插件

    VSCode 创建一个插件,如何创建一个插件,VS Code 的插件既然是一个 Node.js 应用,那么官方自然也会提供了基于 NPM 的工具链来帮助你创建和维护插件. 首先你需要的是 yeoman,一个脚手架工具.通过 yeoman 你可以快速创建代码模板,如下所示: npm install -g yeoman 然后你需要安装 VS Code 的模板: npm install -g generator-code 有了脚手架,你就可以创建一个 VS Code 的插件模板了.接下来运行: yo

  • vscode使用editorconfig插件以及.editorconfig配置文件说明详解

    简介 EditorConfig和Prettier一样,都是用来配置格式化你的代码的,这个格式化代码,要和你lint配置相符!否则会出现你格式化代码以后,却不能通过你的代码校验工具的检验 EditorConfig 文件中的设置用于在基本代码库中维持一致的编码风格和设置,例如缩进样式.选项卡宽度.行尾字符以及编码等,而无需考虑使用的编辑器vscode使用editorconfig插件以及.editorconfig配置文件说明详解 或 IDE editorConfig不是什么软件,而是一个名称为.edi

  • vscode 使用Prettier插件格式化配置使用代码详解

    参考 使用ESLint+Prettier来统一前端代码风格 vscode 配置vue+vetur+eslint+prettier自动格式化功能 问题描述 最近用Nodejs + express 写了一个zip文件上传的功能,代码给了别人看,各种吐槽,代码不规范,没有按照eslint,编辑器打开就是各种红色提醒,当然还有其他许多- 第一反应就是反感,后面冷静一想,还是自己做事的态度有问题,做完了功能已经完成了95%,为什么不到最后一步一键格式化,做到百分百呢?反思中 为了让以后代码美观,不让别人吐

  • 解决vscode Better Comments插件在vue文件中不显示相对应的颜色的问题

    最近使用了Better Comments这款插件,发现在ts文件中可以显示对应的颜色,但在vue文件中并不显示对应颜色 解决方法如下: 1.打开插件的配置文件夹,即 c盘 -> 用户 -> 用户名 -> .vscode文件夹 2.extensions目录 -> bttter-comments配置文件夹 3.打开配置文件aaron-bond.better-comments-3.0.2 -> out -> parser.js 4.修改配置文件,添加如下代码 case &qu

  • 解决vscode中golang插件依赖安装失败问题

    vscode中安装ms-vscode.go插件后可以开启对go语言的支持,ms-vscode.go插件需要依赖一些工具,安装完成后提示 gocode go-outline go-symbols guru gorename gocode-gomod goreturns golint Installing github.com/ramya-rao-a/go-outline FAILED 由于网络原因,一些依赖工具无法正常安装,需要进行手动安装. 以下为手动安装的工具的步骤: 在%GOPATH%\sr

  • Vscode 打字特效插件Power Mode安装使用介绍

     壹 ❀ 引 我记得在17年使用atom编辑器的时候,使用过一款打字特效的插件,只要我们输入代码,代码上方就会有与代码颜色对应的星星效果,今天脑抽突然想起了这个中二插件,搜索了一番成功安装,大致效果如下,这里分享下设置:  贰 ❀ 安装 打开插件,输入Power Mode 点击搜索,安装第一个即可.  叁 ❀ 设置 打开用户设置----选择常用设置----点击 在settings.json中编辑 在末尾添加一行 "powermode.enabled": true 那么这样插件就启动了,

  • Vue项目vscode 安装eslint插件的方法(代码自动修复)

    ESlint:是用来统一JavaScript代码风格的工具,不包含css.html等. 方法和步骤: 通常情况下vue项目都会添加eslint组件,我们可以查看webpack的配置文件package.json查看,也可以查看工程下是否有.eslintrc.js和.eslintignore查看到eslint是否开启. 当我们编写不符合eslint规范的代码时,启动项目会报错,比如 这个时候可以安装vscode eslint插件,就可以自动检测不符合规范的代码.打开vscode左侧扩展面板,搜索es

随机推荐