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

This article mainly explains "what Sublime Text application skills are there in front-end development". The content in the article is simple and clear, and it is easy to learn and understand. Please follow the editor's train of thought to study and learn what Sublime Text application skills are available in front-end development.

1) Select

Here are some shortcuts for Sublime Text to select text:

Command + D pick a word

Command + L Select a row

Command + A Select all

Ctrl + Command + M` check everything in parentheses (very useful when writing CSS or JS)

Sublime Text also supports selecting multiple rows at a time: Furthermore, Sublime Text brings lets us select multiple lines at once, which can significantly boost your productivity. There are several ways to perform this feature:

Command hold down the Command key and then click on the row you want to select

Command + Ctrl + G (when partial text is selected) press this key to select all the same text

Command + D (when partial text is selected) directly selects the next occurrence of the text

2) CSS sorting

The order of the CSS attributes is generally unimportant, because browsers render correctly regardless of the order. But sorting all the attributes still helps to keep the code clean. In Sublime Text, you can sort alphabetically by selecting the CSS attribute and pressing F5.

You can also use third-party plug-ins such as CSSComb to control the sorting method in more detail.

3) Command panel (Command Palette)

Multitasking can be done quickly using the command panel. Press Command + Shift + P to bring up the panel and type the command you need. Take a look at the following examples:

▼ renames the file

▼ settings file is HTML syntax

▼ insert code snippet

4) switch between tabs and projects

When opening multiple tabs at the same time, you can toggle with the following hotkeys:

Command + T lists all tabs

Command + Shift +] next tab

Command + Shift + [previous label page

Command + Ctrl + P toggles the project displayed in the sidebar

5) spell check

If you often use Sublime Text for English writing, it is very useful to enable spell checking. Select the Preferences > Settings-User menu and add the following code:

"spell_check": true,6) Cross-file editing

The same editing can be repeated in multiple files at the same time. For example, when you have the same code in multiple files, you can quickly edit it using the following steps:

Press Command + Shift + F to enter the code to be found in the Find box. You can press Command + E to quickly use the code snippets in the selection.

Specify the range of files you want to find in the Where box, or fill in to find the currently open file.

Enter the code to be replaced in the Replace box and press the Replace button to replace in bulk.

7) File crawler

Press Command + R to list all the CSS selectors in the document. You can choose and jump to view it immediately. This operation is much faster than using the normal "find" function.

8) change the theme

The theme of Sublime Text can be changed. Soda Theme is a good theme and can be installed in the package manager.

If the theme you want to install is not in the online software repository, you can also install it manually:

Download and extract the theme package

Click the menu Preferences > Browse Packages...

Copy the theme folder to the Packages folder.

Click the menu Preferences > Settings-Users and add the following code: "theme": "Soda Light.sublime-theme"

9) replace the Sublime Text program icon

Not only the theme can be changed, but also the icon can be changed. There are a large number of beautifully redesigned Sublime Text icons on Dribbble. Replacement method:

Download an icon with .icns format is best. If not, convert it with iConvert.

Terminal execution:

Open / Applications/Sublime\ Text.app/Contents/Resources/

Replace the Sublime Text 3.icns or Sublime Text 2.icns file.

8) enhanced sidebar

The SideBarEnhancements plug-in effectively improves the sidebar of Sublime Text. After installing the plug-in, right-click on the sidebar to find some new features: open in Explorer, create a new file, create a new folder, and use … Open, open in a browser.

Note: the hotkey opened in the browser is F12.

Thank you for your reading, the above is the content of "what Sublime Text application skills are there in front-end development". After the study of this article, I believe you have a deeper understanding of what Sublime Text application skills are in front-end development, and the specific use needs to be verified in practice. Here is, the editor will push for you more related knowledge points of the article, welcome to follow!

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.