Format the Code with the Sublime Text 3 HTML-CSS-JS Prettify plugin, sublimetext3 formatting

Format the Code with the Sublime Text 3 HTML-CSS-JS Prettify plugin, sublimetext3 formatting

Many times, we want to format HTML-CSS-JS code, there are a lot of gadgets on the site to achieve this function, of course, my site home also has. However, if the code editor has such a function, isn't it faster and more convenient? So, next, let's take a look at how Sublime Text 3 uses the plug-in to implement this function!

I. Necessary conditions:

1. First, you must have the Sublime Text 3 editor;
2. You need to configure the NodeJS environment locally (for the installation method, refer to: Node. js learning notes );
3, your Sublime Text 3 editor to install the HTML-CSS-JS Prettify plug-in (installation method can refer to: Sublime commonly used plug-in summary ).

 

Ii. Installation Process:

1. Open the Sublime Text 3 editor and install the HTML-CSS-JS Prettify plug-in.

A) In Sublime Text 3, press Ctrl + Shift + P to bring up the Command Panel;
B) enter install to bring up the Install Package option and press Enter;
C) Enter pretty and select HTML-CSS-JS pretplugin in the list and press enter to install.

 

2. view the locally installed NodeJS configuration environment path (under the doscommand, enter where node and press Enter ).

 

 

3. In any html/js/css file in the editor, right-click the file, as shown in, and select Set Plugin Options.

 

 

4. Save the local NodeJS path in step 2 to the file opened in step 3, as shown in.

 

 

5. The HTML-CSS-JS pretplugin is successfully installed.

3. Make a DEMO:

1. The original HTML template is messy.

 

 

2. Right-click and select pretverification Code.

 

 

3. format the result.