Table of Contents
Installation and use
How to get it
The format of the date in the comment. Please refer to: https://momentjs.com/docs/#/displaying/format
How is it implemented?
Uses ES6’s
These languages ​​are currently supported
Home Development Tools VSCode Share a useful VSCode header annotation plug-in: Fileheader Pro

Share a useful VSCode header annotation plug-in: Fileheader Pro

Jul 13, 2022 pm 08:22 PM
vscode Header annotation plugin

How to quickly make header comments in

VSCode? The following article will share with you a useful VSCode header annotation plug-in: Fileheader Pro. Will you like the Fileheader plug-in that is ready to use out of the box and can be fully customized? All in all, it’s pretty easy to use. Just leave it to it to add header comments!

Share a useful VSCode header annotation plug-in: Fileheader Pro

[Recommended study: "vscode introductory tutorial"]

Sometimes you need to add a comment like this at the head of the code . This comment includes information such as the author, code copyright license, etc. Each repeated addition will be very troublesome for you. As a developer, your time is of course very important. Then this plug-in is born for this scene, and it can do it for you silently and without feeling. If you want to add some ASCII Art at the head of your code like this. It can suit your needs too.

/*
 * @Author: IronLu233
 * @Date: 2021-03-10 12:00:00
 * Copyright © 你的公司名字. All rights reserved.
 */
Copy after login
/*
#### ########   #######  ##    ## ##       ##     ##  #######   #######   #######  
 ##  ##     ## ##     ## ###   ## ##       ##     ## ##     ## ##     ## ##     ## 
 ##  ##     ## ##     ## ####  ## ##       ##     ##        ##        ##        ## 
 ##  ########  ##     ## ## ## ## ##       ##     ##  #######   #######   #######  
 ##  ##   ##   ##     ## ##  #### ##       ##     ## ##               ##        ## 
 ##  ##    ##  ##     ## ##   ### ##       ##     ## ##        ##     ## ##     ## 
#### ##     ##  #######  ##    ## ########  #######  #########  #######   #######  

 * @author        IronLu233 <lrironsora@gmail.com>
 * @date          2022-06-12 22:33:53
 */
Copy after login

This code comes from here:

https://github.com/IronLu233/fileheader-pro/blob/main/src/Extension.ts

Installation and use

How to get it

to let it silently add header comments

The information in the file comments comes from your version control tool, currently The plug-in only supports Git, and in the future it will support other version control tools such as SVN and Mercurial. So please make sure to use it in projects with Git.

After installation, the default template will be able to combine most usage scenarios.

When you create a new file, Fileheader will be automatically added for you. Therefore, in most cases you do not need to manually add

Share a useful VSCode header annotation plug-in: Fileheader Pro

If you need to manually add to existing code, open a file and go to your command panel [ You can use Ctrl (Command under Mac) Shift P], enter

Fileheader Pro: Add Fileheader and press Enter, and you will see that the file comments are properly added to the head of your ingenious code.

Share a useful VSCode header annotation plug-in: Fileheader Pro

#When saving, if your file header comments need to be updated, Fileheader Pro will automatically update them for you.

Share a useful VSCode header annotation plug-in: Fileheader Pro

Custom template

Although the built-in template can meet most scenarios. However, the power and integration capabilities of custom templates make it worth configuring them specifically.

Share a useful VSCode header annotation plug-in: Fileheader Pro

Don’t forget to submit your template to git, and ask the students who develop with you to also install Fileheader Pro

First we need to create a template. In your VSCode command panel, execute this command:

Fileheader Pro: Generate Custom Fileheader Template;

Share a useful VSCode header annotation plug-in: Fileheader Pro

At this time in the root directory of the project of

.vscode/fileheader.template.js. Please modify class CustomLanguageProvider. Especially its getTemplate method. Its return value determines the final appearance of your file header comment. Additionally, languages ​​will determine in which languages' files it can be used.

Please be sure to use

tpl for all returned strings to call the template string function, otherwise some strange problems may occur

Share a useful VSCode header annotation plug-in: Fileheader Pro

You can use each field in the variable to process it and put it into the template. The fields of variables include the following

##birthtimeThe time when the file was created , if it is tracked by the version control system then the creation time will be obtained from the version control system, otherwise the time when the file was created on disk mtimefile The time it was modified. The acquisition logic is the same as authorNameThe author name will be found in the version control tool history. If the file is new, it will use authorEmailThe author's email address, the fallback mechanism is the same as userNameThe user’s name. For git, userEmail user's email address. For git, companyNamecompany name. If you don’t have a company, you can go to the Industrial and Commercial Bureau to register itprojectNameThe name of the current project, which is the name of the folder opened by VSCodefilePathThe path of the current filedirPathThe directory path of the current filefileNameThe file name of the current file
Field Meaning
birthime, is not recommended to use mtime. Because when a file is modified by multiple people, their comments about mtime will cause conflicts when the code is merged!
userName
authorName
git config user.name will be used to obtain the
will be obtained. git config user.emailGet
Fileheader Pro source code itself uses a custom template to add header comments.

So it's also an example:

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

Configuration items

FileheaderPro.disableFileds

For the default template, each field in it can be disabled through it. Disabled fields will not appear in comments. You can modify it in the settings interface of VSCode

The default value is

['mtime']. It is not recommended to enable mtime. Because when a file is modified by multiple people, their comments about mtime will cause conflicts when the code is merged! Share a useful VSCode header annotation plug-in: Fileheader Pro

FileheaderPro.companyName

You need to tell the plugin the name of the company in the settings, as you can't get it from anywhere else !

FileheaderPro.currentUserName and FileheaderPro.currentUserEmail

These two fields can directly overwrite the

userName and userEmail## in the template. #Variables will also indirectly affect authorName and authorEmail (when the file is not tracked by the version control tool)

FileheaderPro.dateFormat

The format of the date in the comment. Please refer to: https://momentjs.com/docs/#/displaying/format

FileheaderPro.autoInsertOnCreateFile

Whether to enable automatically adding file headers when creating files Note. By default it is turned on

FileheaderPro.autoUpdateOnSave

Whether to update the fileheader when saving. Enabled by default.

Fileheader Pro internally only updates file header comments when needed.

Q & A

How is it implemented?

Uses ES6’s

tagged template

.

We can know which ones are fixed strings and which ones are variables used by users. Next, please refer to this abstract class

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

without me Supported Languages

These languages ​​are currently supported

Javascript
  • Typescript
  • Python
  • HTML
  • CSS
  • Vue
  • Java Please use a custom template, or open an
  • issue
  • . Of course, you are also welcome to submit PR to contribute to Fileheader Pro
  • For more related knowledge about VSCode, please visit:
vscode tutorial

!

The above is the detailed content of Share a useful VSCode header annotation plug-in: Fileheader Pro. For more information, please follow other related articles on the PHP Chinese website!

Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn

Hot AI Tools

Undresser.AI Undress

Undresser.AI Undress

AI-powered app for creating realistic nude photos

AI Clothes Remover

AI Clothes Remover

Online AI tool for removing clothes from photos.

Undress AI Tool

Undress AI Tool

Undress images for free

Clothoff.io

Clothoff.io

AI clothes remover

AI Hentai Generator

AI Hentai Generator

Generate AI Hentai for free.

Hot Article

R.E.P.O. Energy Crystals Explained and What They Do (Yellow Crystal)
2 weeks ago By 尊渡假赌尊渡假赌尊渡假赌
Repo: How To Revive Teammates
1 months ago By 尊渡假赌尊渡假赌尊渡假赌
Hello Kitty Island Adventure: How To Get Giant Seeds
4 weeks ago By 尊渡假赌尊渡假赌尊渡假赌

Hot Tools

Notepad++7.3.1

Notepad++7.3.1

Easy-to-use and free code editor

SublimeText3 Chinese version

SublimeText3 Chinese version

Chinese version, very easy to use

Zend Studio 13.0.1

Zend Studio 13.0.1

Powerful PHP integrated development environment

Dreamweaver CS6

Dreamweaver CS6

Visual web development tools

SublimeText3 Mac version

SublimeText3 Mac version

God-level code editing software (SublimeText3)

How to view word documents in vscode How to view word documents in vscode How to view word documents in vscode How to view word documents in vscode May 09, 2024 am 09:37 AM

First, open the vscode software on the computer, click the [Extension] icon on the left, as shown in ① in the figure. Then, enter [officeviewer] in the search box of the extension interface, as shown in ② in the figure. Then, from the search Select [officeviewer] to install in the results, as shown in ③ in the figure. Finally, open the file, such as docx, pdf, etc., as shown below

How to draw a flow chart with vscode_How to draw a flow chart with visual_studio code How to draw a flow chart with vscode_How to draw a flow chart with visual_studio code Apr 23, 2024 pm 02:13 PM

First, open visual studio code on the computer, click the four square buttons on the left, then enter draw.io in the search box to query the plug-in, click Install. After installation, create a new test.drawio file, then select the test.drawio file, enter the editing mode on the left There are various graphics on the side. You can draw the flow chart by selecting at will. After drawing, click File → Embed → svg and then select Embed. Copy the svg code. Paste the copied svg code into the html code. Open the html web page and you can see it. Click on the picture on the web page to jump to the flow chart. On this page, you can zoom in and out of the flow chart. Here, we choose to click on the pencil pattern in the lower right corner to jump to the web page.

How to write Maude in Vscode_How to write Maude in Vscode How to write Maude in Vscode_How to write Maude in Vscode Apr 23, 2024 am 10:25 AM

First, you can search for the Maude plug-in in the vscode plug-in manager. Then, create a new file with the extension maude to use maude's code snippets and syntax highlighting. Terminal -> New Terminal can open the vscode built-in terminal in the current folder to run the maude or full-maude program. In maude's official tutorial, there are also examples of http clients, which can be called and run as shown in the figure. If you want to associate files with the fm extension, open settings, search for fileassociations in user settings, and open settings.json. Just add an entry to the file association, that is, the entry from *.fm to maude. But full

Caltech Chinese use AI to subvert mathematical proofs! Speed ​​up 5 times shocked Tao Zhexuan, 80% of mathematical steps are fully automated Caltech Chinese use AI to subvert mathematical proofs! Speed ​​up 5 times shocked Tao Zhexuan, 80% of mathematical steps are fully automated Apr 23, 2024 pm 03:01 PM

LeanCopilot, this formal mathematics tool that has been praised by many mathematicians such as Terence Tao, has evolved again? Just now, Caltech professor Anima Anandkumar announced that the team released an expanded version of the LeanCopilot paper and updated the code base. Image paper address: https://arxiv.org/pdf/2404.12534.pdf The latest experiments show that this Copilot tool can automate more than 80% of the mathematical proof steps! This record is 2.3 times better than the previous baseline aesop. And, as before, it's open source under the MIT license. In the picture, he is Song Peiyang, a Chinese boy. He is

How to enable background updates in vscode How to enable background updates in vscode How to enable background updates in vscode How to enable background updates in vscode May 09, 2024 am 09:52 AM

1. First, after opening the interface, click the file menu in the upper left corner. 2. Then, click the settings button in the preferences column. 3. Then, in the settings page that jumps, find the update section. 4. Finally, click the mouse to check and enable it. Download and install the new VSCode version button in the background on Windows and restart the program.

How to add files to vscode workspace How to add files to vscode workspace How to add files to vscode workspace How to add files to vscode workspace May 09, 2024 am 09:43 AM

1. First, open the vscode software, click the explorer icon, and find the workspace window 2. Then, click the file menu in the upper left corner and find the add folder to workspace option 3. Finally, find the folder location in the local disk , click the add button

How to disable wsl configuration file in vscode How to disable wsl configuration file in vscode How to disable wsl configuration file in vscode How to disable wsl configuration file in vscode May 09, 2024 am 10:30 AM

1. First, open the settings option in the settings menu. 2. Then, find the terminal column in the commonly used page. 3. Finally, uncheck the usewslprofiles button on the right side of the column.

How to set animation smooth insertion in VScode VScode tutorial to set animation smooth insertion How to set animation smooth insertion in VScode VScode tutorial to set animation smooth insertion May 09, 2024 am 09:49 AM

1. First, after opening the interface, click the workspace interface 2. Then, in the open editing panel, click the File menu 3. Then, click the Settings button under the Preferences column 4. Finally, click the mouse to check the CursorSmoothCaretAnimation button and save Just set it

See all articles