sublime text ΡΠΎΡΠΌΠ°ΡΠΈΡΠΎΠ²Π°Π½ΠΈΠ΅ ΠΊΠΎΠ΄Π°
ΠΠ°ΠΊ ΠΏΠ΅ΡΠ΅ΡΠΎΡΠΌΠ°ΡΠΈΡΠΎΠ²Π°ΡΡ HTML-ΠΊΠΎΠ΄ Ρ ΠΏΠΎΠΌΠΎΡΡΡ Sublime Text 2?
Π£ ΠΌΠ΅Π½Ρ ΠΏΠ»ΠΎΡ ΠΎ ΠΎΡΡΠΎΡΠΌΠ°ΡΠΈΡΠΎΠ²Π°Π½Π½ΡΠΉ HTML-ΠΊΠΎΠ΄, ΠΊΠΎΡΠΎΡΡΠΉ Ρ Ρ ΠΎΡΠ΅Π» Π±Ρ ΠΏΠ΅ΡΠ΅ΡΠΎΡΠΌΠ°ΡΠΈΡΠΎΠ²Π°ΡΡ. ΠΡΡΡ Π»ΠΈ ΠΊΠΎΠΌΠ°Π½Π΄Π°, ΠΊΠΎΡΠΎΡΠ°Ρ Π°Π²ΡΠΎΠΌΠ°ΡΠΈΡΠ΅ΡΠΊΠΈ ΠΏΠ΅ΡΠ΅ΡΠΎΡΠΌΠ°ΡΠΈΡΡΠ΅Ρ HTML-ΠΊΠΎΠ΄ Π² Sublime Text 2, ΡΡΠΎΠ±Ρ ΠΎΠ½ Π²ΡΠ³Π»ΡΠ΄Π΅Π» Π»ΡΡΡΠ΅ ΠΈ Π»Π΅Π³ΡΠ΅ ΡΠΈΡΠ°Π»ΡΡ?
15 ΠΎΡΠ²Π΅ΡΠΎΠ²
Π΅ΡΠ»ΠΈ Π²Ρ Π΄Π΅Π»Π°Π΅ΡΠ΅ ΡΡΠΎ ΡΠ°ΡΡΠΎ, Π²Ρ ΠΌΠΎΠΆΠ΅ΡΠ΅ Π½Π°ΠΉΡΠΈ ΡΡΠΎΡ ΠΊΠ»ΡΡ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅ ΠΏΠΎΠ»Π΅Π·Π½ΠΎΠΉ:
Π΅ΡΠ»ΠΈ Π²Π°Ρ ΡΠ°ΠΉΠ» Π½Π΅ ΡΠΎΡ ΡΠ°Π½Π΅Π½ (Π½Π°ΠΏΡΠΈΠΌΠ΅Ρ, Π²Ρ ΠΏΡΠΎΡΡΠΎ Π²ΡΡΠ°Π²ΠΈΠ»ΠΈ ΡΡΠ°Π³ΠΌΠ΅Π½Ρ Π² Π½ΠΎΠ²ΠΎΠ΅ ΠΎΠΊΠ½ΠΎ), Π²Ρ ΠΌΠΎΠΆΠ΅ΡΠ΅ Π²ΡΡΡΠ½ΡΡ ΡΡΡΠ°Π½ΠΎΠ²ΠΈΡΡ ΡΠ·ΡΠΊ Π΄Π»Ρ ΠΎΡΡΡΡΠΏ, Π²ΡΠ±ΡΠ°Π² ΠΌΠ΅Π½Ρ ΠΠΈΠ΄ β ΡΠΈΠ½ΡΠ°ΠΊΡΠΈΡ β language of choice ΠΏΠ΅ΡΠ΅Π΄ Π²ΡΠ±ΠΎΡΠΎΠΌ ΠΏΠ°ΡΠ°ΠΌΠ΅ΡΡΠ° reindent.
Π΅ΡΡΡ ΠΏΠΎΠ»Π΄ΡΠΆΠΈΠ½Ρ ΠΈΠ»ΠΈ ΠΎΠΊΠΎΠ»ΠΎ ΡΠΎΠ³ΠΎ ΡΠΏΠΎΡΠΎΠ±ΠΎΠ² ΡΠΎΡΠΌΠ°ΡΠΈΡΠΎΠ²Π°Π½ΠΈΡ HTML Π² Sublime. Π― ΠΏΡΠΎΡΠ΅ΡΡΠΈΡΠΎΠ²Π°Π» ΠΊΠ°ΠΆΠ΄ΡΠΉ ΠΈΠ· ΡΠ°ΠΌΡΡ ΠΏΠΎΠΏΡΠ»ΡΡΠ½ΡΡ ΠΏΠ»Π°Π³ΠΈΠ½ΠΎΠ² (ΡΠΌ. Π·Π°ΠΏΠΈΡΡ, ΠΊΠΎΡΠΎΡΡΡ Ρ ΡΠ΄Π΅Π»Π°Π» Π² ΡΠ²ΠΎΠ΅ΠΌ Π±Π»ΠΎΠ³Π΅ Π΄Π»Ρ ΠΏΠΎΠ»Π½ΠΎΠΉ ΠΈΠ½ΡΠΎΡΠΌΠ°ΡΠΈΠΈ), Π½ΠΎ Π²ΠΎΡ ΠΊΡΠ°ΡΠΊΠΈΠΉ ΠΎΠ±Π·ΠΎΡ Π½Π΅ΠΊΠΎΡΠΎΡΡΡ ΠΈΠ· Π½Π°ΠΈΠ±ΠΎΠ»Π΅Π΅ ΠΏΠΎΠΏΡΠ»ΡΡΠ½ΡΡ Π²Π°ΡΠΈΠ°Π½ΡΠΎΠ²:
ΠΊΠΎΠΌΠ°Π½Π΄Π° Reindent
Π΅ΡΡΡ Ρ ΠΎΡΠΎΡΠΈΠΉ ΠΎΡΠΊΡΡΡΡΠΉ ΠΈΡΡ ΠΎΠ΄Π½ΡΠΉ ΠΊΠΎΠ΄ ΠΏΠ»Π°Π³ΠΈΠ½ CodeFormatter, ΠΊΠΎΡΠΎΡΡΠΉ (Π½Π°ΡΡΠ΄Ρ Ρ ΠΏΠ΅ΡΠ΅ΠΈΠ½Π΄Π΅Π½ΡΠΈΡΠΎΠ²Π°Π½ΠΈΠ΅ΠΌ) ΠΌΠΎΠΆΠ΅Ρ ΡΠΊΡΠ°ΡΠΈΡΡ Π³ΡΡΠ·Π½ΡΠΉ ΠΊΠΎΠ΄, Π΄Π°ΠΆΠ΅ Π²ΡΠ΅ ΡΡΠΎ Π½Π°Ρ ΠΎΠ΄ΠΈΡΡΡ Π² ΠΎΠ΄Π½ΠΎΠΉ ΡΡΡΠΎΠΊΠ΅.
Π― Π΄ΡΠΌΠ°Ρ, ΡΡΠΎ ΡΡΠΎ ΡΠΎ, ΡΡΠΎ Π²Ρ ΠΈΡΠ΅ΡΠ΅:
Π²Ρ ΠΌΠΎΠΆΠ΅ΡΠ΅ ΡΡΡΠ°Π½ΠΎΠ²ΠΈΡΡ ΡΠΎΡΠ΅ΡΠ°Π½ΠΈΡ ΠΊΠ»Π°Π²ΠΈΡ F12 Π»Π΅Π³ΠΊΠΎ.
Π― ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΡ ΠΏΠΎΡΡΠ΄ΠΎΠΊ Π²ΠΌΠ΅ΡΡΠ΅ Ρ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»ΡΡΠΊΠΎΠΉ ΡΠΈΡΡΠ΅ΠΌΠΎΠΉ ΡΠ±ΠΎΡΠΊΠΈ Π΄Π»Ρ ΡΠ»ΡΡΡΠ΅Π½ΠΈΡ HTML.
Π£ ΠΌΠ΅Π½Ρ Π΅ΡΡΡ HTMLTidy.sublime-ΡΠ±ΠΎΡΠΊΠ° Π² ΠΌΠΎΠΈΡ ΠΏΠ°ΠΊΠ΅ΡΠ°Ρ / User / directory:
ΠΈ tidy_config.cfg ΡΠ°ΠΉΠ» Π² ΡΠΎΠΌ ΠΆΠ΅ ΠΊΠ°ΡΠ°Π»ΠΎΠ³Π΅:
ΠΈ ΠΏΡΠΎΡΡΠΎ Π²ΡΠ±Π΅ΡΠΈΡΠ΅ build system ΠΈ Π½Π°ΠΆΠΌΠΈΡΠ΅ ctrl + b ΠΈΠ»ΠΈ cmd + b ΠΏΠ΅ΡΠ΅ΡΠΎΡΠΌΠ°ΡΠΈΡΠΎΠ²Π°ΡΡ ΡΠΎΠ΄Π΅ΡΠΆΠΈΠΌΠΎΠ΅ ΡΠ°ΠΉΠ»Π°. ΠΠ΄Π½Π° ΠΈΠ· Π½Π΅Π·Π½Π°ΡΠΈΡΠ΅Π»ΡΠ½ΡΡ ΠΏΡΠΎΠ±Π»Π΅ΠΌ Π·Π°ΠΊΠ»ΡΡΠ°Π΅ΡΡΡ Π² ΡΠΎΠΌ, ΡΡΠΎ ST2 Π°Π²ΡΠΎΠΌΠ°ΡΠΈΡΠ΅ΡΠΊΠΈ Π½Π΅ ΠΏΠ΅ΡΠ΅Π·Π°Π³ΡΡΠΆΠ°Π΅Ρ ΡΡΠΎΠ±Ρ ΡΠ²ΠΈΠ΄Π΅ΡΡ ΡΠ΅Π·ΡΠ»ΡΡΠ°ΡΡ, Π²Π°ΠΌ Π½ΡΠΆΠ½ΠΎ ΠΏΠ΅ΡΠ΅ΠΊΠ»ΡΡΠΈΡΡΡΡ Π½Π° Π΄ΡΡΠ³ΠΎΠΉ ΡΠ°ΠΉΠ» ΠΈ ΠΎΠ±ΡΠ°ΡΠ½ΠΎ (ΠΈΠ»ΠΈ Π½Π° Π΄ΡΡΠ³ΠΎΠ΅ ΠΏΡΠΈΠ»ΠΎΠΆΠ΅Π½ΠΈΠ΅ ΠΈ ΠΎΠ±ΡΠ°ΡΠ½ΠΎ).
Π½Π° Mac Ρ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π» macports Π΄Π»Ρ ΡΡΡΠ°Π½ΠΎΠ²ΠΊΠΈ tidy, Π² Windows Π²Π°ΠΌ ΠΏΡΠΈΠ΄Π΅ΡΡΡ Π·Π°Π³ΡΡΠ·ΠΈΡΡ Π΅Π³ΠΎ ΡΠ°ΠΌΠΎΡΡΠΎΡΡΠ΅Π»ΡΠ½ΠΎ ΠΈ ΡΠΊΠ°Π·Π°ΡΡ ΡΠ°Π±ΠΎΡΠΈΠΉ ΠΊΠ°ΡΠ°Π»ΠΎΠ³ Π² ΡΠΈΡΡΠ΅ΠΌΠ΅ ΡΠ±ΠΎΡΠΊΠΈ, Π³Π΄Π΅ Π½Π°Ρ ΠΎΠ΄ΠΈΡΡΡ tidy:
Sublime text 3 ΠΏΠ»Π°Π³ΠΈΠ½Ρ Π΄Π»Ρ ΡΠ°Π·ΡΠ°Π±ΠΎΡΠΊΠΈ. Π£ΡΡΠ°Π½ΠΎΠ²ΠΊΠ° ΠΈ Π½Π°ΡΡΡΠΎΠΉΠΊΠ°.
ΠΠ»Ρ ΡΠ°Π·ΡΠ°Π±ΠΎΡΠΊΠΈ ΡΡΡΠ΅ΡΡΠ²ΡΠ΅Ρ ΠΌΠ½ΠΎΠΆΠ΅ΡΡΠ²ΠΎ ΡΠ΅Π΄Π°ΠΊΡΠΎΡΠΎΠ² ΠΈ IDE, Π½ΠΎ Π½Π° Π΄Π°Π½Π½ΡΠΉ ΠΌΠΎΠΌΠ΅Π½Ρ Sublime Text 3, ΠΎΠ΄ΠΈΠ½ ΠΈΠ· ΡΠ°ΠΌΡΡ ΠΏΠΎΠΏΡΠ»ΡΡΠ½ΡΡ ΡΠ΅Π΄Π°ΠΊΡΠΎΡΠΎΠ² ΡΡΠ΅Π΄ΠΈ Π²Π΅Π± ΡΠ°Π·ΡΠ°Π±ΠΎΡΡΠΈΠΊΠΎΠ². ΠΠ° ΡΡΠΎ ΠΆΠ΅ Π΅Π³ΠΎ ΡΠ°ΠΊ Π»ΡΠ±ΡΡ? ΠΠ΅ΡΠ²ΠΎΠ΅ ΡΡΠΎ ΡΠΊΠΎΡΠΎΡΡΡ ΡΠ°Π±ΠΎΡΡ, Π²ΡΠΎΡΠΎΠ΅ Π²ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎΡΡΡ ΡΡΡΠ°Π½ΠΎΠ²ΠΊΠΈ ΠΏΠ»Π°Π³ΠΈΠ½ΠΎΠ² ΠΈ ΠΏΠ°ΠΊΠ΅ΡΠΎΠ² ΠΊΠΎΡΠΎΡΡΠ΅ ΠΏΠΎΠ·Π²ΠΎΠ»ΡΡΡ ΡΠ°ΡΡΠΈΡΠΈΡΡ ΡΠΎΠ΄Π½ΠΎΠΉ ΡΡΠ½ΠΊΡΠΈΠΎΠ½Π°Π» ΡΠ΅Π΄Π°ΠΊΡΠΎΡΠ°.
Π ΡΡΠΎΠΉ ΡΡΠ°ΡΡΠ΅ ΠΌΡ ΡΠ°ΡΡΠΌΠΎΡΡΠΈΠΌ ΡΠ°ΠΌΡΠ΅ Π½Π΅ΠΎΠ±Ρ ΠΎΠ΄ΠΈΠΌΡΠ΅ Sublime text 3 ΠΏΠ»Π°Π³ΠΈΠ½Ρ ΠΊΠΎΡΠΎΡΡΠ΅ ΠΏΠΎΠΌΠΎΠ³ΡΡ Π²Π°ΠΌ Π² ΡΠ°Π±ΠΎΡΠ΅. ΠΠ΅ΡΠ²ΡΠΌ Π΄Π΅Π»ΠΎΠΌ Π½Π°ΠΌ Π½Π΅ΠΎΠ±Ρ ΠΎΠ΄ΠΈΠΌΠΎ ΡΡΡΠ°Π½ΠΎΠ²ΠΈΡΡ Package Control (ΠΏΠ°ΠΊΠ΅ΡΠ½ΡΠΉ ΠΌΠ΅Π½Π΅Π΄ΠΆΠ΅Ρ). Π― ΠΎΠΏΠΈΡΡΠ²Π°Π» ΠΏΠΎΠ΄ΡΠΎΠ±Π½ΠΎ ΡΡΠΎΡ ΠΏΡΠΎΡΠ΅ΡΡ, Π° ΡΠ°ΠΊ ΠΆΠ΅ ΠΊΠ°ΠΊ ΡΡΡΠ°Π½ΠΎΠ²ΠΈΡΡ ΠΏΠ»Π°Π³ΠΈΠ½Ρ Π² ΠΏΡΠΎΡΠ»ΠΎΠΉ ΡΡΠ°ΡΡΠ΅ ΠΎ sublime.
ΠΠ°Π»Π΅Π΅ Ρ ΡΠ°ΡΡΠΊΠ°ΠΆΡ ΠΎ ΠΏΠ»Π°Π³ΠΈΠ½Π°Ρ ΠΊΠΎΡΠΎΡΡΠ΅ Ρ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΡ Π² ΡΠ°Π±ΠΎΡΠ΅, Π° ΡΠ°ΠΊΠΆΠ΅ ΡΠ°Π·Π±Π΅ΡΠ΅ΠΌ ΠΊΡΠ°ΡΠΊΠΎ ΠΈΡ Π½Π°ΡΡΡΠΎΠΉΠΊΡ.
Sublime text 3 ΠΏΠ»Π°Π³ΠΈΠ½ Π΄Π»Ρ ΡΠΎΡΠΌΠ°ΡΠΈΡΠΎΠ²Π°Π½ΠΈΡ ΠΊΠΎΠ΄Π° HTML-CSS-JS Prettify
Π§Π°ΡΡΠΎ Π²ΠΎ Π²ΡΠ΅ΠΌΡ ΡΠ°Π±ΠΎΡΡ ΠΌΡ Π½Π΅ ΡΠ»Π΅Π΄ΠΈΠΌ Π·Π° ΠΏΡΠ°Π²ΠΈΠ»ΡΠ½ΡΠΌ ΡΠΎΡΠΌΠ°ΡΠΈΡΠΎΠ²Π°Π½ΠΈΠ΅ΠΌ ΠΊΠΎΠ΄Π°. ΠΡΠΎΡ ΠΏΠ°ΠΊΠ΅Ρ, ΠΏΠΎΠ·Π²ΠΎΠ»ΡΠ΅Ρ Π²Π°ΠΌ ΡΠΎΡΠΌΠ°ΡΠΈΡΠΎΠ²Π°ΡΡ HTML, CSS, JavaScript ΠΊΠΎΠ΄ ΠΈ JSON ΡΠ°ΠΉΠ»Ρ. Π£ΡΡΠ°Π½Π°Π²Π»ΠΈΠ²Π°Π΅ΡΡΡ ΠΎΠ½ ΠΊΠ°ΠΊ ΠΈ Π²ΡΠ΅ ΠΏΠ»Π°Π³ΠΈΠ½Ρ. ΠΡΠ·ΠΎΠ²ΠΈΡΠ΅ Command Palette Π½Π°Π±Π΅ΡΠΈΡΠ΅ prettify, Π²ΡΠ±Π΅ΡΠΈΡΠ΅ HTML-CSS-JS Prettify. ΠΠ΅Ρ Π½Π΅ΠΎΠ±Ρ ΠΎΠ΄ΠΈΠΌΠΎΡΡΠΈ ΠΏΡΠΎΠ²ΠΎΠ΄ΠΈΡΡ Π½Π°ΡΡΡΠΎΠΉΠΊΡ, ΡΡΠ°Π·Ρ ΠΌΠΎΠΆΠ½ΠΎ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ.
Emmet Π±ΡΡΡΡΠΎΠ΅ Π½Π°ΠΏΠΈΡΠ°Π½ΠΈΠ΅ ΠΊΠΎΠ΄Π°.
ΠΠ»Π°Π³ΠΈΠ½ Emmet ΡΡΠΊΠΎΡΡΠ΅Ρ Π½Π°ΠΏΠΈΡΠ°Π½ΠΈΠ΅ ΠΊΠΎΠ΄Π° Ρ ΠΏΠΎΠΌΠΎΡΡΡ Π³ΠΎΡΡΡΠΈΡ ΠΊΠ»Π°Π²ΠΈΡ ΠΈ ΡΠ½ΠΈΠΏΠΏΠ΅ΡΠΎΠ². ΠΠΎΠΌΠΈΠΌΠΎ Sublime Text, Emmet ΠΌΠΎΠΆΠ΅Ρ ΡΠ°Π±ΠΎΡΠ°ΡΡ ΠΈ Ρ Π΄ΡΡΠ³ΠΈΠΌΠΈ ΡΠ΅Π΄Π°ΠΊΡΠΎΡΠ°ΠΌΠΈ, ΡΠ°ΠΊΠΈΠΌΠΈ ΠΊΠ°ΠΊ β Notepad++, Coda, Eclipse, TextMate ΠΈ Π΄.Ρ. Emmet ΡΡΡΠ°Π½Π°Π²Π»ΠΈΠ²Π°Π΅ΡΡΡ ΡΠ°ΠΊ ΠΆΠ΅ ΠΊΠ°ΠΊ ΠΈ Π΄ΡΡΠ³ΠΈΠ΅ ΠΏΠ»Π°Π³ΠΈΠ½Ρ.
ΠΠ°ΠΊ ΡΠ°Π±ΠΎΡΠ°Π΅Ρ ΠΏΠ»Π°Π³ΠΈΠ½ Emmet?
ΠΡΠΈΠ²Π΅Π΄Ρ ΠΏΠ°ΡΡ ΠΏΡΠΈΠΌΠ΅ΡΠΎΠ². ΠΠ°ΠΏΡΠΈΠΌΠ΅Ρ ΠΏΡΠΈ Π½Π°ΠΏΠΈΡΠ°Π½ΠΈΠΈ Π² ΡΠ΅Π΄Π°ΠΊΡΠΎΡΠ΅ ul Π±Π΅Π· <> ΠΈ Π½Π°ΠΆΠ°ΡΠΈΡ Tab Π±ΡΠ΄Π΅Ρ Π°Π²ΡΠΎΠΌΠ°ΡΠΈΡΠ΅ΡΠΊΠΈ ΡΠ°Π·Π²Π΅ΡΠ½ΡΡ ΠΏΠΎΠ»Π½ΡΠΉ ΡΠΏΠΈΡΠΎΠΊ. ΠΡΠ»ΠΈ ΠΌΡ Ρ ΠΎΡΠΈΠΌ Π΄ΠΎΠ±Π°Π²ΠΈΡΡ Π΅ΡΠ΅ ΡΠ»Π΅ΠΌΠ΅Π½ΡΡ li ΠΏΠΈΡΠ΅ΠΌ ΡΠ°ΠΊ ul>li
Π’Π°ΠΊΠΈΠΌ ΠΆΠ΅ ΠΌΠ΅ΡΠΎΠ΄ΠΎΠΌ ΠΌΠΎΠΆΠ½ΠΎ Π½Π°ΠΏΠΈΡΠ°ΡΡ div.my-class Π΄Π»Ρ Π½Π°Π·Π½Π°ΡΠ΅Π½ΠΈΡ ΠΊΠ»Π°ΡΡΠ° ΡΠ»Π΅ΠΌΠ΅Π½ΡΡ.
Sublime Text 3 ΠΏΠ»Π°Π³ΠΈΠ½Ρ Π΄Π»Ρ ΠΏΡΠΎΠ²Π΅ΡΠΊΠΈ ΠΊΠΎΠ΄Π°
ΠΠ»Π°Π³ΠΈΠ½ Sublime Linter
ΠΡΠΎΠ²Π΅ΡΠΊΠ° ΠΊΠΎΠ΄Π° ΡΠ²Π»ΡΠ΅ΡΡΡ Π²Π΅ΡΡΠΌΠ° Π²Π°ΠΆΠ½ΠΎΠΉ ΡΠ°ΡΡΡΡ ΠΏΡΠΎΡΠ΅ΡΡΠ° ΡΠ°Π·ΡΠ°Π±ΠΎΡΠΊΠΈ. ΠΡΠ»ΠΈ Π²Ρ Π½ΠΈΠΊΠΎΠ³Π΄Π° ΡΠ°Π½ΡΡΠ΅ Π½Π΅ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π»ΠΈ linter, ΡΠΎ Π·Π½Π°ΠΉΡΠ΅, ΡΡΠΎ ΡΡΠΎ ΠΈΠ½ΡΡΡΡΠΌΠ΅Π½Ρ Π΄Π»Ρ ΠΏΡΠΎΠ²Π΅ΡΠΊΠΈ ΠΊΠ°ΡΠ΅ΡΡΠ²Π° ΠΊΠΎΠ΄Π°. ΠΠ½ ΠΏΡΠΎΠ²Π΅ΡΡΠ΅Ρ ΠΊΠΎΠ΄ Π½Π° ΠΎΡΠΈΠ±ΠΊΠΈ ΠΈ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΠ΅ ΠΏΠ»ΠΎΡ ΠΈΡ ΠΏΡΠ°ΠΊΡΠΈΠΊ.
Π‘ ΠΏΠΎΠΌΠΎΡΡΡ ΠΏΠ»Π°Π³ΠΈΠ½ΠΎΠ² ΠΊΠΎΡΠΎΡΡΠ΅ ΡΠ°Π±ΠΎΡΠ°ΡΡ Π½Π° ΠΎΡΠ½ΠΎΠ²Π΅ Sublime Linter Π²Ρ ΠΌΠΎΠΆΠ΅ΡΠ΅ Π»Π΅Π³ΠΊΠΎ ΠΏΡΠΎΠ²Π΅ΡΠΈΡΡ ΠΏΡΠ°ΠΊΡΠΈΡΠ΅ΡΠΊΠΈ Π»ΡΠ±ΠΎΠΉ ΠΊΠΎΠ΄. ΠΡΠ»ΠΈ Π²Ρ ΡΠΎΠ²Π΅ΡΡΠΈΡΠ΅ ΠΎΡΠΈΠ±ΠΊΡ Π² ΠΊΠΎΠ΄Π΅, Sublime Linter ΠΏΠΎΠ΄ΡΠ²Π΅ΡΠΈΡ Π΅Ρ Π½Π΅Π±ΠΎΠ»ΡΡΠΈΠΌ ΠΊΡΠ°ΡΠ½ΡΠΌ ΠΈΠ»ΠΈ ΠΆΠ΅Π»ΡΡΠΌ ΠΊΡΡΠΆΠΊΠΎΠΌ.
ΠΡΠ·ΠΎΠ²ΠΈΡΠ΅ Command Palette β Package Control : Install Package Π½Π°Π±Π΅ΡΠΈΡΠ΅ linter, Π²ΡΠ±Π΅ΡΠΈΡΠ΅ SublimeLinter
ΠΠ°Π»Π΅Π΅ Π½Π°ΠΌ Π½Π΅ΠΎΠ±Ρ
ΠΎΠ΄ΠΈΠΌΠΎ ΡΡΡΠ°Π½ΠΎΠ²ΠΈΡΡ Π»ΠΈΠ½ΡΠ΅ΡΡ Π΄Π»Ρ javascript ΠΈ php.
ΠΠ»Π°Π³ΠΈΠ½ ESLint Π΄Π»Ρ javascript
ESLint Π½Π°ΠΏΠΈΡΠ°Π½Π½ΡΠΉ ΠΠΈΠΊΠΎΠ»Π°ΡΠΎΠΌ ΠΠ°ΠΊΠ°ΡΠΎΠΌ. ΠΠ³ΠΎ ΠΎΡΠ½ΠΎΠ²Π½ΠΎΠ΅ ΠΎΡΠ»ΠΈΡΠΈΠ΅ ΠΎΡ Π΄ΡΡΠ³ΠΈΡ Π»ΠΈΠ½ΡΠ΅ΡΠΎΠ² Π² ΡΠΎΠΌ ΡΡΠΎ ΠΎΠ½ Π°Π½Π°Π»ΠΈΠ·ΠΈΡΡΠ΅Ρ Π½Π΅ ΡΠ΅ΠΊΡΡ ΠΏΡΠΎΠ³ΡΠ°ΠΌΠΌ, Π° ΠΏΡΠ΅Π΄Π²Π°ΡΠΈΡΠ΅Π»ΡΠ½ΠΎ ΡΠ³Π΅Π½Π΅ΡΠΈΡΠΎΠ²Π°Π½Π½ΠΎΠ΅ AST-Π΄Π΅ΡΠ΅Π²ΠΎ, ΡΡΠΎ Π΄Π°Π΅Ρ Π΅ΠΌΡ Π±ΠΎΠ»ΡΡΠ΅ Π²ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎΡΡΠ΅ΠΉ Π΄Π»Ρ Π°Π½Π°Π»ΠΈΠ·Π°.
ΠΡΠΎΡΠ°Ρ Π²Π°ΠΆΠ½Π°Ρ ΠΎΡΠΎΠ±Π΅Π½Π½ΠΎΡΡΡ ESLint ΡΡΠΎ Π²ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎΡΡΡ Π²ΡΠΊΠ»ΡΡΠΈΡΡ Π»ΡΠ±ΠΎΠ΅ ΠΏΡΠ°Π²ΠΈΠ»ΠΎ ΠΈΠ»ΠΈ Π½Π°ΠΏΠΈΡΠ°ΡΡ ΠΏΠ»Π°Π³ΠΈΠ½ ΠΊΠΎΡΠΎΡΡΠΉ Π΄ΠΎΠ±Π°Π²Π»ΡΠ΅Ρ Π½ΠΎΠ²ΡΠ΅ ΠΏΡΠ°Π²ΠΈΠ»Π°.
Π€Π°ΠΉΠ» Π²Ρ ΠΌΠΎΠΆΠ΅ΡΠ΅ Π½Π°ΡΡΡΠΎΠΈΡΡ ΠΏΠΎΠ΄ ΡΠ΅Π±Ρ, ΠΈΠ»ΠΈ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ ΡΠΆΠ΅ Π³ΠΎΡΠΎΠ²ΡΠ΅ ΠΊΠΎΠ½ΡΠΈΠ³ΡΡΠ°ΡΠΈΠΈ. ΠΡΠΈΠΌΠ΅Ρ ΠΌΠΎΠ΅Π³ΠΎ ΡΠ°ΠΉΠ»Π° ΠΊΠΎΠ½ΡΠΈΠ³ΡΡΠ°ΡΠΈΠΈ:
Π‘Π»Π΅Π΄ΡΡΡΠ΅Π΅ Π΄Π΅ΠΉΡΡΠ²ΠΈΠ΅ ΡΡΠΎ ΡΡΡΠ°Π½ΠΎΠ²ΠΊΠ° ESLint Π² Sublime Text. Π£ΡΡΠ°Π½ΠΎΠ²ΠΊΠ° ΠΏΡΠΎΠΈΡΡ ΠΎΠ΄ΠΈΡ Π°Π½Π°Π»ΠΎΠ³ΠΈΡΠ½ΠΎ Π΄ΡΡΠ³ΠΈΠΌ ΠΏΠ»Π°Π³ΠΈΠ½Π°ΠΌ ΡΠ΅ΡΠ΅Π· Command Palette. Π ΠΏΠΎΠ»Π΅ ΠΏΠΎΠΈΡΠΊΠ° ΠΏΠ»Π°Π³ΠΈΠ½ΠΎΠ² ΠΏΠ΅ΡΠ°ΡΠ°Π΅ΠΌ eslint, Π² ΡΠΏΠΈΡΠΊΠ΅ ΠΊΠΎΡΠΎΡΡΠΉ ΠΏΠΎΡΠ²ΠΈΠ»ΡΡ Π²Ρ Π΄ΠΎΠ»ΠΆΠ½Ρ ΡΠ²ΠΈΠ΄Π΅ΡΡ SublimeLinter-contrib-eslint ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠΉΡΠ΅ ΠΊΠ»Π°Π²ΠΈΠ°ΡΡΡΡ ΠΈΠ»ΠΈ ΠΌΡΡΡ ΡΡΠΎΠ±Ρ Π²ΡΠ±ΡΠ°ΡΡ Π΅Π³ΠΎ.
ΠΠ°Π»Π΅Π΅ ΠΏΠ΅ΡΠ΅Ρ ΠΎΠ΄ΠΈΠΌ Π² Β«Preferences / Package Settings / ESLint / Settings β UserΒ» Π² ΠΌΠ΅Π½Ρ, ΠΈ Π²ΡΡΠ°Π²Π»ΡΠ΅ΠΌ ΡΠ»Π΅Π΄ΡΡΡΠ΅Π΅:
ΠΠ»Π°Π³ΠΈΠ½ PHP CodeSniffer
PHP CodeSniffer β ΡΠΎΠ΄Π΅ΡΠΆΠΈΡ Π² ΡΠ΅Π±Π΅ Π΄Π²Π° ΡΠΊΡΠΈΠΏΡΠ°, Π³Π»Π°Π²Π½ΡΠΉ phpcs ΠΏΡΠΎΠ²Π΅ΡΡΠ΅Ρ PHP (ΡΠ°ΠΊ ΠΆΠ΅ JavaScript ΠΈ CSS) ΡΠ°ΠΉΠ»Ρ Π½Π° Π½Π°Π»ΠΈΡΠΈΠ΅ Π½Π°ΡΡΡΠ΅Π½ΠΈΠΉ Π΄Π»Ρ ΠΎΠΏΡΠ΅Π΄Π΅Π»Π΅Π½Π½ΠΎΠ³ΠΎ ΡΡΠ°Π½Π΄Π°ΡΡΠ° ΠΊΠΎΠ΄ΠΈΡΠΎΠ²Π°Π½ΠΈΡ.
Π―Π²Π»ΡΠ΅ΡΡΡ ΠΎΡΠ΅Π½Ρ Π²Π°ΠΆΠ½ΡΠΌ ΠΈΠ½ΡΡΡΡΠΌΠ΅Π½ΡΠΎΠΌ ΡΠ°Π·ΡΠ°Π±ΠΎΡΠΊΠΈ, ΠΏΠΎΠΌΠΎΠ³Π°Π΅Ρ ΡΠ΄Π΅Π»Π°ΡΡ ΠΠ°Ρ ΠΊΠΎΠ΄ ΡΠΈΡΡΡΠΌ ΠΈ ΠΏΠΎΡΠ»Π΅Π΄ΠΎΠ²Π°ΡΠ΅Π»ΡΠ½ΡΠΌ. Π’Π°ΠΊΠΆΠ΅ ΠΏΠΎΠΌΠΎΠ³Π°Π΅Ρ ΠΏΡΠ΅Π΄ΠΎΡΠ²ΡΠ°ΡΠΈΡΡ Π½Π΅ΠΊΠΎΡΠΎΡΡΠ΅ ΠΎΠ±ΡΠΈΠ΅ ΡΠ΅ΠΌΠ°Π½ΡΠΈΡΠ΅ΡΠΊΠΈΠ΅ ΠΎΡΠΈΠ±ΠΊΠΈ, Π΄ΠΎΠΏΡΡΠ΅Π½Π½ΡΠ΅ ΡΠ°Π·ΡΠ°Π±ΠΎΡΡΠΈΠΊΠ°ΠΌΠΈ. ΠΡΠΎΡΠΎΠΉ ΡΠΊΡΠΈΠΏΡ phpcbf Π°Π²ΡΠΎΠΌΠ°ΡΠΈΡΠ΅ΡΠΊΠΈ ΠΏΡΠ°Π²ΠΈΡ ΠΊΠΎΠ΄ ΠΏΠΎΠ΄ ΡΡΠ°Π½Π΄Π°ΡΡΡ ΠΊΠΎΠ΄ΠΈΡΠΎΠ²Π°Π½ΠΈΡ.
ΠΠ»Ρ ΡΡΡΠ°Π½ΠΎΠ²ΠΊΠΈ Code Sniffer Ρ ΠΠ°Ρ ΡΠΆΠ΅ Π΄ΠΎΠ»ΠΆΠ΅Π½ Π±ΡΡΡ ΡΡΡΠ°Π½ΠΎΠ²Π»Π΅Π½ PHP ΠΈ Composer ΠΏΠ°ΠΊΠ΅ΡΠ½ΡΠΉ ΠΌΠ΅Π½Π΅Π΄ΠΆΠ΅Ρ, ΠΊΠ°ΠΊ ΡΡΡΠ°Π½ΠΎΠ²ΠΈΡΡ Composer Π²Ρ ΠΌΠΎΠΆΠ΅ΡΠ΅ ΠΏΡΠΎΡΠΈΡΠ°ΡΡ Π½Π° ΠΎΡΠΈΡΠΈΠ°Π»ΡΠ½ΠΎΠΌ ΡΠ°ΠΉΡΠ΅.
ΠΠ΅ΡΠ΅Π΄ Π½Π°ΡΠ°Π»ΠΎΠΌ ΡΡΡΠ°Π½ΠΎΠ²ΠΊΠΈ Π½ΡΠΆΠ½ΠΎ ΡΠ±Π΅Π΄ΠΈΡΡΡΡ, ΡΡΠΎ Π² ΡΠΈΡΡΠ΅ΠΌΠ½ΡΡ ΠΏΠ΅ΡΠ΅ΠΌΠ΅Π½Π½ΡΡ PATH Π±ΡΠ» Π΄ΠΎΠ±Π°Π²Π»Π΅Π½ composer, Π·Π½Π°ΡΠ΅Π½ΠΈΠ΅ ΠΏΠ΅ΡΠ΅ΠΌΠ΅Π½Π½ΠΎΠΉ ΠΏΠΎ ΡΠΌΠΎΠ»ΡΠ°Π½ΠΈΡ Π΄ΠΎΠ»ΠΆΠ½ΠΎ Π±ΡΡΡ
ΠΠ»Ρ ΡΡΡΠ°Π½ΠΎΠ²ΠΊΠΈ ΡΠ΅ΡΠ΅Π· Composer ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅ΠΌ ΠΊΠΎΠΌΠ°Π½Π΄Ρ:
composer global require «squizlabs/php_codesniffer=*»
ΠΠ°Π»Π΅Π΅ Π½Π΅ΠΎΠ±Ρ ΠΎΠ΄ΠΈΠΌΠΎ ΡΡΡΠ°Π½ΠΎΠ²ΠΈΡΡ ΡΡΠ°Π½Π΄Π°ΡΡ ΠΊΠΎΠ΄ΠΈΡΠΎΠ²Π°Π½ΠΈΡ, Π² Π½Π°ΡΠ΅ΠΌ ΡΠ»ΡΡΠ°Π΅ ΡΡΠΎ Π±ΡΠ΄Π΅Ρ WordPress Coding Standards, Π΄Π»Ρ ΡΡΡΠ°Π½ΠΎΠ²ΠΊΠΈ ΡΠ½ΠΎΠ²Π° ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅ΠΌ ΠΊΠΎΠΌΠ°Π½Π΄Ρ Composer:
Π‘Π»Π΅Π΄ΡΡΡΠΈΠΉ ΡΠ°Π³ β ΡΡΡΠ°Π½ΠΎΠ²ΠΊΠ° ΠΏΠ°ΠΊΠ΅ΡΠ° sublime-phpcs ΠΈ phpcs-linter ΡΡΠ°Π½Π΄Π°ΡΡΠ½ΡΠΌ ΡΠΏΠΎΡΠΎΠ±ΠΎΠΌ ΡΠ΅ΡΠ΅Π· Package Control : Install Package, Π΄Π»Ρ Π΅Π³ΠΎ ΡΠ°Π±ΠΎΡΡ ΠΎΠ±ΡΠ·Π°ΡΠ΅Π»ΡΠ½ΠΎ Π½Π΅ΠΎΠ±Ρ ΠΎΠ΄ΠΈΠΌ Sublime Linter.
ΠΠΎΡΠ»Π΅ ΡΡΡΠ°Π½ΠΎΠ²ΠΊΠΈ ΠΈΠ· command palette Π²ΡΠ±ΠΈΡΠ°Π΅ΠΌ Preferences: SublimeLinter Settings β User ΠΈ ΠΈΠ·ΠΌΠ΅Π½ΡΠ΅ΠΌ user.linters.phpcs.standard Π½Π° php ΡΡΠ°Π½Π΄Π°ΡΡ ΠΊΠΎΡΠΎΡΡΠΉ Π²Ρ Π²ΡΠ±ΡΠ°Π»ΠΈ WordPress, WordPress-VIP, ΠΈ ΡΠΎΠΌΡ ΠΏΠΎΠ΄ΠΎΠ±Π½ΡΠ΅.
ΠΠ»Ρ ΡΠ°Π±ΠΎΡΡ PHP Code Beautifier and Fixer Π½Π΅ΠΎΠ±Ρ ΠΎΠ΄ΠΈΠΌΠΎ ΠΏΡΠΎΠΏΠΈΡΠ°ΡΡ Π² ΠΏΠ΅ΡΠ΅ΠΌΠ΅Π½Π½ΡΡ path ΠΏΡΡΡ ΠΊ ΡΠ°ΠΉΠ»Ρ phpcbf.bat ΠΊΠΎΡΠΎΡΡΠΉ Π»Π΅ΠΆΠΈΡ Π² your_path_to_wpcs\vendor\bin\
Π Π² ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»ΡΡΠΊΠΈΠ΅ Π½Π°ΡΡΡΠΎΠΉΠΊΠΈ ( Preferences β Package Settings β PHP Code Sniffer β Settings β User ) Π΄ΠΎΠ±Π°Π²ΠΈΡΡ:
ΠΠ»Ρ Π·Π°ΠΏΡΡΠΊΠ° Π² Command Palette ΠΏΠΈΡΠ΅ΠΌ fixer ΠΈΠ· ΡΠΏΠΈΡΠΊΠ° Π²ΡΠ±ΠΈΡΠ°Π΅ΠΌ PHP Π‘oding Standards Fixer: Fix this file (PHP Code Beautifier).
ΠΡΠΎΡΠΎΠΉ Π²Π°ΡΠΈΠ°Π½Ρ ΡΡΠΎ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ Π³ΠΎΡΡΡΠΈΠ΅ ΠΊΠ»Π°Π²ΠΈΡΠΈ, Π·Π°Ρ ΠΎΠ΄ΠΈΠΌ Π² Preferences β Package Settings β PHP Code Sniffer β Key Bindings β User ΠΈ Π΄ΠΎΠ±Π°Π²Π»ΡΠ΅ΠΌ:
ΠΡΠΎ ΠΎΡΠ½ΠΎΠ²Π½ΡΠ΅ Sublime text 3 ΠΏΠ»Π°Π³ΠΈΠ½Ρ ΠΊΠΎΡΠΎΡΡΠ΅ Ρ ΡΠ΅ΠΊΠΎΠΌΠ΅Π½Π΄ΡΡ Π²Π°ΠΌ ΡΡΡΠ°Π½ΠΎΠ²ΠΈΡΡ, ΠΊΠΎΠ½Π΅ΡΠ½ΠΎ ΡΡΠΎ Π½Π΅ ΠΎΠΊΠΎΠ½ΡΠ°ΡΠ΅Π»ΡΠ½ΡΠΉ ΡΠΏΠΈΡΠΎΠΊ, ΠΊΠΎΠ»ΠΈΡΠ΅ΡΡΠ²ΠΎ ΠΏΠ»Π°Π³ΠΈΠ½ΠΎΠ² Π·Π°Π²ΠΈΡΠΈΡ ΠΎΡ Π²Π°ΡΠΈΡ ΠΏΠΎΡΡΠ΅Π±Π½ΠΎΡΡΠ΅ΠΉ ΠΈ ΠΏΡΠ΅Π΄ΠΏΠΎΡΡΠ΅Π½ΠΈΠΉ. Π ΠΊΠ°ΠΊΠΈΠ΅ Π²Ρ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅ΡΠ΅? ΠΠ°ΠΏΠΈΡΠΈΡΠ΅ Π² ΠΊΠΎΠΌΠΌΠ΅Π½ΡΠ°ΡΠΈΡΡ .
ΠΡΠ»ΠΈ ΡΡΠ°ΡΡΡ ΠΎΠΊΠ°Π·Π°Π»Π°ΡΡ Π²Π°ΠΌ ΠΏΠΎΠ»Π΅Π·Π½ΠΎΠΉ ΠΏΠΎΠ΄Π΅Π»ΠΈΡΠ΅ΡΡ Π΅ΠΉ Ρ Π΄ΡΡΠ·ΡΡΠΌΠΈ. ΠΡΠΎ ΠΏΠΎΠΌΠΎΠΆΠ΅Ρ ΡΠ°Π·Π²ΠΈΡΠΈΡ ΠΏΡΠΎΠ΅ΠΊΡΠ°. Π ΠΎΠ±ΡΠ·Π°ΡΠ΅Π»ΡΠ½ΠΎ ΠΏΠΎΠ΄ΠΏΠΈΡΠΈΡΠ΅ΡΡ Π² Π½Π°ΡΠΈ ΡΠΎΠΎΠ±ΡΠ΅ΡΡΠ²Π° Π² ΡΠΎΡΠΈΠ°Π»ΡΠ½ΡΡ ΡΠ΅ΡΡΡ .
Sublime text ΡΠΎΡΠΌΠ°ΡΠΈΡΠΎΠ²Π°Π½ΠΈΠ΅ ΠΊΠΎΠ΄Π°
Π£ ΠΌΠ΅Π½Ρ ΠΏΠ»ΠΎΡ ΠΎ ΠΎΡΡΠΎΡΠΌΠ°ΡΠΈΡΠΎΠ²Π°Π½Π½ΡΠΉ HTML-ΠΊΠΎΠ΄, ΠΊΠΎΡΠΎΡΡΠΉ Ρ Ρ ΠΎΡΠ΅Π» Π±Ρ ΠΏΠ΅ΡΠ΅ΡΠΎΡΠΌΠ°ΡΠΈΡΠΎΠ²Π°ΡΡ. ΠΡΡΡ Π»ΠΈ ΠΊΠΎΠΌΠ°Π½Π΄Π°, ΠΊΠΎΡΠΎΡΠ°Ρ Π°Π²ΡΠΎΠΌΠ°ΡΠΈΡΠ΅ΡΠΊΠΈ ΠΏΠ΅ΡΠ΅ΡΠΎΡΠΌΠ°ΡΠΈΡΡΠ΅Ρ HTML-ΠΊΠΎΠ΄ Π² Sublime Text 2, ΡΡΠΎΠ±Ρ ΠΎΠ½ Π²ΡΠ³Π»ΡΠ΄Π΅Π» Π»ΡΡΡΠ΅ ΠΈ Π»Π΅Π³ΡΠ΅ ΡΠΈΡΠ°Π»ΡΡ?
15 ΠΎΡΠ²Π΅ΡΠΎΠ²
Π΅ΡΠ»ΠΈ Π²Ρ Π΄Π΅Π»Π°Π΅ΡΠ΅ ΡΡΠΎ ΡΠ°ΡΡΠΎ, Π²Ρ ΠΌΠΎΠΆΠ΅ΡΠ΅ Π½Π°ΠΉΡΠΈ ΡΡΠΎΡ ΠΊΠ»ΡΡ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅ ΠΏΠΎΠ»Π΅Π·Π½ΠΎΠΉ:
Π΅ΡΠ»ΠΈ Π²Π°Ρ ΡΠ°ΠΉΠ» Π½Π΅ ΡΠΎΡ ΡΠ°Π½Π΅Π½ (Π½Π°ΠΏΡΠΈΠΌΠ΅Ρ, Π²Ρ ΠΏΡΠΎΡΡΠΎ Π²ΡΡΠ°Π²ΠΈΠ»ΠΈ ΡΡΠ°Π³ΠΌΠ΅Π½Ρ Π² Π½ΠΎΠ²ΠΎΠ΅ ΠΎΠΊΠ½ΠΎ), Π²Ρ ΠΌΠΎΠΆΠ΅ΡΠ΅ Π²ΡΡΡΠ½ΡΡ ΡΡΡΠ°Π½ΠΎΠ²ΠΈΡΡ ΡΠ·ΡΠΊ Π΄Π»Ρ ΠΎΡΡΡΡΠΏ, Π²ΡΠ±ΡΠ°Π² ΠΌΠ΅Π½Ρ ΠΠΈΠ΄ β ΡΠΈΠ½ΡΠ°ΠΊΡΠΈΡ β language of choice ΠΏΠ΅ΡΠ΅Π΄ Π²ΡΠ±ΠΎΡΠΎΠΌ ΠΏΠ°ΡΠ°ΠΌΠ΅ΡΡΠ° reindent.
Π΅ΡΡΡ ΠΏΠΎΠ»Π΄ΡΠΆΠΈΠ½Ρ ΠΈΠ»ΠΈ ΠΎΠΊΠΎΠ»ΠΎ ΡΠΎΠ³ΠΎ ΡΠΏΠΎΡΠΎΠ±ΠΎΠ² ΡΠΎΡΠΌΠ°ΡΠΈΡΠΎΠ²Π°Π½ΠΈΡ HTML Π² Sublime. Π― ΠΏΡΠΎΡΠ΅ΡΡΠΈΡΠΎΠ²Π°Π» ΠΊΠ°ΠΆΠ΄ΡΠΉ ΠΈΠ· ΡΠ°ΠΌΡΡ ΠΏΠΎΠΏΡΠ»ΡΡΠ½ΡΡ ΠΏΠ»Π°Π³ΠΈΠ½ΠΎΠ² (ΡΠΌ. Π·Π°ΠΏΠΈΡΡ, ΠΊΠΎΡΠΎΡΡΡ Ρ ΡΠ΄Π΅Π»Π°Π» Π² ΡΠ²ΠΎΠ΅ΠΌ Π±Π»ΠΎΠ³Π΅ Π΄Π»Ρ ΠΏΠΎΠ»Π½ΠΎΠΉ ΠΈΠ½ΡΠΎΡΠΌΠ°ΡΠΈΠΈ), Π½ΠΎ Π²ΠΎΡ ΠΊΡΠ°ΡΠΊΠΈΠΉ ΠΎΠ±Π·ΠΎΡ Π½Π΅ΠΊΠΎΡΠΎΡΡΡ ΠΈΠ· Π½Π°ΠΈΠ±ΠΎΠ»Π΅Π΅ ΠΏΠΎΠΏΡΠ»ΡΡΠ½ΡΡ Π²Π°ΡΠΈΠ°Π½ΡΠΎΠ²:
ΠΊΠΎΠΌΠ°Π½Π΄Π° Reindent
Π΅ΡΡΡ Ρ ΠΎΡΠΎΡΠΈΠΉ ΠΎΡΠΊΡΡΡΡΠΉ ΠΈΡΡ ΠΎΠ΄Π½ΡΠΉ ΠΊΠΎΠ΄ ΠΏΠ»Π°Π³ΠΈΠ½ CodeFormatter, ΠΊΠΎΡΠΎΡΡΠΉ (Π½Π°ΡΡΠ΄Ρ Ρ ΠΏΠ΅ΡΠ΅ΠΈΠ½Π΄Π΅Π½ΡΠΈΡΠΎΠ²Π°Π½ΠΈΠ΅ΠΌ) ΠΌΠΎΠΆΠ΅Ρ ΡΠΊΡΠ°ΡΠΈΡΡ Π³ΡΡΠ·Π½ΡΠΉ ΠΊΠΎΠ΄, Π΄Π°ΠΆΠ΅ Π²ΡΠ΅ ΡΡΠΎ Π½Π°Ρ ΠΎΠ΄ΠΈΡΡΡ Π² ΠΎΠ΄Π½ΠΎΠΉ ΡΡΡΠΎΠΊΠ΅.
Π― Π΄ΡΠΌΠ°Ρ, ΡΡΠΎ ΡΡΠΎ ΡΠΎ, ΡΡΠΎ Π²Ρ ΠΈΡΠ΅ΡΠ΅:
Π²Ρ ΠΌΠΎΠΆΠ΅ΡΠ΅ ΡΡΡΠ°Π½ΠΎΠ²ΠΈΡΡ ΡΠΎΡΠ΅ΡΠ°Π½ΠΈΡ ΠΊΠ»Π°Π²ΠΈΡ F12 Π»Π΅Π³ΠΊΠΎ.
Π― ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΡ ΠΏΠΎΡΡΠ΄ΠΎΠΊ Π²ΠΌΠ΅ΡΡΠ΅ Ρ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»ΡΡΠΊΠΎΠΉ ΡΠΈΡΡΠ΅ΠΌΠΎΠΉ ΡΠ±ΠΎΡΠΊΠΈ Π΄Π»Ρ ΡΠ»ΡΡΡΠ΅Π½ΠΈΡ HTML.
Π£ ΠΌΠ΅Π½Ρ Π΅ΡΡΡ HTMLTidy.sublime-ΡΠ±ΠΎΡΠΊΠ° Π² ΠΌΠΎΠΈΡ ΠΏΠ°ΠΊΠ΅ΡΠ°Ρ / User / directory:
ΠΈ tidy_config.cfg ΡΠ°ΠΉΠ» Π² ΡΠΎΠΌ ΠΆΠ΅ ΠΊΠ°ΡΠ°Π»ΠΎΠ³Π΅:
ΠΈ ΠΏΡΠΎΡΡΠΎ Π²ΡΠ±Π΅ΡΠΈΡΠ΅ build system ΠΈ Π½Π°ΠΆΠΌΠΈΡΠ΅ ctrl + b ΠΈΠ»ΠΈ cmd + b ΠΏΠ΅ΡΠ΅ΡΠΎΡΠΌΠ°ΡΠΈΡΠΎΠ²Π°ΡΡ ΡΠΎΠ΄Π΅ΡΠΆΠΈΠΌΠΎΠ΅ ΡΠ°ΠΉΠ»Π°. ΠΠ΄Π½Π° ΠΈΠ· Π½Π΅Π·Π½Π°ΡΠΈΡΠ΅Π»ΡΠ½ΡΡ ΠΏΡΠΎΠ±Π»Π΅ΠΌ Π·Π°ΠΊΠ»ΡΡΠ°Π΅ΡΡΡ Π² ΡΠΎΠΌ, ΡΡΠΎ ST2 Π°Π²ΡΠΎΠΌΠ°ΡΠΈΡΠ΅ΡΠΊΠΈ Π½Π΅ ΠΏΠ΅ΡΠ΅Π·Π°Π³ΡΡΠΆΠ°Π΅Ρ ΡΡΠΎΠ±Ρ ΡΠ²ΠΈΠ΄Π΅ΡΡ ΡΠ΅Π·ΡΠ»ΡΡΠ°ΡΡ, Π²Π°ΠΌ Π½ΡΠΆΠ½ΠΎ ΠΏΠ΅ΡΠ΅ΠΊΠ»ΡΡΠΈΡΡΡΡ Π½Π° Π΄ΡΡΠ³ΠΎΠΉ ΡΠ°ΠΉΠ» ΠΈ ΠΎΠ±ΡΠ°ΡΠ½ΠΎ (ΠΈΠ»ΠΈ Π½Π° Π΄ΡΡΠ³ΠΎΠ΅ ΠΏΡΠΈΠ»ΠΎΠΆΠ΅Π½ΠΈΠ΅ ΠΈ ΠΎΠ±ΡΠ°ΡΠ½ΠΎ).
Π½Π° Mac Ρ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π» macports Π΄Π»Ρ ΡΡΡΠ°Π½ΠΎΠ²ΠΊΠΈ tidy, Π² Windows Π²Π°ΠΌ ΠΏΡΠΈΠ΄Π΅ΡΡΡ Π·Π°Π³ΡΡΠ·ΠΈΡΡ Π΅Π³ΠΎ ΡΠ°ΠΌΠΎΡΡΠΎΡΡΠ΅Π»ΡΠ½ΠΎ ΠΈ ΡΠΊΠ°Π·Π°ΡΡ ΡΠ°Π±ΠΎΡΠΈΠΉ ΠΊΠ°ΡΠ°Π»ΠΎΠ³ Π² ΡΠΈΡΡΠ΅ΠΌΠ΅ ΡΠ±ΠΎΡΠΊΠΈ, Π³Π΄Π΅ Π½Π°Ρ ΠΎΠ΄ΠΈΡΡΡ tidy:
ΠΠ°ΠΊ Π½Π°ΡΡΡΠΎΠΈΡΡ Π² Sublime 3 Π°Π²ΡΠΎΡΠΎΡΠΌΠ°ΡΠΈΡΠΎΠ²Π°Π½ΠΈΠ΅ ΠΊΠΎΠ΄Π°?
ΠΠΎΠΏΡΡΡΠΈΠΌ, Ρ Π²ΡΡΠ°Π²ΠΈΠ» HTML ΠΊΠΎΠ΄ Π² Sublime Text. ΠΡΠΎΡ ΠΊΠΎΠ΄ Ρ ΠΎΠ΄ΠΈΠ½Π°ΠΊΠΎΠ²ΠΎΠΉ ΡΠ°Π±ΡΠ»ΡΡΠΈΠ΅ΠΉ, ΡΠΎΠΎΡΠ²Π΅ΡΡΡΠ²Π΅Π½Π½ΠΎ, ΠΏΠΎΠ»ΡΡΠ°Π΅ΡΡΡ ΠΊΠ°ΡΠ°.
ΠΠ°ΠΊ ΡΠ΄Π΅Π»Π°ΡΡ ΡΠ°ΠΊ, ΡΡΠΎΠ±Ρ ΠΏΡΠΈ ΠΎΠΏΡΠ΅Π΄Π΅Π»ΡΠ½Π½ΠΎΠΌ Π΄Π΅ΠΉΡΡΠ²ΠΈΠΈ ΠΊΠΎΠ΄ ΡΠ°ΠΌ ΡΠΎΡΠΌΠ°ΡΠΈΡΠΎΠ²Π°Π»ΡΡ ΠΈ ΠΏΡΠΈΠ½ΠΈΠΌΠ°Π» Π½ΠΎΡΠΌΠ°Π»ΡΠ½ΡΠΉ Π²ΠΈΠ΄?
1 ΠΎΡΠ²Π΅Ρ 1
Π‘ΡΠ°Π½Π΄Π°ΡΡΠ½ΡΠΌΠΈ ΡΡΠ΅Π΄ΡΡΠ²Π°ΠΌΠΈ
Preferences β Key Bindings β User
ΠΡΠ»ΠΈ ΡΠ°ΠΉΠ» ΠΏΡΡΡΠΎΠΉ, ΡΠΎ Π²ΡΡΠ°Π²ΠΈΡΡ ΠΊΠΎΠ΄ ΠΏΠΎΠ»Π½ΠΎΡΡΡΡ.
ΠΡΠ»ΠΈ Π½Π΅Ρ, ΡΠΎ Π΄ΠΎΠ±Π°Π²ΠΈΡΡ ΠΎΠ±ΡΠ΅ΠΊΡ Π² ΠΌΠ°ΡΡΠΈΠ², ΠΊΠ°ΠΊ Π΄ΠΎΠ±Π°Π²Π»ΡΠ»ΠΈ Π±Ρ Π΅Π³ΠΎ Π² JSON.
ΠΠ°Π½Π½ΡΠΉ ΠΊΠΎΠ΄ ΠΏΠΎΠ·Π²ΠΎΠ»ΡΠ΅Ρ ΠΏΠΎ Π½Π°ΠΆΠ°ΡΠΈΡ ΠΊΠΎΠΌΠ±ΠΈΠ½Π°ΡΠΈΠΈ CTRL + ALT + L ΠΎΡΡΠΎΡΠΌΠ°ΡΠΈΡΠΎΠ²Π°ΡΡ ΠΊΠΎΠ΄ Π²ΠΎ Π²ΡΠ΅ΠΌ ΡΠ°ΠΉΠ»Π΅ ΠΈΠ»ΠΈ ΡΠΎΠ»ΡΠΊΠΎ Π²Π½ΡΡΡΠΈ Π²ΡΠ΄Π΅Π»Π΅Π½Π½ΠΎΠ³ΠΎ ΡΡΠ°Π³ΠΌΠ΅Π½ΡΠ°.
Π‘ ΠΏΠΎΠΌΠΎΡΡΡ ΡΡΠΎΡΠΎΠ½Π½Π΅Π³ΠΎ ΠΏΠ»Π°Π³ΠΈΠ½Π°
Π£ΡΡΠ°Π½ΠΎΠ²ΠΊΠ°:
ΠΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΠ΅ (Π»ΡΠ±ΠΎΠΉ ΠΈΠ· Π²Π°ΡΠΈΠ°Π½ΡΠΎΠ²)
ΠΠΎΠ΄ΡΠΊΠ°ΠΆΠΈΡΠ΅, ΠΏΠΎΠΆΠ°Π»ΡΠΉΡΡΠ°, ΠΌΠΎΠΆΠ½ΠΎ Π»ΠΈ Π½Π°ΡΡΡΠΎΠΈΡΡ SublimeText 3 ΡΠ°ΠΊΠΈΠΌ ΠΎΠ±ΡΠ°Π·ΠΎΠΌ, ΡΡΠΎΠ±Ρ ΠΎΠ½ Π°Π²ΡΠΎΠΌΠ°ΡΠΈΡΠ΅ΡΠΊΠΈ Π²ΡΡΠ°Π²Π½ΠΈΠ²Π°Π»/ΡΡΡΡΠΊΡΡΡΠΈΡΠΎΠ²Π°Π» html ΠΊΠΎΠ΄, ΠΊΠΎΠ³Π΄Ρ Ρ Π΅Π³ΠΎ Π²ΡΡΠ°Π²Π»ΡΡ/ΠΏΠΈΡΡ.
ΠΠΎΡ ΠΏΡΠΈΠΌΠ΅ΡΠ½ΠΎ ΡΠΎ, ΡΡΠΎ Ρ Ρ
ΠΎΡΡ ΠΠ½ΡΡΡΡΠΌΠ΅Π½Ρ Π΄Π»Ρ ΡΠΎΡΠΌΠ°ΡΠΈΡΠΎΠ²Π°Π½ΠΈΡ HTML ΠΊΠΎΠ΄Π°
ΠΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎ ΠΊΠ°ΠΊΠΎΠΉ ΡΠΎ ΠΏΠ»Π°Π³ΠΈΠ½. ΠΠ΅ ΠΌΠΎΠ³Ρ ΠΏΠΎΠ½ΡΡΡ ΠΊΠ°ΠΊΠΎΠΉ ΠΈ ΠΊΠ°ΠΊ Π΅Π³ΠΎ Π½Π°ΡΡΡΠΎΠΈΡΡ.
ΠΠ΅Π»ΠΎ Π² ΡΠΎΠΌ, ΡΡΠΎ Π°Π²ΡΠΎΡΠΎΡΠΌΠ°ΡΠΈΡΠΎΠ²Π°Π½ΠΈΠ΅ Π½Π΅ Π²ΡΠ΅Π³Π΄Π° ΡΡΠ΅Π±ΡΠ΅ΡΡΡ, ΠΈΠ½ΠΎΠ³Π΄Π° (Ρ ΠΌΠ΅Π½Ρ ΠΏΠΎ ΠΊΡΠ°ΠΉΠ½Π΅ΠΉ ΠΌΠ΅ΡΠ΅ ΠΎΡΠ΅Π½Ρ ΡΠ°ΡΡΠΎ) Π½ΡΠΆΠ½ΠΎ ΠΎΡΡΠ°Π²ΠΈΡΡ ΠΎΡΠΈΠ³ΠΈΠ½Π°Π»ΡΠ½ΠΎΠ΅ ΡΠΎΡΠΌΠ°ΡΠΈΡΠΎΠ²Π°Π½ΠΈΠ΅ Π² Π±ΠΠ»ΡΡΠ΅ΠΉ ΡΠ°ΡΡΠΈ ΠΊΠΎΠ΄Π°.
ΠΠΎ ΡΠΌΠΎΠ»ΡΠ°Π½ΠΈΡ Π°Π²ΡΠΎΡΠΎΡΠΌΠ°ΡΠΈΡΠΎΠ²Π°Π½ΠΈΠ΅ ΠΊΠΎΠ΄Π° (ΡΠ°ΡΡΡΠ°Π²Π»Π΅Π½ΠΈΠ΅ ΠΎΡΡΡΡΠΏΠΎΠ², Π°Π²ΡΠΎΠ·Π°ΠΊΡΡΡΠΈΠ΅ ΡΠ΅Π³ΠΎΠ²) Π²ΠΊΠ»ΡΡΠ΅Π½ΠΎ. ΠΡΠ»ΠΈ ΡΡΠ΅Π±ΡΠ΅ΡΡΡ ΡΠΎΡΠΌΠ°ΡΠΈΡΠΎΠ²Π°ΡΡ ΠΊΠΎΠ΄ β ΠΏΡΠΎΡΡΠΎ Π²ΡΠ΄Π΅Π»ΠΈΡΠ΅ Π΅Π³ΠΎ (Π΄Π»Ρ Π½Π°Π΄ΡΠΆΠ½ΠΎΡΡΠΈ Π΅ΡΡ ΠΌΠΎΠΆΠ½ΠΎ Π½Π°ΠΆΠ°ΡΡ Ctrl+J) ΠΈ Π²ΡΡΠΎΠ²Π½ΡΠΉΡΠ΅ Π²ΡΡΡΠΎΠ΅Π½Π½ΡΠΌΠΈ ΡΡΠ΅Π΄ΡΡΠ²Π°ΠΌΠΈ, ΡΠΏΠΎΡΠΎΠ±Ρ ΠΏΡΠΈΠ²Π΅Π΄Π΅Π½Ρ Π²ΡΡΠ΅ (ΠΈΠ»ΠΈ ΡΠ΅ΡΠ΅Π· ΠΊΠΎΠ½ΡΠ΅ΠΊΡΡΠ½ΠΎΠ΅ ΠΌΠ΅Π½Ρ)
Sublime Text 3 Π΄Π»Ρ Π²Π΅ΡΡΡΠΊΠΈ ΡΠ°ΠΉΡΠΎΠ². ΠΠ°ΡΡΡΠΎΠΉΠΊΠ° Π²Π½Π΅ΡΠ½Π΅Π³ΠΎ Π²ΠΈΠ΄Π° ΠΈ ΡΡΡΠ°Π½ΠΎΠ²ΠΊΠ° ΠΏΠ»Π°Π³ΠΈΠ½ΠΎΠ². Π ΡΠΊΠΎΠ²ΠΎΠ΄ΡΡΠ²ΠΎ Π΄Π»Ρ Π½Π°ΡΠΈΠ½Π°ΡΡΠΈΡ
Π‘Π΅Π³ΠΎΠ΄Π½Ρ ΡΠ°ΡΡΠΊΠ°ΠΆΡ ΠΎ ΡΠ΅Π΄Π°ΠΊΡΠΎΡΠ΅ ΠΊΠΎΠ΄Π°, ΠΊΠΎΡΠΎΡΡΠΌ ΠΏΠΎΠ»ΡΠ·ΡΡΡΡ Π΄Π»Ρ Π²Π΅ΡΡΡΠΊΠΈ ΡΠ°ΠΉΡΠΎΠ² ΡΠΆΠ΅ ΠΌΠ½ΠΎΠ³ΠΎ Π»Π΅Ρ. ΠΡΡΡΡΡΠΉ, ΡΠ΄ΠΎΠ±Π½ΡΠΉ ΠΈ ΠΏΠΎΠ»Π½ΠΎΡΡΡΡ Π½Π°ΡΡΡΠ°ΠΈΠ²Π°Π΅ΠΌΡΠΉ Sublime Text 3.
ΠΡ Ρ Π½ΡΠ»Ρ Π½Π°ΡΡΡΠΎΠ΅ΠΌ Π΅Π³ΠΎ Π²Π½Π΅ΡΠ½ΠΈΠΉ Π²ΠΈΠ΄, Π° ΡΠ°ΠΊΠΆΠ΅ ΠΏΡΠΈΠΌΠ΅Π½ΠΈΠΌ ΠΏΠ»Π°Π³ΠΈΠ½Ρ AutoFileName, BracketHighliter, ColorHighliter, Emmet, GotoCSSDeclaration ΠΈ Tag, ΠΊΠΎΡΠΎΡΡΠ΅ ΡΡΡΠ΅ΡΡΠ²Π΅Π½Π½ΠΎ ΠΏΠΎΠΌΠΎΠ³ΡΡ Π½Π°ΠΌ ΠΏΡΠΈ Π²Π΅ΡΡΡΠΊΠ΅ ΡΠ°ΠΉΡΠΎΠ²! ΠΡ ΡΡΠΎ ΠΆ, ΠΎΡ ΡΠ»ΠΎΠ² ΠΊ Π΄Π΅Π»Ρ!
ΠΠ½Π΅ΡΠ½ΠΈΠΉ Π²ΠΈΠ΄ ΠΏΡΠΎΠ³ΡΠ°ΠΌΠΌΡ
ΠΠ΅ΡΠ²ΡΠΌ Π΄Π΅Π»ΠΎΠΌ, ΠΏΠΎΡΠ»Π΅ ΡΡΡΠ°Π½ΠΎΠ²ΠΊΠΈ Sublime Text 3, Ρ Π½Π°ΡΡΡΠ°ΠΈΠ²Π°Ρ Π²Π½Π΅ΡΠ½ΠΈΠΉ Π²ΠΈΠ΄ ΠΏΡΠΎΠ³ΡΠ°ΠΌΠΌΡ.
ΠΠΎΠΊΠΎΠ²Π°Ρ ΠΏΠ°Π½Π΅Π»Ρ
ΠΠ»Ρ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ ΠΏΠ°Π½Π΅Π»ΠΈ ΠΏΠ΅ΡΠ΅Ρ ΠΎΠ΄ΠΈΠΌ View β Side Bar β Show Open Files. Π ΡΡΠΎΠΉ ΠΏΠ°Π½Π΅Π»ΠΈ Π±ΡΠ΄ΡΡ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ°ΡΡΡΡ Π½Π°ΡΠΈ ΠΏΡΠΎΠ΅ΠΊΡΡ, ΡΠΎ Π΅ΡΡΡ ΠΏΠ°ΠΏΠΊΠΈ ΠΈ ΡΠ°ΠΉΠ»Ρ Π½Π°ΡΠ΅ΠΉ Π²Π΅ΡΡΡΠΊΠΈ. ΠΠ»Ρ Π½Π°Π³Π»ΡΠ΄Π½ΠΎΡΡΠΈ ΡΠ΅ΠΉΡΠ°Ρ Π΄ΠΎΠ±Π°Π²Π»Ρ ΠΎΠ΄ΠΈΠ½ ΠΈΠ· Π½ΠΈΡ . ΠΡΠ΅ ΡΡΠΎ ΡΠ°ΠΌ Π½ΡΠΆΠ½ΠΎ ΡΠ΄Π΅Π»Π°ΡΡ β ΡΡΠΎ ΠΏΡΠΎΡΡΠΎ ΠΏΠ΅ΡΠ΅ΡΠ°ΡΠΈΡΡ ΠΏΠ°ΠΏΠΊΡ Ρ ΠΏΡΠΎΠ΅ΠΊΡΠΎΠΌ Π½Π° Π½Π°ΡΡ ΠΏΠ°Π½Π΅Π»Ρ.
Π¦Π²Π΅ΡΠΎΠ²Π°Ρ ΡΡ Π΅ΠΌΠ°
ΠΠ°Π»Π΅Π΅ Π½Π°ΡΡΡΠ°ΠΈΠ²Π°Ρ ΡΠ²Π΅ΡΠΎΠ²ΡΡ ΡΡ Π΅ΠΌΡ ΠΏΡΠΎΠ³ΡΠ°ΠΌΠΌΡ ΠΈ ΠΊΠΎΠ΄Π°, Π΄Π»Ρ Π½Π°Π³Π»ΡΠ΄Π½ΠΎΡΡΠΈ ΠΎΡΠΊΡΠΎΡ Π»ΡΠ±ΠΎΠΉ ΡΠ°ΠΉΠ», Π½Π°ΠΏΡΠΈΠΌΠ΅Ρ, Ρ HTML ΠΊΠΎΠ΄ΠΎΠΌ. ΠΠ»Ρ ΡΡΠΎΠ³ΠΎ Π΄Π²Π° ΡΠ°Π·Π° ΠΊΠ»ΠΈΠΊΠ°Ρ Π½Π° Π½ΡΠΆΠ½ΠΎΠΌ ΡΠ°ΠΉΠ»Π΅. Π’Π΅ΠΏΠ΅ΡΡ ΠΏΠ΅ΡΠ΅Ρ ΠΎΠΆΡ Preferences β Color Scheme, ΠΎΡΠΊΡΡΠ²Π°Π΅ΡΡΡ ΠΎΠΊΠΎΡΠΊΠΎ Ρ ΡΡΡΠ°Π½ΠΎΠ²Π»Π΅Π½Π½ΡΠΌΠΈ ΡΠ²Π΅ΡΠΎΠ²ΡΠΌΠΈ ΡΠ΅ΡΠ΅Π½ΠΈΡΠΌΠΈ ΠΈ ΠΏΡΠΈ Π²ΡΠ±ΠΎΡΠ΅ ΡΠΎΠΉ ΠΈΠ»ΠΈ ΠΈΠ½ΠΎΠΉ ΡΠ΅ΠΌΡ Π²Π½Π΅ΡΠ½ΠΈΠΉ Π²ΠΈΠ΄ Π½Π°ΡΠ΅Π³ΠΎ ΠΊΠΎΠ΄Π° ΠΈ ΡΠ°ΠΌΠ° ΠΏΡΠΎΠ³ΡΠ°ΠΌΠΌΠ° Π±ΡΠ΄ΡΡ ΠΌΠ΅Π½ΡΡΡΡΡ.
ΠΠΈΡΠ½ΠΎ ΠΌΠ½Π΅ Π½Π΅ ΠΏΠΎΠ΄Ρ ΠΎΠ΄ΠΈΡ Π½ΠΈ ΠΎΠ΄ΠΈΠ½ ΠΈΠ· ΠΏΡΠ΅Π΄ΡΡΡΠ°Π½ΠΎΠ²Π»Π΅Π½Π½ΡΡ Π²Π°ΡΠΈΠ°Π½ΡΠΎΠ², ΠΏΠΎΡΡΠΎΠΌΡ Ρ ΡΡΡΠ°Π½Π°Π²Π»ΠΈΠ²Π°Ρ Π΄ΠΎΠΏΠΎΠ»Π½ΠΈΡΠ΅Π»ΡΠ½ΡΡ ΡΠ²Π΅ΡΠΎΠ²ΡΡ ΡΡ Π΅ΠΌΡ. ΠΠ³ΡΠΎΠΌΠ½ΠΎΠ΅ ΠΈΡ ΠΊΠΎΠ»ΠΈΡΠ΅ΡΡΠ²ΠΎ ΠΌΠΎΠΆΠ½ΠΎ Π½Π°ΠΉΡΠΈ ΠΈ ΠΎΠ·Π½Π°ΠΊΠΎΠΌΠΈΡΡΡΡ Π½Π° ΡΠ°ΠΉΡΠ΅ Ρ Π΄ΠΎΠΏΠΎΠ»Π½Π΅Π½ΠΈΡΠΌΠΈ ΠΊ Sublime packagecontrol.io. Π― ΡΠΆΠ΅ Π·Π½Π°Ρ ΠΊΠ°ΠΊΡΡ ΠΈΠΌΠ΅Π½Π½ΠΎ Ρ ΡΡ Π΅ΠΌΡ Ρ ΠΎΡΡ ΡΡΡΠ°Π½ΠΎΠ²ΠΈΡΡ, ΡΡΠΎ ΡΠ΅ΠΉΡΠ°Ρ ΠΈ ΡΠ΄Π΅Π»Π°Ρ.
ΠΠ»Ρ ΡΠΎΠ³ΠΎ ΡΡΠΎ ΡΡΡΠ°Π½Π°Π²Π»ΠΈΠ²Π°ΡΡ Π½ΠΎΠ²ΡΠ΅ ΡΠ²Π΅ΡΠΎΠ²ΡΠ΅ ΡΡ Π΅ΠΌΡ, ΠΏΠ»Π°Π³ΠΈΠ½Ρ ΠΈ ΠΏΡΠΎΡΠΈΠ΅ Π΄ΠΎΠΏΠΎΠ»Π½Π΅Π½ΠΈΡ, ΠΌΠ½Π΅ Π½ΡΠΆΠ½ΠΎ ΡΠΏΠ΅ΡΠ²Π° ΡΡΡΠ°Π½ΠΎΠ²ΠΈΡΡ ΡΡΡΠ°Π½ΠΎΠ²ΡΠΈΠΊ ΡΡΠΈΡ Π΄ΠΎΠΏΠΎΠ»Π½Π΅Π½ΠΈΠΉ. ΠΠ²ΡΡΠΈΡ ΡΠ»ΠΎΠΆΠ½ΠΎ, Π½ΠΎ Π½Π° Π΄Π΅Π»Π΅ Π²ΡΠ΅ Π³ΠΎΡΠ°Π·Π΄ΠΎ ΠΏΡΠΎΡΠ΅.
ΠΠ΅ΡΠ΅Ρ ΠΎΠΆΡ Π² ΠΌΠ΅Π½Ρ Tools β Command Palette, Π»ΠΈΠ±ΠΎ Π½Π°ΠΆΠΈΠΌΠ°Ρ Ctrl+Shift+P. ΠΡΠΊΡΡΠ²Π°Π΅ΡΡΡ Π²ΠΎΡ ΡΠ°ΠΊΠΎΠ΅ ΠΎΠΊΠ½ΠΎ Ρ ΠΏΠΎΠΈΡΠΊΠΎΠΌ, Π² ΠΏΠΎΠ»Π΅ ΠΏΠΎΠΈΡΠΊΠ° Π²Π²ΠΎΠΆΡ install ΠΏΠΎΠΊΠ° Π½Π΅ ΡΠ²ΠΈΠΆΡ ΠΏΡΠ½ΠΊΡ Install Package Control, ΠΈ Π½Π°ΠΆΠΈΠΌΠ°Ρ Π½Π° Π½Π΅Π³ΠΎ. Π‘ΠΏΡΡΡΡ Π½Π΅ΡΠΊΠΎΠ»ΡΠΊΠΎ ΡΠ΅ΠΊΡΠ½Π΄ ΠΏΠΎΠ»ΡΡΠ°Ρ ΡΠΎΠΎΠ±ΡΠ΅Π½ΠΈΠ΅ ΠΎ ΡΠΎΠΌ, ΡΡΠΎ Package Control ΡΡΠΏΠ΅ΡΠ½ΠΎ ΡΡΡΠ°Π½ΠΎΠ²Π»Π΅Π½. Π’Π΅ΠΏΠ΅ΡΡ Ρ ΠΌΠΎΠ³Ρ ΠΏΡΠΈΡΡΡΠΏΠΈΡΡ ΠΊ ΡΡΡΠ°Π½ΠΎΠ²ΠΊΠ΅ Π½ΡΠΆΠ½ΠΎΠΉ ΡΠ²Π΅ΡΠΎΠ²ΠΎΠΉ ΡΡ Π΅ΠΌΡ.
ΠΠ»Ρ ΡΡΠΎΠ³ΠΎ ΠΎΠΏΡΡΡ Π²ΡΠ·ΡΠ²Π°Ρ Command Palette Π·Π°ΠΆΠΈΠΌΠ°Ρ Ctrl+Shift+P, Π² ΠΏΠΎΠ»Π΅ ΠΏΠΎΠΈΡΠΊΠ° ΠΎΠΏΡΡΡ Π²Π²ΠΎΠΆΡ install ΠΏΠΎΠΊΠ° Π½Π΅ ΡΠ²ΠΈΠΆΡ ΠΏΡΠ½ΠΊΡ Package Control: Install Package (ΡΡΡΠ°Π½ΠΎΠ²ΠΈΡΡ ΠΏΠ°ΠΊΠ΅Ρ Π΄ΠΎΠΏΠΎΠ»Π½Π΅Π½ΠΈΡ) Π½Π°ΠΆΠΈΠΌΠ°Ρ Π½Π° Π½Π΅Π³ΠΎ. ΠΠ΅ΠΌΠ½ΠΎΠ³ΠΎ ΠΏΠΎΠ΄ΠΎΠΆΠ΄Π°Π² Π²ΠΈΠΆΡ ΠΎΠΊΠ½ΠΎ ΡΠΎ ΡΠΏΠΈΡΠΊΠΎΠΌ Π²ΡΠ΅Ρ Π΄ΠΎΡΡΡΠΏΠ½ΡΡ Π΄ΠΎΠΏΠΎΠ»Π½Π΅Π½ΠΈΠΉ ΠΊ Sublime. ΠΡ, ΠΏΠΎΡΡΠΈ Π²ΡΠ΅Ρ .
Π ΠΏΠΎΠ»Π΅ ΠΏΠΎΠΈΡΠΊΠ° Π²Π²ΠΎΠΆΡ Π½Π°Π·Π²Π°Π½ΠΈΠ΅ ΡΠΎΠ³ΠΎ Π΄ΠΎΠΏΠΎΠ»Π½Π΅Π½ΠΈΡ, ΠΊΠΎΡΠΎΡΠΎΠ΅ Ρ ΠΎΡΡ ΡΡΡΠ°Π½ΠΎΠ²ΠΈΡΡ, Π² Π΄Π°Π½Π½ΡΠΉ ΠΌΠΎΠΌΠ΅Π½Ρ β ΡΡΠΎ ΡΠ²Π΅ΡΠΎΠ²Π°Ρ ΡΡ Π΅ΠΌΠ° ΠΏΠΎΠ΄ Π½Π°Π·Π²Π°Π½ΠΈΠ΅ΠΌ Base16 Color Schemes, ΡΠΎΡΠ½Π΅Π΅ ΡΡΠΎ ΡΠ΅Π»ΡΠΉ ΠΏΠ°ΠΊΠ΅Ρ Ρ ΠΌΠ½ΠΎΠΆΠ΅ΡΡΠ²ΠΎΠΌ ΡΠ²Π΅ΡΠΎΠ²ΡΡ ΡΡ Π΅ΠΌ. ΠΠ°ΠΆΠΈΠΌΠ°Ρ Π½Π° Π½Π°ΠΉΠ΄Π΅Π½Π½ΡΠΉ ΠΏΡΠ½ΠΊΡ ΠΈ ΠΎΠΆΠΈΠ΄Π°Ρ ΡΡΡΠ°Π½ΠΎΠ²ΠΊΠΈ. ΠΠ½Π΄ΠΈΠΊΠ°ΡΠΎΡ ΠΏΡΠΎΡΠ΅ΡΡΠ° ΡΡΡΠ°Π½ΠΎΠ²ΠΊΠΈ ΠΌΠΎΠΆΠ½ΠΎ ΡΠ²ΠΈΠ΄Π΅ΡΡ Π½Π° Π½ΠΈΠΆΠ½Π΅ΠΉ ΠΏΠ°Π½Π΅Π»ΠΈ ΠΏΡΠΎΠ³ΡΠ°ΠΌΠΌΡ. ΠΠΎΠ»ΡΡΠΈΠ² ΡΠ°ΠΌ ΠΆΠ΅ ΠΊΠΎΡΠΎΡΠΊΠΎΠ΅ ΡΠΎΠΎΠ±ΡΠ΅Π½ΠΈΠ΅ ΠΎ ΡΠΎΠΌ, ΡΡΠΎ Π²ΡΠ΅ ΡΡΡΠ°Π½ΠΎΠ²Π»Π΅Π½ΠΎ ΠΏΠ΅ΡΠ΅Ρ ΠΎΠΆΡ ΠΊ ΡΠΌΠ΅Π½Π΅ ΡΡ Π΅ΠΌΡ. ΠΠ»Ρ ΡΡΠΎΠ³ΠΎ ΠΎΡΠΊΡΡΠ²Π°Ρ ΡΠΆΠ΅ Π·Π½Π°ΠΊΠΎΠΌΡΠΉ ΠΏΡΠ½ΠΊΡ ΠΌΠ΅Π½Ρ Preferences β Color Scheme ΠΈ Π²ΠΈΠΆΡ Π² ΠΎΡΠΊΡΡΠ²ΡΠ΅ΠΌΡΡ ΠΎΠΊΠ½Π΅ ΡΠΆΠ΅ Π±ΠΎΠ»ΡΡΠΎΠ΅ ΠΌΠ½ΠΎΠΆΠ΅ΡΡΠ²ΠΎ ΡΠ°Π·Π½ΡΡ Π²Π°ΡΠΈΠ°Π½ΡΠΎΠ². ΠΠ΅Π½Ρ ΠΈΠ½ΡΠ΅ΡΠ΅ΡΡΠ΅Ρ ΡΡ Π΅ΠΌΠ° Ocean, Π²Π²ΠΎΠΆΡ Π½Π°Π·Π²Π°Π½ΠΈΠ΅ Π² ΠΏΠΎΠΈΡΠΊΠ΅, ΠΈΡ ΡΡΡ Π΅ΡΡΡ Π΄Π²Π΅: ΠΎΠ΄Π½Π° Π±ΠΎΠ»Π΅Π΅ ΠΊΠΎΠ½ΡΡΠ°ΡΡΠ½Π΅ΠΉ Π΄ΡΡΠ³ΠΎΠΉ.
ΠΠΎΡ Π»ΡΠ±ΠΈΠΌΠ°Ρ ΡΠ²Π΅ΡΠΎΠ²Π°Ρ ΡΡ Π΅ΠΌΠ° ΡΡΡΠ°Π½ΠΎΠ²Π»Π΅Π½Π°, ΡΡ ΠΊΠΎΠ½Π΅ΡΠ½ΠΎ ΠΆΠ΅ ΠΌΠΎΠΆΠ΅ΡΡ Π²ΡΠ±ΡΠ°ΡΡ ΡΠ΅Π±Π΅ Π»ΡΠ±ΡΡ Π΄ΡΡΠ³ΡΡ.
ΠΠ±ΡΠΈΠΉ Π²ΠΈΠ΄ ΠΏΡΠΎΠ³ΡΠ°ΠΌΠΌΡ ΠΌΠ½Π΅ Π±ΠΎΠ»ΡΡΠ΅ Π½ΡΠ°Π²ΠΈΡΡΡ ΡΠ΅ΠΌΠ½ΡΠΉ, ΠΏΠΎΡΡΠΎΠΌΡ ΠΏΠ΅ΡΠ΅Ρ ΠΎΠΆΡ Preferences β Theme, ΠΈ ΠΏΠ΅ΡΠ΅ΠΊΠ»ΡΡΠ°ΡΡΡ Π½Π° Adaptive.sublime-theme
Π‘ΠΎΡΠ΅ΡΠ°Π½ΠΈΠ΅ ΡΠ²Π΅ΡΠΎΠ² ΠΎΡΠ΅Π½Ρ Π²Π°ΠΆΠ½ΠΎ Π΄Π»Ρ ΡΠ°Π±ΠΎΡΡ Ρ ΠΊΠΎΠ΄ΠΎΠΌ, ΡΠ°ΠΊ ΠΊΠ°ΠΊ ΡΡΠΎ Π²Π»ΠΈΡΠ΅Ρ Π½Π΅ ΡΠΎΠ»ΡΠΊΠΎ Π½Π° Π²ΠΎΡΠΏΡΠΈΡΡΠΈΠ΅, Π½ΠΎ ΠΈ Π½Π° ΡΡΡΠ°Π»ΠΎΡΡΡ ΠΈ Π·Π΄ΠΎΡΠΎΠ²ΡΠ΅ ΡΠ²ΠΎΠΈΡ Π³Π»Π°Π·. Π’Π°ΠΊ ΡΡΠΎ ΠΏΠΎΠ΄Π±Π΅ΡΠΈ ΡΠ΅Π±Π΅ ΡΠ²Π΅ΡΠΎΠ²ΡΡ ΡΡ Π΅ΠΌΡ ΡΠ°ΠΊ, ΡΡΠΎΠ±Ρ ΡΠ΅Π±Ρ Π½ΠΈΡΠ΅Π³ΠΎ Π² Π½Π΅ΠΉ Π½Π΅ Π½Π°ΠΏΡΡΠ³Π°Π»ΠΎ. Π ΠΏΠΎΠΌΠ½ΠΈ ΠΏΡΠΎ ΠΏΠ΅ΡΠ΅ΡΡΠ²Ρ Π² ΡΠ°Π±ΠΎΡΠ΅!
ΠΠΎΠΏΠΎΠ»Π½ΠΈΡΠ΅Π»ΡΠ½ΡΠ΅ Π½Π°ΡΡΡΠΎΠΉΠΊΠΈ
ΠΠΎΠΏΠΎΠ»Π½ΠΈΡΠ΅Π»ΡΠ½ΠΎ ΠΏΠΎΠ²ΡΡΠΈΡΡ Π²ΠΎΡΠΏΡΠΈΡΡΠΈΠ΅ ΠΊΠΎΠ΄Π° ΠΈ ΠΊΠΎΠΌΡΠΎΡΡ ΠΏΡΠΈ ΡΠ°Π±ΠΎΡΠ΅ Ρ Π½ΠΈΠΌ ΠΌΠ½Π΅ ΠΏΠΎΠΌΠΎΠ³ΡΡ ΡΠ»Π΅Π΄ΡΡΡΠΈΠ΅ Π΄ΠΎΠΏΠΎΠ»Π½ΠΈΡΠ΅Π»ΡΠ½ΡΠ΅ Π½Π°ΡΡΡΠΎΠΉΠΊΠΈ. ΠΠ΅ΡΠ΅Ρ ΠΎΠ΄ΠΈΠΌ Preferences β Settings. ΠΡΠΊΡΡΠ²Π°Π΅ΡΡΡ ΡΠ°ΠΊΠΎΠ΅ ΠΎΠΊΠ½ΠΎ ΡΠ°Π·Π΄Π΅Π»Π΅Π½Π½ΠΎΠ΅ Π½Π° Π΄Π²Π΅ ΡΠ°ΡΡΠΈ. Π Π»Π΅Π²ΠΎΠΉ ΡΠ°ΡΡΠΈ Π½Π°ΡΡΡΠΎΠΉΠΊΠΈ ΠΏΠΎ ΡΠΌΠΎΠ»ΡΠ°Π½ΠΈΡ, ΠΈΡ ΠΈΠ·ΠΌΠ΅Π½ΠΈΡΡ Π½Π΅Π»ΡΠ·Ρ, Π° Π²ΠΎΡ Π² ΠΏΡΠ°Π²ΠΎΠΉ ΡΠ°ΡΡΠΈ ΡΡ ΠΌΠΎΠΆΠ΅ΡΡ ΡΡΠΈ Π½Π°ΡΡΡΠΎΠΉΠΊΠΈ ΠΏΠ΅ΡΠ΅Π½Π°Π·Π½Π°ΡΠΈΡΡ, ΠΊΠ°ΠΆΠ΄Π°Ρ ΡΠ»Π΅Π΄ΡΡΡΠ°Ρ Π΄ΠΎΠ»ΠΆΠ½Π° ΠΈΠ΄ΡΠΈ ΡΠ΅ΡΠ΅Π· Π·Π°ΠΏΡΡΡΡ. ΠΠΎΡ ΠΊΠ°ΠΊΠΈΠ΅ Π½Π°ΡΡΡΠΎΠΉΠΊΠΈ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΡ Ρ:
ΠΠΎΡΡΠ½Ρ ΠΊΠ°ΠΆΠ΄ΡΡ Π½Π°ΡΡΡΠΎΠΉΠΊΡ.
Π£Π±ΠΈΡΠ°Π΅Ρ ΡΡΡΠ°Π½Π½ΡΠ΅ ΠΎΡΡΡΡΠΏΡ Π² ΠΏΡΠΎΠ³ΡΠ°ΠΌΠΌΠ΅ ΠΌΠ΅ΠΆΠ΄Ρ ΠΊΠΎΠ΄ΠΎΠΌ ΠΈ Π±ΠΎΠΊΠΎΠ²ΠΎΠΉ ΠΏΠ°Π½Π΅Π»ΡΡ, ΡΡΠΎ Π΄Π΅Π»Π°Π΅Ρ ΠΎΠ±ΡΡΡ ΠΊΠ°ΡΡΠΈΠ½Ρ Π±ΠΎΠ»Π΅Π΅ ΠΊΠΎΠΌΠΏΠ°ΠΊΡΠ½ΠΎΠΉ.
ΠΡΡΡΠ°Π²Π»ΡΠ΅Ρ ΡΠ°Π·ΠΌΠ΅Ρ ΡΡΠΈΡΡΠ° ΠΏΠΎ ΡΠΌΠΎΠ»ΡΠ°Π½ΠΈΡ.Π’Π°ΠΊΠΆΠ΅ Π±ΡΡΡΡΠΎ ΠΈΠ·ΠΌΠ΅Π½ΠΈΡΡ ΡΠ°Π·ΠΌΠ΅Ρ ΡΡΠΈΡΡΠ°, ΡΠ°Π±ΠΎΡΠ°Ρ Ρ ΠΊΠΎΠ΄ΠΎΠΌ, ΠΌΠΎΠΆΠ½ΠΎ Π·Π°ΠΆΠ°Π² ΠΊΠΎΠ½ΡΡΠΎΠ» ΠΈ ΠΏΠΎΠΊΡΡΡΠΈΠ² ΠΊΠΎΠ»Π΅ΡΠΎ ΠΌΡΡΠΈ.
ΠΡΠ»ΠΈ ΡΡ Π²Π΄ΡΡΠ³ ΡΠ°Π·ΠΌΠ΅Ρ ΠΈΠ·ΠΌΠ΅Π½ΠΈΠ» ΡΠ»ΡΡΠ°ΠΉΠ½ΠΎ, ΡΠΎ ΡΠ±ΡΠΎΡΠΈΡΡ Π΅Π³ΠΎ ΠΌΠΎΠΆΠ½ΠΎ ΠΏΠ΅ΡΠ΅ΠΉΠ΄Ρ Π² Preferences β Font β Reset
ΠΡΠΈ Π»ΠΈΠ½ΠΈΠΈ ΠΎΡΠ΅Π½Ρ ΠΏΠΎΠ»Π΅Π·Π½Ρ Π΄Π»Ρ Π½ΠΎΠ²ΠΈΡΠΊΠ°, ΠΏΠΎΡΠΎΠΌΡ ΡΡΠΎ Π²ΠΈΠ·ΡΠ°Π»ΡΠ½ΠΎ ΡΠΎΠ΅Π΄ΠΈΠ½ΡΡΡ ΠΎΡΠΊΡΡΠ²Π°ΡΡΠΈΠΉ ΠΈ Π·Π°ΠΊΡΡΠ²Π°ΡΡΠΈΠΉ ΡΠ»Π΅ΠΌΠ΅Π½Ρ, ΡΡΠΎ ΡΡΡΠ΅ΡΡΠ²Π΅Π½Π½ΠΎ ΠΏΠΎΠΌΠΎΠ³Π°Π΅Ρ Π² ΠΎΡΠΈΠ΅Π½ΡΠ°ΡΠΈΠΈ Π² ΠΊΠΎΠ΄Π΅.
ΠΠΈΡΠ½ΠΎ Ρ ΠΎΡΠΊΠ»ΡΡΠ°Ρ ΠΈΡ (false) ΠΏΠΎ Π΄Π²ΡΠΌ ΠΏΡΠΈΡΠΈΠ½Π°ΠΌ. ΠΠ΅ΡΠ²Π°Ρ β Ρ ΡΠΆΠ΅ Π½Π΅ Π½ΠΎΠ²ΠΈΡΠΎΠΊ ΠΈ Π±Π΅Π· Π½ΠΈΡ Π½Π΅ΠΏΠ»ΠΎΡ ΠΎ ΡΠΏΡΠ°Π²Π»ΡΡΡΡ, Π²ΡΠΎΡΠ°Ρ ΠΏΡΠΈΡΠΈΠ½Π° β ΡΡΠΎ ΡΠ»Π΅Π΄ΡΡΡΠ°Ρ Π½Π°ΡΡΡΠΎΠΉΠΊΠ°.
ΠΡΠΎΠ±ΡΠ°ΠΆΠ°Π΅Ρ Π½Π΅Π²ΠΈΠ΄ΠΈΠΌΡΠ΅ ΡΠ°Π±ΡΠ»ΡΡΠΈΠΈ ΠΈ ΠΏΡΠΎΠ±Π΅Π»Ρ. Π’ΠΎ Π΅ΡΡΡ ΡΡΠΎ Π½Π΅ ΡΠ°ΡΡΡ ΠΊΠΎΠ΄Π°, Π° ΠΏΡΠΎΡΡΠΎ ΡΠ°Π·ΠΌΠ΅ΡΠΊΠ° Π΄Π»Ρ ΡΠ΄ΠΎΠ±ΡΡΠ²Π° ΡΠ°Π±ΠΎΡΡ. Π Π²ΠΎΡ, Π΅ΡΠ»ΠΈ Π²ΠΊΠ»ΡΡΠΈΡΡ ΠΈ draw_indent_guides ΠΈ draw_white_space ΡΠΎ ΠΏΠΎΠ»ΡΡΠ°ΡΠ΅ΡΡ ΠΊΠ°ΡΠΈΡΠ° ΠΊΠΎΡΠΎΡΠ°Ρ Π»ΠΈΡΠ½ΠΎ ΠΌΠ΅Π½Ρ Π½Π°ΠΏΡΡΠ³Π°Π΅Ρ. Π§ΡΠΎ ΠΈΠ· ΡΡΠΎΠ³ΠΎ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΡ, Π° ΡΡΠΎ Π½Π΅Ρ β ΡΠ΅ΡΠ°ΡΡ ΡΠ΅Π±Π΅.
Π Π°Π·ΠΌΠ΅Ρ ΡΠΈΡΠΈΠ½Ρ Π»ΠΈΠ½ΠΈΠΈ ΠΎΡΡΡΡΠΏΠ° ΠΏΡΠΈ Π½Π°ΠΆΠ°ΡΠΈΠΈ Tab. ΠΠΈΡΠ½ΠΎ ΠΌΠ½Π΅ Π½ΡΠ°Π²ΠΈΡΡΡ 3ΠΉ ΡΠ°Π·ΠΌΠ΅Ρ π
ΠΠ°ΠΏΡΠΈΠΌΠ΅Ρ ΠΌΡ ΡΠ°Π±ΠΎΡΠ°Π»ΠΈ ΡΠ°Π±ΠΎΡΠ°Π»ΠΈ, Π° ΠΏΠΎΡΠΎΠΌ Π½Π΅ΠΎΠΆΠΈΠ΄Π°Π½Π½ΠΎ Π·Π°ΠΊΡΡΠ»ΠΈ ΠΏΡΠΎΠ³ΡΠ°ΠΌΠΌΡ π ΠΡΠ²Π°Π΅Ρ ΡΠ°ΠΊΠΎΠ΅? Π£ ΠΌΠ΅Π½Ρ ΠΏΠΎΡΡΠΎΡΠ½Π½ΠΎ, ΡΠ°ΠΊ Π²ΠΎΡ ΡΡΠ° Π½Π°ΡΡΡΠΎΠΉΠΊΠ° Π²ΠΊΠ»ΡΡΠ°Π΅Ρ Β«ΠΏΠ°ΠΌΡΡΡΒ» Ρ Sublime ΠΈ ΠΏΡΠΈ ΡΠ»Π΅Π΄ΡΡΡΠ΅ΠΌ ΠΎΡΠΊΡΡΡΠΈΠΈ ΠΏΡΠΎΠ³ΡΠ°ΠΌΠΌΡ ΠΎΡΠΊΡΠΎΡΡΡΡ ΠΈ Π²ΡΠ΅ ΠΏΠΎΡΠ»Π΅Π΄Π½ΠΈΠ΅ ΡΠ°ΠΉΠ»Ρ. Π Π΄Π°, ΠΏΠ°ΠΌΡΡΡ ΡΠ°Π±ΠΎΡΠ°Π΅Ρ ΠΈ ΠΏΠΎΡΠ»Π΅ ΠΏΠ΅ΡΠ΅Π·Π°Π³ΡΡΠ·ΠΊΠΈ ΠΊΠΎΠΌΠΏΠ°.
Π Π°Π·Π΄Π΅Π»Π΅Π½ΠΈΠ΅ ΡΠ°Π±ΠΎΡΠ΅Π³ΠΎ ΠΎΠΊΠ½Π°
ΠΡΠ΅ Π±ΠΎΠ»Π΅Π΅ ΡΠ»ΡΡΡΠΈΡΡ Π²ΠΎΡΠΏΡΠΈΡΡΠΈΠ΅ ΠΊΠΎΠ΄Π° ΠΈ ΡΡΠΊΠΎΡΠΈΡΡ ΠΏΡΠΎΡΠ΅ΡΡ Π²Π΅ΡΡΡΠΊΠΈ Π½Π°ΠΌ ΠΏΠΎΠΌΠΎΠΆΠ΅Ρ ΡΠ°Π·Π΄Π΅Π»Π΅Π½ΠΈΠ΅ ΡΠ°Π±ΠΎΡΠ΅Π³ΠΎ ΠΎΠΊΠ½Π°.
ΠΠΎΡΠΊΠΎΠ»ΡΠΊΡ ΠΏΡΠ°ΠΊΡΠΈΡΠ΅ΡΠΊΠΈ Π²ΡΠ΅Π³Π΄Π° ΠΏΡΠΈΡ ΠΎΠ΄ΠΈΡΡΡ ΡΠ°Π±ΠΎΡΠ°ΡΡ Ρ Π½Π΅ΡΠΊΠΎΠ»ΡΠΊΠΈΠΌΠΈ ΡΠ°Π·Π½ΡΠΌΠΈ ΡΠ°ΠΉΠ»Π°ΠΌΠΈ, Π½Π°ΠΏΡΠΈΠΌΠ΅Ρ index.html style.css ΠΈ ΠΊΠ°ΠΊΠΎΠΉ-ΡΠΎ js ΡΠ°ΠΉΠ», ΡΠΎ Π΄ΠΎΠΏΠΎΠ»Π½ΠΈΡΠ΅Π»ΡΠ½ΡΠΌ ΡΠ΄ΠΎΠ±ΡΡΠ²ΠΎΠΌ Π±ΡΠ΄Π΅Ρ ΡΠ°Π·Π΄Π΅Π»Π΅Π½ΠΈΠ΅ ΠΎΠΊΠ½Π° Ρ ΠΊΠΎΠ΄ΠΎΠΌ Π½Π° ΡΠ΅ΠΊΡΠΎΡΡ. ΠΠ°ΡΠΈΠ½ΡΠΎΠ² Π½Π΅ΡΠΊΠΎΠ»ΡΠΊΠΎ. ΠΠ΅ΡΠ΅Ρ ΠΎΠ΄ΠΈΠΌ Π² View β Layout ΠΈ ΡΠΌΠΎΡΡΠΈΠΌ ΡΡΠΎ ΡΡΡ Ρ Π½Π°Ρ Π΅ΡΡΡ.
Π‘ΠΎΠΎΡΠ²Π΅ΡΡΡΠ²Π΅Π½Π½ΠΎ Single β ΡΡΠΎ Π²ΠΈΠ΄ Π±Π΅Π· ΡΠ°Π·Π΄Π΅Π»Π΅Π½ΠΈΠΉ ΠΊΠ°ΠΊ ΡΠ΅ΠΉΡΠ°Ρ, Columns: 2, 3, 4 ΡΡΠΎ ΡΠ°Π·Π±ΠΈΠ²ΠΊΠ° ΠΏΠΎ Π²Π΅ΡΡΠΈΠΊΠ°Π»ΠΈ. ΠΠ°ΠΏΡΠΈΠΌΠ΅Ρ Π½Π°ΠΆΠ°Π² Π½Π° Columns: 2 Π½Π°Ρ ΡΠΊΡΠ°Π½ Ρ ΠΊΠΎΠ΄ΠΎΠΌ ΡΠ°Π·Π΄Π΅Π»ΠΈΡΡΡ ΠΏΠΎΠΏΠΎΠ»Π°ΠΌ, ΠΈ ΠΌΡ ΠΌΠΎΠΆΠ΅ΠΌ ΡΠ°ΡΡΡ ΡΠ°ΠΉΠ»ΠΎΠ² ΠΏΠ΅ΡΠ΅ΠΌΠ΅ΡΡΠΈΡΡ Π² ΠΏΡΡΡΡΡ ΠΊΠΎΠ»ΠΎΠ½ΠΊΡ, Π½Π°ΠΏΡΠΈΠΌΠ΅Ρ CSS ΡΠ»Π΅Π²Π° HTML ΠΈ JS ΡΠΏΡΠ°Π²Π°, ΡΡΠΎ Π΄Π΅Π»Π°Π΅Ρ ΡΠ°Π±ΠΎΡΡ Π±ΠΎΠ»Π΅Π΅ Π½Π°Π³Π»ΡΠ΄Π½ΠΎΠΉ ΠΈ Π±ΡΡΡΡΠΎΠΉ.
Π’Π°ΠΊ ΠΆΠ΅ Ρ Π½Π°Ρ Π΅ΡΡΡ Π²Π°ΡΠΈΠ°Π½ΡΡ ΠΏΠΎΠ΄Π΅Π»ΠΈΡΡ ΡΠΊΡΠ°Π½ ΠΏΠΎ Π³ΠΎΡΠΈΠ·ΠΎΠ½ΡΠ°Π»ΠΈ ΡΡΠΎ Rows: 2 ΠΈ Rows: 3, Π½Π°ΠΆΠ°Π² Π½Π°ΠΏΡΠΈΠΌΠ΅Ρ Π½Π° Rows: 3 ΠΏΠΎΠ»ΡΡΠΈΠΌ ΡΡΠΈ Π³ΠΎΡΠΈΠ·ΠΎΠ½ΡΠ°Π»ΡΠ½ΡΡ ΠΎΠΊΠ½Π° ΠΈ ΠΌΠΎΠΆΠ½ΠΎ ΠΏΠ΅ΡΠ΅ΠΊΠΈΠ½ΡΡΡ JS ΡΠ°ΠΉΠ» Π² ΡΡΠ΅ΡΡΠ΅ ΠΎΠΊΠ½ΠΎ. Π ΠΏΠΎΡΠ»Π΅Π΄Π½ΠΈΠΉ Π²Π°ΡΠΈΠ°Π½Ρ ΡΡΠΎ Grid: 4 ΠΊΠΎΡΠΎΡΡΠΉ Π΄Π΅Π»ΠΈΡ ΡΠΊΡΠ°Π½ ΠΏΠΎΠΏΠΎΠ»Π°ΠΌ ΠΊΠ°ΠΊ ΠΏΠΎ Π³ΠΎΡΠΈΠ·ΠΎΠ½ΡΠ°Π»ΠΈ, ΡΠ°ΠΊ ΠΈ ΠΏΠΎ Π²Π΅ΡΡΠΈΠΊΠ°Π»ΠΈ. Π ΡΠ΅Π·ΡΠ»ΡΡΠ°ΡΠ΅ ΠΏΠΎΠ»ΡΡΠ°ΡΡΡΡ ΡΠ΅ΡΡΡΠ΅ ΠΎΠΊΠ½Π°. ΠΠ±ΡΠ°ΡΠΈ Π²Π½ΠΈΠΌΠ°Π½ΠΈΠ΅, ΡΡΠΎ ΠΏΠ΅ΡΠ΅ΠΊΠ»ΡΡΠ°ΡΡΡΡ ΠΌΠ΅ΠΆΠ΄Ρ ΡΠ΅ΠΆΠΈΠΌΠ°ΠΌΠΈ ΠΌΠΎΠΆΠ½ΠΎ ΠΈ Ρ ΠΏΠΎΠΌΠΎΡΡΡ Π³ΠΎΡΡΡΠΈΡ ΠΊΠ»Π°Π²ΠΈΡ Alt+Shift+ ΡΠΎΠΎΡΠ²Π΅ΡΡΡΠ²ΡΡΡΠ°Ρ ΡΠΈΡΡΠ°.
Π’Π°ΠΊ ΡΡΠΎ Ρ ΡΠ΅Π±Ρ Π΅ΡΡΡ ΡΠΈΡΠΎΠΊΠΈΠΉ Π²ΡΠ±ΠΎΡ ΠΏΠΎ Π²ΠΊΡΡΡ. Π― ΡΠ°ΡΠ΅ Π²ΡΠ΅Π³ΠΎ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΡ ΠΎΠ΄Π½ΠΎ ΡΠ°Π·Π΄Π΅Π»Π΅Π½ΠΈΠ΅ ΠΏΠΎ Π²Π΅ΡΡΠΈΠΊΠ°Π»ΠΈ.
ΠΠΎΠ΄ΡΠ²Π΅ΡΠΊΠΈ ΡΠΈΠ½ΡΠ°ΠΊΡΠΈΡΠ°
ΠΠΎΠ½Π΅ΡΠ½ΠΎΠΉ Π½Π°ΡΡΡΠΎΠΉΠΊΠΎΠΉ Π²Π½Π΅ΡΠ½Π΅Π³ΠΎ Π²ΠΈΠ΄Π° Π±ΡΠ΄Π΅Ρ Π½Π°ΡΡΡΠΎΠΉΠΊΠ° ΠΏΠΎΠ΄ΡΠ²Π΅ΡΠΊΠΈ ΡΠΈΠ½ΡΠ°ΠΊΡΠΈΡΠ°. Π‘Π»ΠΎΠ²ΠΎ ΡΡΡΠ°ΡΠ½ΠΎΠ΅, ΠΎΠ΄Π½Π°ΠΊΠΎ Π½Π° Π΄Π΅Π»Π΅ Π²ΡΠ΅ ΠΏΡΠΎΡΡΠΎ.
ΠΠΎΠ΄ΡΠ²Π΅ΡΠΊΠΈ ΡΠΈΠ½ΡΠ°ΠΊΡΠΈΡΠ° β ΡΡΠΎ ΠΎΡΠΎΠ±ΠΎΠ΅ ΠΎΠΊΡΠ°ΡΠΈΠ²Π°Π½ΠΈΠ΅ ΡΠ²Π΅ΡΠΎΠΌ ΡΠΎΠ³ΠΎ ΠΈΠ»ΠΈ ΠΈΠ½ΠΎΠ³ΠΎ Π΅Π»Π΅ΠΌΠ΅Π½ΡΠ° Π² ΠΊΠΎΠ΄Π΅. ΠΠ°ΠΏΡΠΈΠΌΠ΅Ρ, Π² ΡΡΠΎΠΉ ΡΠ²Π΅ΡΠΎΠ²ΠΎΠΉ ΡΡ Π΅ΠΌΠ΅ Π² HTML ΡΠ°ΠΉΠ»Π΅ ΠΊΡΠ°cΠ½ΡΠΌ Π²ΡΠ΄Π΅Π»Π΅Π½ ΡΠ΅Π³, Π·Π΅Π»Π΅Π½ΡΠΌ β Π½Π°Π·Π²Π°Π½ΠΈΠ΅ ΠΊΠ»Π°ΡΡΠ°, Π±Π΅Π»ΡΠΌ β ΡΠ΅ΠΊΡΡ ΠΈ ΡΠ°ΠΊ Π΄Π°Π»Π΅Π΅. ΠΡΠΎ Π΄Π΅Π»Π°Π΅Ρ Π²ΠΎΡΠΏΡΠΈΡΡΠΈΠ΅ ΠΊΠΎΠ΄Π° Π½Π°ΠΌΠ½ΠΎΠ³ΠΎ ΠΏΠΎΠ½ΡΡΠ½Π΅Π΅. ΠΠ±ΡΠ°ΡΠΈ Π²Π½ΠΈΠΌΠ°Π½ΠΈΠ΅ Π½Π° ΠΏΡΠ°Π²ΡΠΉ Π½ΠΈΠΆΠ½ΠΈΠΉ ΡΠ³ΠΎΠ» ΠΎΠΊΠ½Π° ΠΏΡΠΎΠ³ΡΠ°ΠΌΠΌΡ, Π² Π·Π°Π²ΠΈΡΠΈΠΌΠΎΡΡΠΈ ΠΎΡ ΡΠΎΠ³ΠΎ ΠΊΠ°ΠΊ ΠΊΠΎΠΉ ΡΠ°ΠΉΠ» Ρ Π½Π°Ρ ΡΠ΅ΠΉΡΠ°Ρ Π°ΠΊΡΠΈΠ²Π΅Π½, CSS HTML JS ΠΈ ΡΠ°ΠΊ Π΄Π°Π»Π΅Π΅ ΠΏΡΠΎΠΈΡΡ ΠΎΠ΄ΠΈΡ ΠΏΠ΅ΡΠ΅ΠΊΠ»ΡΡΠ΅Π½ΠΈΠ΅ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ ΠΊΠΎΠ΄Π° ΡΡΠΎΠ³ΠΎ ΠΊΠΎΠ½ΠΊΡΠ΅ΡΠ½ΠΎΠ³ΠΎ ΡΠ°ΠΉΠ»Π°.
ΠΠ°ΡΠ΅ΠΌ ΠΆΠ΅ ΡΡΡ ΡΡΠΎ-ΡΠΎ Π΄Π΅Π»Π°ΡΡ Π΅ΡΠ»ΠΈ Π²ΡΠ΅ ΠΈ ΡΠ°ΠΊ ΠΎΡΠ»ΠΈΡΠ½ΠΎ ΡΠ°Π±ΠΎΡΠ°Π΅Ρ? ΠΠ΅Π»ΠΎ Π² ΡΠΎΠΌ ΡΡΠΎ Π² Π½Π°ΡΠ°Π»ΡΠ½ΠΎΠΌ ΠΏΠ°ΠΊΠ΅ΡΠ΅ Sublime ΡΡΡΠ°Π½ΠΎΠ²Π»Π΅Π½Ρ ΠΏΠ°ΠΊΠ΅ΡΡ ΠΏΠΎΠ΄ΡΠ²Π΅ΡΠΊΠΈ ΡΠΈΠ½ΡΠ°ΠΊΡΠΈΡΠ° Π΄Π°Π»Π΅ΠΊΠΎ Π½Π΅ Π΄Π»Ρ Π²ΡΠ΅Ρ ΡΠΎΡΠΌΠ°ΡΠΎΠ².
ΠΠ°ΠΏΡΠΈΠΌΠ΅Ρ, Π² Π΄Π°Π»ΡΠ½Π΅ΠΉΡΠ΅ΠΌ Ρ ΠΏΠ»Π°Π½ΠΈΡΡΡ ΡΠ°Π±ΠΎΡΠ°ΡΡ Ρ ΡΠ°ΠΉΠ»Π°ΠΌΠΈ SCSS, ΠΎΡΠΊΡΡΠ² Π΅Π³ΠΎ Ρ ΡΠ²ΠΈΠΆΡ ΡΠΏΠ»ΠΎΡΠ½ΡΡ ΠΏΡΠΎΡΡΡΠ½Ρ ΠΈΠ· Π½Π°Π±ΠΎΡΠ° Π±Π΅Π»ΡΡ ΡΠΈΠΌΠ²ΠΎΠ»ΠΎΠ². ΠΠ΅ ΠΎΡΠ΅Π½Ρ ΡΠ΄ΠΎΠ±Π½ΠΎ, ΠΏΡΠ°Π²Π΄Π°?
Π’Π°ΠΊ Π²ΠΎΡ, Π² ΡΠ°ΠΊΠΈΡ ΡΠ»ΡΡΠ°ΡΡ Ρ Π΄ΠΎΠΏΠΎΠ»Π½ΠΈΡΠ΅Π»ΡΠ½ΠΎ ΡΡΡΠ°Π½Π°Π²Π»ΠΈΠ²Π°Ρ Π½ΡΠΆΠ½ΡΠΉ ΠΏΠ°ΠΊΠ΅Ρ.
ΠΡΠΊΡΡΠ²Π°Π΅ΠΌ Π½Π°Ρ ΠΏΡΠΈΠ²ΡΡΠ½ΡΠΉ CommΠ°nd Palette ΠΏΠ΅ΡΠ΅ΠΉΠ΄Ρ Tools β Command Palette, Π»ΠΈΠ±ΠΎ Π½Π°ΠΆΠΈΠΌΠ°Π΅ΠΌ Ctrl+Shift+P Π½Π°Π±ΠΈΡΠ°Π΅ΠΌ install, ΠΆΠΌΠ΅ΠΌ Install Package Control ΠΈ ΠΈΡΠ΅ΠΌ Π΄ΠΎΠΏΠΎΠ»Π½Π΅Π½ΠΈΠ΅ SCSS. ΠΠ°ΠΆΠΈΠΌΠ°Π΅ΠΌ Π½Π° Π½Π΅Π³ΠΎ, ΠΏΠΎΡΠ»Π΅ ΡΡΡΠ°Π½ΠΎΠ²ΠΊΠΈ ΠΌΡ ΠΌΠΎΠΆΠ΅ΠΌ ΠΏΠ΅ΡΠ΅ΠΊΠ»ΡΡΠΈΡΡ Π½Π°ΡΠ΅ ΠΎΡΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΠ΅ Π½Π° SCSS. Π‘Π΅ΠΉΡΠ°Ρ Π²ΡΠ΅ Π²ΡΠ³Π»ΡΠ΄ΠΈΡ ΡΠΈΠΌΠΏΠ°ΡΠΈΡΠ½Π΅Π΅, Π½Π΅ ΡΠ°ΠΊ Π»ΠΈ?
ΠΠ°ΡΡΡΠΎΠΉΠΊΠ° Π²Π½Π΅ΡΠ½Π΅Π³ΠΎ Π²ΠΈΠ΄Π° ΡΠ΅Π΄Π°ΠΊΡΠΎΡΠ° Π²Π°ΠΆΠ½Π°, ΡΠ°ΠΊ ΠΊΠ°ΠΊ ΠΌΡ Π΄ΠΎΠ²ΠΎΠ»ΡΠ½ΠΎ Π΄Π»ΠΈΡΠ΅Π»ΡΠ½ΠΎΠ΅ Π²ΡΠ΅ΠΌΡ ΠΏΡΠΎΠ²ΠΎΠ΄ΠΈΠΌ Π·Π° Π½Π°ΠΏΠΈΡΠ°Π½ΠΈΠ΅ΠΌ ΠΊΠΎΠ΄Π°. ΠΡΠΎ Π²Π»ΠΈΡΠ΅Ρ Π½Π° Π½Π°ΡΡ ΡΡΡΠ°Π»ΠΎΡΡΡ, ΠΏΡΠΎΠ΄ΡΠΊΡΠΈΠ²Π½ΠΎΡΡΡ, Π·Π΄ΠΎΡΠΎΠ²ΡΠ΅ Π΄Π° ΠΈ ΠΏΡΠΎΡΡΠΎ Π½Π° Π½Π°ΡΡΡΠΎΠ΅Π½ΠΈΠ΅.
Π‘Π»Π΅Π΄ΡΡΡΠ΅Π΅, ΡΡΠΎ ΠΌΡ ΡΠ΄Π΅Π»Π°Π΅ΠΌ ΡΡΠΎ ΡΡΡΠ°Π½ΠΎΠ²ΠΈΠΌ ΡΡΠ΄ ΠΏΠ»Π°Π³ΠΈΠ½ΠΎΠ² ΠΈ Π΄ΠΎΠΏΠΎΠ»Π½Π΅Π½ΠΈΠΉ. ΠΡ ΡΡΡΠ΅ΡΡΠ²ΡΠ΅Ρ ΠΎΠ³ΡΠΎΠΌΠ½ΠΎΠ΅ ΠΊΠΎΠ»ΠΈΡΠ΅ΡΡΠ²ΠΎ, Π° Ρ ΡΠ°ΡΡΠΊΠ°ΠΆΡ ΠΏΡΠΎ ΠΎΡΠ½ΠΎΠ²Π½ΡΠ΅, ΠΊΠΎΡΠΎΡΡΠ΅ Π°ΠΊΡΠΈΠ²Π½ΠΎ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΡ ΡΠ°ΠΌ ΠΈ ΠΊΠΎΡΠΎΡΡΠ΅ Π² ΡΠ°Π·Ρ ΡΡΠΊΠΎΡΡΡ Π²Π΅ΡΡ ΠΏΡΠΎΡΠ΅ΡΡ Π²Π΅ΡΡΡΠΊΠΈ. ΠΡΠΈΡΡΡΠΏΠΈΠΌ!
ΠΠ»Π°Π³ΠΈΠ½Ρ
AutoFileName
ΠΠ΅Π»ΠΎ Π² ΡΠΎΠΌ, ΡΡΠΎ Π² ΠΏΡΠΎΡΠ΅ΡΡΠ΅ Π²Π΅ΡΡΡΠΊΠΈ ΡΠ°ΡΡΠΎ ΠΏΡΠΈΡ ΠΎΠ΄ΠΈΡΡΡ ΠΏΠΎΠ΄ΠΊΠ»ΡΡΠ°ΡΡ ΡΠ°Π·Π»ΠΈΡΠ½ΡΠ΅ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠΈ. ΠΡΠΎΡ ΠΏΠ»Π°Π³ΠΈΠ½ Π² ΡΠ°Π·Ρ ΠΎΠ±Π»Π΅Π³ΡΠ°Π΅Ρ ΠΏΡΠΎΡΠ΅ΡΡ ΠΏΠΎΠ΄ΠΊΠ»ΡΡΠ΅Π½ΠΈΡ. Π£ΡΡΠ°Π½ΠΎΠ²ΠΈΠΌ Π΅Π³ΠΎ. ΠΠ°ΠΆΠΈΠΌΠ°Π΅ΠΌ Ctrl+Shift+P Π΄Π°Π»Π΅Π΅ Install Package Control ΠΈΡΠ΅ΠΌ AutoFileName ΡΡΡΠ°Π½Π°Π²Π»ΠΈΠ²Π°Π΅ΠΌ. ΠΠΎΠΏΡΠΎΠ±ΡΠ΅ΠΌ ΠΏΠΎΠ΄ΠΊΠ»ΡΡΠΈΡΡ ΠΊΠ°ΡΡΠΈΠ½ΠΊΡ ΡΠ΅ΠΉΡΠ°Ρ. Π‘ΡΠ°Π·Ρ Π·Π°ΠΌΠ΅ΡΠ°Π΅ΠΌ ΠΏΠΎΡΠ²Π»Π΅Π½ΠΈΠ΅ Π²ΡΠΏΠ°Π΄Π°ΡΡΠ΅Π³ΠΎ ΠΌΠ΅Π½Ρ ΡΠΎ ΡΠΏΠΈΡΠΊΠΎΠΌ Π»ΠΎΠΊΠ°Π»ΡΠ½ΡΡ ΡΠ°ΠΉΠ»ΠΎΠ². ΠΠ΅ΡΠ΅Ρ ΠΎΠ΄ΠΈΠΌ Π² Π½ΡΠΆΠ½ΡΡ ΠΏΠ°ΠΏΠΊΡ Ρ ΠΊΠ°ΡΡΠΈΠ½ΠΊΠ°ΠΌΠΈ ΠΈ Π²ΠΈΠ΄ΠΈΠΌ ΡΡΡ Π½ΡΠΆΠ½ΡΠΉ Π½Π°ΠΌ ΡΠ°ΠΉΠ», Π° ΡΠ°ΠΊΠΆΠ΅ Π΅Π³ΠΎ ΡΠ°Π·ΠΌΠ΅ΡΡ, ΡΡΠΎ ΡΠΎΠΆΠ΅ ΠΏΡΠΈΠ³ΠΎΠ΄ΠΈΡΡΡ.
BracketHighliter
BracketHighliter ΠΌΠΎΠΆΠ½ΠΎ ΠΏΠ΅ΡΠ΅Π²Π΅ΡΡΠΈ ΠΊΠ°ΠΊ ΠΏΠΎΠ΄ΡΠ²Π΅ΡΠΊΠ° ΠΊΠ°Π²ΡΡΠ΅ΠΊ. Π£ΡΡΠ°Π½ΠΎΠ²ΠΈΠΌ Π΅Π³ΠΎ. ΠΠ°ΠΆΠΈΠΌΠ°Π΅ΠΌ Ctrl+Shift+P, Install Package Control ΠΈΡΠ΅ΠΌ BracketHighliter. Π£ΡΡΠ°Π½Π°Π²Π»ΠΈΠ²Π°Π΅ΠΌ. Π’ΡΡ Π΄Π°ΠΆΠ΅ ΠΎΡΠΊΡΡΠ²Π°Π΅ΡΡΡ ΠΎΡΠ΄Π΅Π»ΡΠ½ΡΠΉ ΡΠ°ΠΉΠ» Ρ ΡΠΎΠΎΠ±ΡΠ΅Π½ΠΈΠ΅ΠΌ ΠΎΠ± ΡΡΠΏΠ΅ΡΠ½ΠΎΠΉ ΡΡΡΠ°Π½ΠΎΠ²ΠΊΠ΅. Π’Π΅ΠΏΠ΅ΡΡ Π² Π½Π°ΡΠ΅ΠΌ ΠΊΠΎΠ΄Π΅ Π±ΡΠ΄Π΅Ρ ΠΏΠΎΠ΄ΡΠ²Π΅ΡΠΈΠ²Π°ΡΡΡΡ Π½Π°ΡΠ°Π»ΡΠ½ΡΠΉ ΠΈ ΠΊΠΎΠ½Π΅ΡΠ½ΡΠΉ ΡΠ»Π΅ΠΌΠ΅Π½Ρ, Π½Π°ΠΏΡΠΈΠΌΠ΅Ρ ΠΎΡΠΊΡΡΠ²Π°ΡΡΠΈΠΉ ΠΈ Π·Π°ΠΊΡΡΠ²Π°ΡΡΠΈΠΉ ΡΠ΅Π³, Π½Π°ΡΠ°Π»ΡΠ½Π°Ρ ΠΈ ΠΊΠΎΠ½Π΅ΡΠ½Π°Ρ ΠΊΠΎΠ²ΡΡΠΊΠ°, ΠΎΡΠΊΡΡΠ²Π°ΡΡΠ°Ρ ΠΈ Π·Π°ΠΊΡΡΠ²Π°ΡΡΠ°Ρ ΡΠΊΠΎΠ±ΠΊΠ°. ΠΡΠΎ ΠΎΡΠ΅Π½Ρ ΠΏΠΎΠΌΠΎΠ³Π°Π΅Ρ Ρ ΠΎΡΠΈΠ΅Π½ΡΠ°ΡΠΈΠ΅ΠΉ Π² ΠΊΠΎΠ΄Π΅.
ColorHighliter
ΠΠ±ΡΠ°ΡΠΈ Π²Π½ΠΈΠΌΠ°Π½ΠΈΠ΅ Π½Π° ΡΡΠΎΡ ΠΊΠΎΠ΄ β ΡΡΠΎ ΠΊΠΎΠ΄ ΡΠ²Π΅ΡΠ°, Π½ΠΎ ΠΊΠ°ΠΊΠΎΠ³ΠΎ ΠΈΠΌΠ΅Π½Π½ΠΎ Π½Π΅ΠΏΠΎΠ½ΡΡΠ½ΠΎ.
ΠΠ°Π²Π°ΠΉ ΡΡΡΠ°Π½ΠΎΠ²ΠΈΠΌ ΠΏΠ»Π°Π³ΠΈΠ½. Ctrl+Shift+P, Install Package Control ΠΈΡΠ΅ΠΌ ColorHighliter. ΠΠΏΡΡΡ ΠΎΡΠΊΡΡΠ²Π°Π΅ΡΡΡ ΠΎΡΠ΄Π΅Π»ΡΠ½ΡΠΉ ΡΠ°ΠΉΠ» Ρ ΡΠΎΠΎΠ±ΡΠ΅Π½ΠΈΠ΅ΠΌ ΠΎΠ± ΡΡΠΏΠ΅ΡΠ½ΠΎΠΉ ΡΡΡΠ°Π½ΠΎΠ²ΠΊΠ΅. Π ΡΠΎΠΎΠ±ΡΠ΅Π½ΠΈΡ ΠΎ Π½Π΅ΠΊΠΎΠΉ ΠΎΡΠΈΠ±ΠΊΠ΅, ΠΈΠ³Π½ΠΎΡΠΈΡΡΠ΅ΠΌ ΠΈΡ . Π‘ΠΌΠΎΡΡΠΈΠΌ Π½Π° Π½Π°Ρ ΠΊΠΎΠ΄ Ρ ΡΠ²Π΅ΡΠΎΠΌ, ΠΈ ΡΠ΅ΠΏΠ΅ΡΡ Π²ΠΈΠ΄ΠΈΠΌ ΡΡΠΎ Π·Π° ΡΠ²Π΅Ρ ΡΠΊΡΡΠ²Π°Π΅ΡΡΡ Π·Π° Π±ΡΠΊΠ²Π΅Π½Π½ΠΎΡΠΈΡΡΠΎΠ²ΡΠΌ ΠΊΠΎΠ΄ΠΎΠΌ. Π‘Π°ΠΌ ΠΏΠ»Π°Π³ΠΈΠ½ ΠΌΠΎΠΆΠ½ΠΎ Π΄ΠΎΠΏΠΎΠ»Π½ΠΈΡΠ΅Π»ΡΠ½ΠΎ Π½Π°ΡΡΡΠΎΠΈΡΡ Π² ΠΌΠ΅Π½Ρ Tools β ColorHighliter Π½ΠΎ ΡΠ΅ΠΉΡΠ°Ρ Π½Π΅ Π±ΡΠ΄Π΅ΠΌ ΠΎΡΡΠ°Π½Π°Π²Π»ΠΈΠ²Π°ΡΡΡΡ Π½Π° ΡΡΠΎΠΌ. ΠΡΠ΅ ΠΈ ΡΠ°ΠΊ ΡΡΠ°Π»ΠΎ Π½Π°ΠΌΠ½ΠΎΠ³ΠΎ Π»ΡΡΡΠ΅.
ΠΠ΅Π»ΠΈΠΊΠΈΠΉ ΠΈ ΠΌΠΎΠ³ΡΡΠΈΠΉ Emmet
Π£ΡΡΠ°Π½Π°Π²Π»ΠΈΠ²Π°Π΅ΠΌ ΠΏΠΎ Π½Π°ΡΠ°Π±ΠΎΡΠ°Π½Π½ΠΎΠΉ ΡΡ Π΅ΠΌΠ΅. Ctrl+Shift+P, Install Package Control ΠΈΡΠ΅ΠΌ Emmet. ΠΡΠΊΡΡΠ²Π°Π΅ΡΡΡ ΠΎΡΠ΄Π΅Π»ΡΠ½ΡΠΉ ΡΠ°ΠΉΠ» Ρ ΡΠΎΠΎΠ±ΡΠ΅Π½ΠΈΠ΅ΠΌ Ρ ΠΏΡΠΎΡΡΠ±ΠΎΠΉ ΠΏΠ΅ΡΠ΅Π·Π°Π³ΡΡΠ·ΠΈΡΡ ΠΏΡΠΎΠ³ΡΠ°ΠΌΠΌΡ Π΄Π»Ρ ΠΎΠΊΠΎΠ½ΡΠ°Π½ΠΈΡ ΡΡΡΠ°Π½ΠΎΠ²ΠΊΠΈ. ΠΠ°ΠΊΡΡΠ²Π°Π΅ΠΌ ΠΈ ΠΎΡΠΊΡΡΠ²Π°Π΅ΠΌ Sublime. ΠΠΎΠ»ΡΡΠ°Π΅ΠΌ ΡΠΎΠΎΠ±ΡΠ΅Π½ΠΈΠ΅, ΡΡΠΎ Π²ΡΠ΅ ΡΡΡΠ°Π½ΠΎΠ²Π»Π΅Π½ΠΎ.
ΠΡΠ°ΠΊ, ΡΡΠΎ ΠΆΠ΅ ΡΠΌΠ΅Π΅Ρ Emmet?
ΠΠ΅ΡΠ΅ΠΉΠ΄Π΅ΠΌ Π² HTML ΡΠ°ΠΉΠ» ΠΈ ΠΏΠΎΠΏΡΠΎΠ±ΡΠ΅ΠΌ Π·Π°ΠΏΠΈΡΠ°ΡΡ ΡΠ΅Π³ div Ρ ΠΊΠ»Π°ΡΡΠΎΠΌ .block, Π΄Π»Ρ ΡΡΠΎΠ³ΠΎ Π½Π°ΠΌ ΡΠ΅ΠΏΠ΅ΡΡ Π΄ΠΎΡΡΠ°ΡΠΎΡΠ½ΠΎ ΠΏΠΎΡΡΠ°Π²ΠΈΡΡ ΡΠΎΡΠΊΡ, Π½Π°ΠΏΠΈΡΠ°ΡΡ «block» ΠΈ Π½Π°ΠΆΠ°ΡΡ ΠΊΠ»Π°Π²ΠΈΡΡ Tab. ΠΡ ΠΏΠΎΠ»ΡΡΠΈΠΌ:
Π§ΡΠΎΠ±Ρ ΡΠ΄Π΅Π»Π°ΡΡ Π±ΠΎΠ»Π΅Π΅ ΡΠ»ΠΎΠΆΠ½ΡΡ Π·Π°ΠΏΠΈΡΡ, Π½Π°ΠΏΡΠΈΠΌΠ΅Ρ Π² ΡΠ΅Π³ div Ρ ΠΊΠ»Π°ΡΡΠΎΠΌ .block Π²ΡΡΠ°Π²ΠΈΡΡ ΡΠ΅Π³ span ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅ΠΌ ΡΠ»Π΅Π΄ΡΡΡΡΡ Π·Π°ΠΏΠΈΡΡ:
ΠΠΌΠ΅ΠΌ ΠΊΠ»Π°Π²ΠΈΡΡ Tab ΠΈ ΠΏΠΎΠ»ΡΡΠ°Π΅ΠΌ:
ΠΠΎ ΠΈ ΡΡΠΎ Π΅ΡΠ΅ Π½Π΅ Π²ΡΠ΅, ΠΌΡ ΠΌΠΎΠΆΠ΅ΠΌ ΡΠΎΠ·Π΄Π°Π²Π°ΡΡ ΡΠ²ΠΎΠΈ ΡΠ½ΠΈΠΏΠΏΠ΅ΡΡ, ΡΠΎ Π΅ΡΡΡ ΡΠ°Π±Π»ΠΎΠ½Ρ/Π·Π°Π³ΠΎΡΠΎΠ²ΠΊΠΈ.
ΠΠ»Ρ ΡΡΠΎΠ³ΠΎ ΠΏΠ΅ΡΠ΅ΠΉΠ΄Π΅ΠΌ Preferences β Package Settings β Emmet β Settings User. ΠΠ΄Π΅ΡΡ Π·Π°ΠΏΠΈΡΠ΅ΠΌ ΡΠ»Π΅Π΄ΡΡΡΠ΅Π΅:
Π’Π΅ΠΏΠ΅ΡΡ Π΄Π»Ρ ΡΠΎΠ³ΠΎ ΡΡΠΎΠ±Ρ Π²ΡΠ·Π²Π°ΡΡ Π·Π°ΠΏΠΈΡΡ:
Π½Π°ΠΌ Π΄ΠΎΡΡΠ°ΡΠΎΡΠ½ΠΎ Π½Π°ΠΏΠΈΡΠ°ΡΡ bl ΠΈ Π½Π°ΠΆΠ°ΡΡ ΠΊΠ»Π°Π²ΠΈΡΡ Tab
ΠΠ· ΡΡΠΎΠ³ΠΎ ΡΠ»Π΅Π΄ΡΠ΅Ρ, ΡΡΠΎ Π²ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎΡΡΠΈ Emmet Π±Π΅Π·Π³ΡΠ°Π½ΠΈΡΠ½Ρ, ΠΈ ΠΌΡ ΠΌΠΎΠΆΠ΅ΠΌ Π½Π°ΡΡΡΠΎΠΈΡΡ ΡΠ²ΠΎΠΈ ΡΠ½ΠΈΠΏΠΏΠ΅ΡΡ ΠΊΠ°ΠΊ ΡΠ³ΠΎΠ΄Π½ΠΎ ΠΈ ΡΠ°Π±ΠΎΡΠ°ΡΡ ΠΎΡΠ΅Π½Ρ Π±ΡΡΡΡΠΎ. ΠΠΎΠ΄ΡΠΎΠ±Π½ΡΡ ΠΈΠ½ΡΠΎΡΠΌΠ°ΡΠΈΡ ΠΎ Π²ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎΡΡΡΡ ΠΏΠ»Π°Π³ΠΈΠ½Π° ΠΌΠΎΠΆΠ½ΠΎ Π½Π°ΠΉΡΠΈ Π½Π° ΡΠ°ΠΉΡΠ΅ https://emmet.io
GotoCSSDeclaration
ΠΠ»Π°Π³ΠΈΠ½ ΠΏΠΎΠΌΠΎΠΆΠ΅Ρ Π½Π°ΠΌ Ρ Π½Π°Π²ΠΈΠ³Π°ΡΠΈΠ΅ΠΉ Π² ΠΊΠΎΠ΄Π΅. Π£ΡΡΠ°Π½Π°Π²Π»ΠΈΠ²Π°Π΅ΠΌ ΡΠΎΠ²Π½ΠΎ ΡΠ°ΠΊ ΠΆΠ΅ ΠΊΠ°ΠΊ ΠΈ ΠΏΡΠ΅Π΄ΡΠ΄ΡΡΠΈΠ΅ ΠΏΠ»Π°Π³ΠΈΠ½Ρ. ΠΠ°Π»Π΅Π΅ Π½Π°Π·Π½Π°ΡΠΈΠΌ Π³ΠΎΡΡΡΠΈΠ΅ ΠΊΠ»Π°Π²ΠΈΡΠΈ Π΄Π»Ρ ΡΠ°Π±ΠΎΡΡ Ρ ΠΏΠ»Π°Π³ΠΈΠ½ΠΎΠΌ Π΄Π»Ρ ΡΡΠΎΠ³ΠΎ ΠΏΠ΅ΡΠ΅Ρ ΠΎΠ΄ΠΈΠΌ Preferences β Key Bindings, ΠΈ ΠΏΠΈΡΠ΅ΠΌ ΡΠ»Π΅Π΄ΡΡΡΠΈΠΉ ΠΊΠΎΠ΄
ΠΠ΄Π΅ [«ctrl+1«] ΡΡΠΎ ΠΈ Π΅ΡΡΡ Π½ΡΠΆΠ½ΠΎΠ΅ ΡΠΎΡΠ΅ΡΠ°Π½ΠΈΠ΅ ΠΊΠ»Π°Π²ΠΈΡ. Π‘ΠΎΡ
ΡΠ°Π½ΡΠ΅ΠΌ Cntr+S.
Π Π²ΠΎΡ ΠΊΠ°ΠΊ ΡΡΠΎ ΡΠ°Π±ΠΎΡΠ°Π΅Ρ. Π£ Π½Π°Ρ Π΄ΠΎΠ»ΠΆΠ΅Π½ Π±ΡΡΡ ΠΎΡΠΊΡΡΡ CSS ΠΈ HTML ΡΠ°ΠΉΠ»Ρ. CSS ΠΊΠ°ΠΊ ΠΏΡΠ°Π²ΠΈΠ»ΠΎ ΠΎΡΠ΅Π½Ρ Π±ΠΎΠ»ΡΡΠΎΠΉ ΠΈ Π½Π°ΠΉΡΠΈ ΡΡΠΎ-ΡΠΎ Π±ΡΡΡΡΠΎ ΡΠ»ΠΎΠΆΠ½ΠΎ, Π½ΠΎ ΡΡΠΎ Π² ΠΏΡΠΎΡΠ»ΠΎΠΌ. ΠΠ°ΠΏΡΠΈΠΌΠ΅Ρ, Π½Π°ΠΌ Π½ΡΠΆΠ½ΠΎ ΠΈΠ·ΠΌΠ΅Π½ΠΈΡΡ CSS Π΄Π»Ρ ΠΊΠ»Π°ΡΡΠ° content-mainpage ΠΊΠ»ΠΈΠΊΠ°Π΅ΠΌ Π½Π° Π½Π΅Π³ΠΎ ΠΌΡΡΠΊΠΎΠΉ ΠΈ Π½Π°ΠΆΠΈΠΌΠ°Π΅ΠΌ ctrl+1. ΠΡΠ°Π»Ρ, ΠΌΡ Π² Π½ΡΠΆΠ½ΠΎΠΌ ΠΌΠ΅ΡΡΠ΅ CSS ΡΠ°ΠΉΠ»Π°.
ΠΡ ΠΈ Π΄Π»Ρ ΡΠ΅Ρ , ΠΊΡΠΎ Π΄ΠΎΡΠΈΡΠ°Π» Π΄ΠΎ ΡΡΠΎΠ³ΠΎ ΠΌΠΎΠΌΠ΅Π½ΡΠ° ΠΏΠΎΠΊΠ°ΠΆΡ Π΅ΡΠ΅ ΠΎΠ΄ΠΈΠ½ ΠΏΠ»Π°Π³ΠΈΠ½, ΠΊΠΎΡΠΎΡΡΠΉ ΡΡΡΠ°Π½ΠΎΠ²ΠΈΡΡ Π½Π΅ ΡΠ°ΠΊ ΠΏΡΠΎΡΡΠΎ, Π½ΠΎ ΠΎΠ½ ΡΠΎΡΠ½ΠΎ ΡΠΎΠ³ΠΎ ΡΡΠΎΠΈΡ.
ΠΠΎΠ²ΡΡ Π΅Π³ΠΎ Tag ΠΈ ΡΡΡΠ°Π½ΠΎΠ²ΠΈΡΡ Π½Π°ΠΌ ΠΏΡΠΈΠ΄Π΅ΡΡΡ Π΅Π³ΠΎ Π²ΡΡΡΠ½ΡΡ. ΠΠΎ ΡΡΠΎΠΉ ΡΡΡΠ»ΠΊΠ΅ ΠΌΠΎΠΆΠ½ΠΎ ΡΠΊΠ°ΡΠ°ΡΡ Π°ΡΡ ΠΈΠ² Ρ ΠΏΠ»Π°Π³ΠΈΠ½ΠΎΠΌ. ΠΠ°Π»Π΅Π΅ ΡΠ°ΡΠΏΠ°ΠΊΠΎΠ²ΡΠ²Π°Π΅ΠΌ Π² ΠΎΡΠΎΠ±ΡΡ ΠΏΠ°ΠΏΠΊΡ ΠΏΡΠΎΠ³ΡΠ°ΠΌΠΌΡ. ΠΠ»Ρ Windows 10 ΡΡΠΎ C:\Users\[ΠΠΎΠ΄ΡΡΠ°Π²Ρ ΡΠ²ΠΎΠ΅ ΠΈΠΌΡ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»Ρ]\AppData\Roaming\Sublime Text 3\Packages. ΠΠ°Π»Π΅Π΅ Π·Π°ΠΊΡΡΠ²Π°Π΅ΠΌ Sublime ΠΈ ΠΎΡΠΊΡΡΠ²Π°Π΅ΠΌ ΡΠ½ΠΎΠ²Π° ΠΈ Π΄ΠΎΠ±Π°Π²Π»ΡΠ΅ΠΌ Π³ΠΎΡΡΡΠΈΠ΅ ΠΊΠ»Π°Π²ΠΈΡΠΈ ΠΎΡΠΊΡΡΠ² Preferences β Key Bindings ΠΈ Π΄ΠΎΠΏΠΈΡΠ°Π² ΡΠ»Π΅Π΄ΡΡΡΠ΅Π΅:
ΠΠ΄Π΅ ctrl+` ΡΡΠΎ ΠΈ Π΅ΡΡΡ Π½Π°ΡΠ΅ ΡΠΎΡΠ΅ΡΠ°Π½ΠΈΠ΅ ΠΊΠ»Π°Π²ΠΈΡ.
ΠΡΠ°ΠΊ, Π΄Π»Ρ ΡΠ΅Π³ΠΎ ΠΆΠ΅ ΠΌΡ ΠΏΡΠΎΠ΄Π΅Π»Π°Π»ΠΈ Π²Π΅ΡΡ ΡΡΠΎΡ Π½Π΅Π»Π΅Π³ΠΊΠΈΠΉ ΠΏΡΡΡ? ΠΠ°ΠΊ ΠΏΡΠ°Π²ΠΈΠ»ΠΎ, Π² ΠΏΡΠΎΡΠ΅ΡΡΠ΅ Π½Π°ΠΏΠΈΡΠ°Π½ΠΈΡ, ΠΊΠΎΠ΄Π° ΠΌΡ ΡΠ°Π±ΠΎΡΠ°Π΅ΠΌ ΡΠ½Π°ΡΠ°Π»Π° Ρ HTML ΠΏΠΎΡΠΎΠΌ ΠΏΠ΅ΡΠ΅Π½ΠΎΡΠΈΠΌ Π½Π°Π·Π²Π°Π½ΠΈΡ ΠΊΠ»Π°ΡΡΠΎΠ² Π² CSS ΠΈ ΡΠ°Π±ΠΎΡΠ°Π΅ΠΌ ΡΠΆΠ΅ ΡΠ°ΠΌ. Π’Π°ΠΊ Π²ΠΎΡ ΡΡΠΎΡ ΠΏΠ΅ΡΠ΅Π½ΠΎΡ Π΄Π΅Π»Π°ΡΡ Π²ΡΡΡΠ½ΡΡ Π΄Π°Π²ΠΎΠ»ΡΠ½ΠΎ Π΄ΠΎΠ»Π³ΠΎ. Π ΡΡΡ Π½Π°ΠΌ Π½Π° ΠΏΠΎΠΌΠΎΡΡ ΠΏΡΠΈΡ ΠΎΠ΄ΠΈΡ ΠΏΠ»Π°Π³ΠΈΠ½ Tag. Π‘Π΅ΠΉΡΠ°Ρ Π½Π°ΠΌ Π΄ΠΎΡΡΠ°ΡΠΎΡΠ½ΠΎ Π²ΡΠ΄Π΅Π»ΠΈΡΡ Π½ΡΠΆΠ½ΡΠΉ HTML ΠΊΠΎΠ΄, Π½Π°ΠΆΠ°ΡΡ Π½Π°ΡΠ΅ ΡΠΎΡΠ΅ΡΠ°Π½ΠΈΠ΅ ΠΊΠ»Π°Π²ΠΈΡ ctrl+`
ΠΈ ΠΏΠΎΡΠΎΠΌ Π²ΡΡΠ°Π²ΠΈΡΡ ΡΠ΅Π·ΡΠ»ΡΡΠ°Ρ ΠΊΠΎΠΏΠΈΡΠΎΠ²Π°Π½ΠΈΡ Π² Π½Π°Ρ CSS ctrl+v.