How to install plugins for sublime text 3. Plugins, their installation and configuration for Sublime Text

Sublime Text- this is modern text editor with closed source code. It is most often used by web developers to html editing or php code. The editor has a beautiful, modern appearance and several interesting features, such as quick navigation, simultaneous editing and command entry.

Although the program comes out of the box with many features that will greatly help your work, there is always room for improvement. Among other things, it supports plugins written in Python. In this article you will find the best Sublime Text 3 plugins. They are also suitable for the free alternative to this program, Lime Text. With these plugins you can greatly expand the capabilities of the program. Now let's move on to the list.

This is probably the first plugin you need to install after installing and running the program. This package manager for Sublime Text, with it you can install, remove and update plugin packages. You can also very easily view everything installed plugins Sublime Text 3.

2. Emmet

The Emmet plugin is not only available for Sublime. This is a pretty popular thing. It allows you to write css and html code much faster using abbreviations and shortcuts, which are then expanded into full-fledged html tags. For example:

((h4>a)+p>img)*12

This will create 12 header elements, each followed by an image. Then you can simply fill out the resulting template, without having to type tags one by one.

This is a plugin for checking errors in your code. It has been recently redesigned and now includes several new features. It doesn't support all programming languages, it just creates an API, then you can install plugins for the languages ​​you use most.

4. SublimeEnhancements

This Sublime Text 3 plugin improves sidebar editor. Adds the ability to create new files in current folder project, moving and copying files and folders, searching, updating and much more.

With the PackageResourceViewer plugin you can view and edit the packages that you install in Sublime Text 3. It is possible to extract the package into separate folder, correct what needs to be there and return it to the program.

6. Git

This plugin integrates the Sublime Text 3 editor with Git. You can interact with Git directly from the editor, such as adding files, sending commits, viewing logs and file annotations.

This plugin adds the ability to open a terminal in your project folder directly from Sublime Text using hotkey. This is very useful if you need to run any commands in this folder.

CSSComb is a plugin for sorting CSS properties. If you want your code to look neat and be located in in the right order, this plugin will help you customize the order of properties. This is also useful when you work in a team of developers, each of whom has their own coding preferences.

With this plugin you can check whether your browser supports the CSS or HTML properties of the elements you are using. To do this, simply select CSS property or HTML element, you will then be redirected to the appropriate caniuse.com page.

The Alignment plugin allows you to align code, including PHP, JavaScript and CSS. This makes it neater and easier to read. You can see an example in this screenshot:

With this plugin, you can remove unnecessary spaces as well as extra trailing spaces that can cause JavaScript errors.

With this plugin you can select and add any color of yours to Sublime Text 3 operating system just by clicking on it with the mouse. You can also choose a color from the color wheel.

13.MarkDown Editing

Although Sublime Text 3 allows you to view and edit files from MarkDown markup, he opens them as usual text files with very bad formatting. This plugin will help improve formatting and add text color to files written using Markdown.

14. FileDiffs

The FileDiffs plugin allows you to analyze the differences between two files in Sublime Text 3. You can compare files not only with each other, but also with the system clipboard, as well as unsaved and saved versions of the same file.

DocBlockr allows you to create documentation or annotations for code by analyzing functions, parameters, variables, and automatic adding already available documentation.

16. Third Party Themes

Looking the same every day gets boring over time. New topic may even give you new ideas for work. You can try several interesting topics, For example:

The right set of plugins can improve performance in any application. If you are a web developer working with Sublime Text 3 Package Ccontrol, we strongly recommend that you carefully read the plugins discussed in this article:

• Package Control ;
• HTMLPretify ;
• Emmet ;
• Bracket Highlighter ;
• jQuery ;
• Case Conversion.

Package Control

This plugin makes it easy to find, install and update other packages. It needs to be installed first. This will make it easier to work with all other plugins.

How to install

1. Follow this link https://packagecontrol.io/installation and copy the command, which will look something like this:

1. Press Ctrl - backtick (; `) to open the Sublime Text Console:

1. Paste the command and press Enter.

1. After running the command, you will see a small pop-up warning:

1. Click "OK".
2. Close and restart Sublime Text.
3. Enter the Package Control command to see all commands:

We will use Package Control Sublime Text for the remaining plugins.

HTMLPrettify

Accepts long lines HTML, CSS, JavaScript, and JSON and formats them so you can read them instead of trying to make sense of a bunch of typing.

How to install

1. Press Ctrl-Shift-P in Windows to open the "Command Panel".
2. Enter the Package Control command to see all commands. Select Package Control: Install Package. A menu of available plugins will appear on the screen:

1. Enter HTMLPrettify:

1. Click on HTML-CSS-JS Prettify. This name is slightly different, but it is the same plugin.

Emmet

This plugin used to be called Zen Coding. It allows you to write abbreviations HTML codes and CSS. For example, by typing the following:

#page>div.logo+ul#navigation>li*5>a(Item $)

And pressing tab key, You'll get:

After installing Emmet using Sublime Text Package Control, restart Sublime Text.

For Emmet to work, you need to set the syntax for the document. Otherwise it won't work:

Now check. Enter the following:

nav#menuSystem.navMenu.isOpen>div#hotelLogo>div.navMenuIcon.logoIcon+div#arrowPointer+ul#navMenuMain>li.navMenuItem.navMenuItem$$$*2>div.navMenuIcon(Item $)+a(Item $)

And press tab. You'll get:

It will take a lot of time to learn all the available abbreviations. This will allow you to write HTML code much faster.

BracketHighlighter

The plugin highlights brackets and tags. After installation using Sublime Text Package Control install You can click anywhere in the JavaScript or HTML code and see the opening and closing parentheses in the left column:

JQuery

The jQuery plugin highlights the correct jQuery method syntax and provides code snippets to complete it:

Case Conversion

Allows you to switch between snake_case , camelCase , PascalCase , etc. After installing the plugin using Package Control (type " pic" for quick access to Install Package), try:

Before: navMenu

Press: ;;c, then;;c

After: nav_menu

Note that this will not work properly if you try to convert an entire string.

Before: