Shulou(Shulou.com)06/02 Report--

Editor to share with you some commonly used atom plug-ins, I hope you will learn something after reading this article, let's discuss it together!

For the use of atom, is also an accident, has been using sublime, for some of the quick use of sublime is also more familiar with, for a different company, companies are using atom, do as the Romans do, also change to play atom.

Found that atom is still very good, very similar to sublime, a lot of package are very complete, some specific introduction, you can take a look at it yourself.

Now let's talk about some common plug-ins:

Tip: sometimes the installation fails, so think differently:

1. Find C:/Users/ in your username / .atom / packages/ folder

two。 Use gitbash in the .atom packages directory

3.git clone xxxxx/atom-beautify.git (address of the plug-in on github)

3.cd. Atom-beautify (enter the directory of the downloaded plug-in)

4.npm install

5. Done (don't forget to restart atom)

Before introducing the plug-in, let's talk about the location where the plug-in is installed: Packages > Settings View > Install Packages/Themes

1.Sync Settings

With github, synchronize your atom plug-in information and configuration information, so that you can easily realize the configuration of one computer and share it among multiple computers.

2.Emmet

Can generate HTML based on Emmet syntax, and those who have done the previous development will know about this plug-in. It's good to cry.

3.Atom Beautify

Code formatting tool, you can set automatic formatting when saving, not to mention how convenient it is. Support for html,css,javascript,java,go and so on, but most common languages support it anyway.

Configuration:

Choose the language you want to configure. I chose vue.

4.Autocomplete Paths

Automatically complete the file path, this function must be used, completely avoid path input errors caused by the bug.

5.Auto close HTML

Automatically enter the corresponding HTML close tag, although simple but practical.

6.Minimap

There is no need to introduce this plug-in. It has been in use since sublime. Never forgotten.

7.color-picker

The color picker allows you to open the color palette directly and pick up the color when you write the code.

8.vim-mode

Vim loyal fans must-have plug-ins.

9.git-plus

Let you easily manage your git project in the editor, a variety of common git functions, easy to come by.

10.file-icons

It is very simple to add a beautiful little icon for different types of files, which is a must for face control developers.

11.docblockr

Documented comments, you know, essential plug-ins for team collaboration specification annotations.

12.Linter Jshint

To help you write professional js code, js developers must have plug-ins.

It is recommended to install these, and others according to personal needs.

All installed, react development, code highlighting is no problem, there is a picture as proof

But vue, try it, all gray, without a trace of miscellaneous color, tears streaming down his face, trying to solve the problem.

Installation

Installation is complete, perfect, look at the code, tears again, only the label is highlighted, syntax, or gray

This is not what I want. What I want is the grammar to be highlighted.

Go ahead and highlight the vue syntax

1. Choice

File "user keyboard mapping" keymap.cson file (File "KeyMap... > keymap.cson)

two。 Add at the end of the file (Note: if there are already other configurations of 'atom-text-editor [data-grammar~= "vue"]: not ([mini]): in the configuration file, add' tab': 'emmet:expand-abbreviation-with-tab', directly below the other configurations instead of the following two lines, otherwise an error will be reported)

'atom-text-editor [data-grammar~= "vue"]: not ([mini])':

'tab': 'emmet:expand-abbreviation-with-tab'

As shown in the figure:

Re-exit atom, start again, and the effect we want is basically the same as sublime.

Finally, for students who are not good at English, if you want a Chinese version, use the plugin shown below:

After reading this article, I believe you have a certain understanding of "sharing some common plug-ins in atom". If you want to know more about it, you are welcome to follow the industry information channel. Thank you for reading!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.