Introduction: a different north drift programmer, welcome to add wechat criticism and correction of communication technology or play together about dinner

Prologue:Everything starts somewhere

Vscode Extension: Fe-file-Rename (available in the plugin store) Git repository: github.com/CodingCommu…

Note: Code quality do not spray! Not a real level! Manual dog head! This article style mutation, similar to essay, full of flocculent and in two breath, do not like spray

Development Background:[How will the story play out because of this]

It’s a long, long story of how this plugin came to be. Because our project has a long history, has experienced many staff changes, and there was no uniform document naming convention, so it can be said that a hundred flowers bloom in the document naming. Big hump/little hump/connecting line/underline all of the above names appear in our warehouse. However, we want to standardize it for a number of reasons, and we use connectline naming, why we use that naming convention, which I’ll talk about later. But changing the name of this file is actually a very unpleasant process. Here is a brief overview of how this might happen:

  1. First, open the project and watch carefully to see if any files are named incorrectly
  2. To rename an irregular file, change tocablenomenclature
  3. Modify references, variousimport.require.
  4. Check whether it works properly and whether there are missed or incorrect file references

Take a look at the process above, and you actually find the following pain points:

  • File name check is a visual inspection process, there may be missing changes
  • The modification reference may be omitted or incorrectly corrected and needs to be run to verify that the modification is correct.

Therefore, as an engineer in the Internet industry, we need to make ourselves more lazy and comfortable, so making the modification process more automatic and comfortable without verification has become my main goal in the development of VSCode plug-in this time.

Plug-in introduction:[It starts at the pain point and stops at the pain point]

Ok, in fact, the previous development background has listed some functions of the plug-in, namely:

  • Check the name of the file for the front-end project
  • Rename files in batches according to rules and automatically modify references

But solving pain points was not my goal. At the beginning of development, I had the following new goals:

  • Is not limited tocableNomenclature, to supportBig hump/Small hump/cable/The underlineConvert to each other and supportdirectoryandfileThere are different rules
  • It is not limited to changing file names in batches according to specified rules, but also supports monitoring of file path changes and automatic modification of references.

So here’s a summary of the functionality (also see git repository readMe above) :

  • Check front-end directory specification
  • Configure the file name verification rule:Big hump/Small hump/cable/The underline.directoryandfileRules can be inconsistent
  • Rename files and modify references according to rules: File selection is supported, and the optional range is a subset of noncanonical files.
  • You can detect file path changes and automatically modify references: used to automatically modify references when files are renamed or moved (Provides a switch to turn off automatic reference modification)

Operation process:From requirement logic to interactive realization, tangible is born invisible

This is from the readME for this project

Step 1: Initialize the front-end directory Let’s right-click a file in the current workspace and click “Initialize the front-end directory”.

The second step: Batch modify non-compliant file name && File path change automatically modify reference



The functions of the above four buttons are:

  1. Refresh file tree: Manually update the file tree shown here [even if not manually updated, the file tree here will automatically watch file changes to update]
  2. Enable or disable automatic reference modification:Off by default, file path changes automatically update reference,Change the path of a file or folder one at a time, otherwise do not change the reference~

Tip: File path change: When a file is renamed, the file location changes

  1. Switch the verification rules for naming folders and files:Big hump / Small hump / A hyphen / The underline

Tip: Folders and files can have different rules

  1. Modify the file name and reference in batches according to the rules: You can select files to be modified and modify them in batches

Note:[In the shadow of the lee wind of the Crazy Mountains, you must control your imagination.]

Case problem Here recommend lowercase filenames, can go to see nguyen piece “why the file name to lower case,” the article www.ruanyifeng.com/blog/2017/0… In summary, it’s for portability, ease of use, readability, and convenience, note that git does not recognize simple case changes by default

Git config –get core.ignorecase

About ignored items in batch operations

  • ignorepublic.dist.node_modules.docs.testfolder
  • Ignore folders with ‘.’, which are configuration class special folders by default
  • ignorejson.yaml.md.npmrc.lock.log.yarnrc.localfile
  • Ignore files with two ‘.’, which are either configuration files or special files by default
  • Before and after file ‘‘Keep, because it is assumed that before and after the file is’‘indicates a special meaning, such as:_dir_._file_.ts

In the chapter:[Story reaches climax as teenager tries to slay dragon]

This chapter briefly introduces VSCode plug-in development, specific information please refer to the official website, after all, too many, and many API I did not use ~

VSCode plug-in quick start:[If you want to find a weapon, you will drop a sword]

The official document: code.visualstudio.com/api scaffolding installation vscode plugin development

npm install -g yo generator-code
Copy the code

The inputyo codeInitialization code

Tip: I put the introductory information in the text of the picture

package.json

Project entry

Note the relationship between the command and the configuration in package.json

Debug Press F5 to start debugging

Release extended release more troublesome, suggestion: according to the official documentation steps code.visualstudio.com/api/working…

Originally wanted to write a lot of development experience here, but feel and do not know how to start, in fact, this plug-in intermittently developed for a week, the middle of many pits. Whether designing the plug-in, looking for the API I wanted in the official document, or pr the package that modified the front-end project reference, I helped improve the function and fix the bug. So I’m just making an introduction to the development here, and may update vsCode plug-in development experiences later haha. But the rest of this article is also fascinating.

Final chapter:When a story ends, a new chapter begins.

About recent life:When the wind blows, I always want to do something.

I haven’t been writing articles lately, because I am really busy with work and I have more and more things to do. I just started my new job, so I’m like a duck, huh? No, why a duck! HHH just wants to go to a lot of places to play, like my previous article, I, 24 years old, look ahead? So, I have a lot of places I want to go, I also want to go as soon as possible, to see the scenery has not seen, to do some things have not done.

Walk through – Southeast Northwest:Life stop-and-go, a lot of scenery

My first time to see Mahua Happy First time making a Lego (small one, yes, must have been poverty) The first time I saw the desert, it was like a golden sea The first time I saw the sea, it was like a blue desert Visit Harbin for the first time and overlook the entire Ice City (Dragon Tower) There are many, many completely say not to come over ah ~

去Hohhot,I had my first Mongolian meal

去HarbinI had my first Russian meal

去The states of the luanhe river ancient cityWatch the night scenes (and eat bad food)

First time in my lifeThe cherry blossom

.

Looking back, I feel that a lot has happened in the last month or two, and I have done a lot of things, not only tian Tian and HeThe service side.productBattle, and some some of my life.

Done – CodingCommunism:[The road ahead is unknown, TODO is a pile]

A few of our friends set up a Github group a few days ago to turn some of our work ideas into reality: github.com/CodingCommu…

I wrote in this description: “Just do creative things”, which is also for myself. I want to do some creative things. Although it may be too thin to say this now, one day I can turn it into reality.

I would also like to thank the partners in my work, includingDay withThe front end leader’s approval.

Tip: there are now three project repositories, including this vscode plug-in.

Conclusion:[Junior middle Two, always want to say something]

I know that life is not like novels, cartoons and movies, there is always less romance and passion. Although I am not qualified yet, I hope one day I can say:

I come, I see, I conquer, I love, I pursue, I live, I create

I wish I was the middle two boys

May life be colorful

.

This article is a bit wayward

nonsense

Thank you for reading