Hej vänner! På populär efterfrågan, uppdaterade snabbinställningsguiden för kodredigeraren Sublim text 3, installera plugins som behövs för layout och skapa din egen förinställning för en snabb start på en ny arbetsplats.

Häftigt

Fäst den

Du är förmodligen bekant med situationen när du på en ny arbetsplats snabbt behöver installera och konfigurera Sublime Text för att arbeta med nya projekt. Som regel tar finjustering av Sublime Text mycket tid och att göra det varje gång är inte praktiskt och tidskrävande.

Idag kommer vi att titta på den snabbaste Sublime Text-inställningen, de mest populära plugin-programmen bland layoutdesigners och installera ett av de bästa och mest bekväma redaktörsteman Ett mörkt materialtema.

Som standard ser Sublime Text ganska sorgligt ut:

Först måste du ställa in paketkontroll. För att göra detta, tryck snabbtangenten Ctrl+Skift+P. I popup-fönstret skriver du Install Package Control och väljer lämpligt objekt. Efter några sekunder kommer Package Control att installeras, om vilket du får ett meddelande.

Om du är en MacOS-användare måste du trycka på Cmd + Shift + P på ditt tangentbord.

Paketkontrollen krävs så att du kan installera tillägg och plugins i Sublime Text 3 från paketförrådet.

Installera plugins i Sublime Text

Därefter måste du installera de plugins du behöver för att fungera. Vi kommer att överväga att installera de mest populära plugins bland layoutdesigners, vilket avsevärt förenklar utvecklingen. Du kan också experimentera med andra plugins i paketkontrollen, kanske kommer du att gilla några av de många fler tillgängliga paketen.

För att installera plugins i Sublime Text via Package Control måste du anropa menyn, som vi gjorde tidigare: Ctrl + Shift + P. Skriv sedan in kommandot "Installera paket" och välj önskat paket från listan.

De mest populära plugins för Sublime Text:

Emmet- snabbar på att skriva HTML och CSS-kod till ljusets hastighet. Lektion av Emmet ;
Autofilnamn- kompletterar koden när du skriver sökvägar till filer i layouten;
kärnan- Aktiverar Sublime Text att använda GitHub Gist-kodavsnittstjänsten. Sammanfattning handledning;
Sass- plugin för att markera Sass-syntax i Sass- och Scss-filer. Expanderar Emmet i Sass-filer.

Installera Sublime Text Appearance

Jag gillar verkligen temat Ett mörkt materialtema och markera koden med lämpligt färgschema. Dessa är de mest balanserade, tillräckligt kontrasterande, men inte för skarpa färgerna för bekvämt arbete i redigeraren.

För att installera One Dark-färgschemat måste vi installera följande paket via Package Control:

Ett mörkt färgschema- färgschema för kodmarkering;
Ett mörkt material - tema- UI Sublime Text-tema.

Installera plugin manuellt

Vissa plugins uppdateras inte längre i paketkontrollen eller visas helt enkelt inte där. Vissa av dessa plugins är viktiga när man arbetar med kod och måste installeras manuellt.

En av dessa plugins BufferScroll- ett fantastiskt plugin som, när du öppnar dokumentet igen, placerar markören på den plats där du avslutade redigeringen förra gången, vilket minskar tiden för att hitta rätt position för att fortsätta arbeta.

För att installera BufferScroll manuellt, gå till pluginens GitHub-sida, ladda ner och extrahera den till valfri plats på din disk. Välj sedan menyalternativet Inställningar > Bläddra i paket i Sublime Text. Användardatamappen på din enhet öppnas. Kopiera mappen som innehåller Buffer Scroll-filerna här och starta om Sublime Text. Nu fungerar plugin.

Justerar redigeraren, förinställer mina inställningar

Låt oss gå vidare till Sublime Text-inställningarna.

Jag presenterar min förinställning, som jag alltid använder för att börja ställa in Sublime Text-editorn på en ny arbetsplats eller efter en ominstallation av systemet. Du kan använda denna förinställning i din editor och anpassa den efter behov:

Keymap (Windows-användare): [ ( "keys": ["alt+shift+f"), "command": "reindent" ), ] Inställningar: ( "show_definitions": false, "auto_complete": false, "bold_folder_labels" : true, "color_scheme": "Paket/Ett mörkt material - Tema/scheman/OneDark.tmTheme", "fold_buttons": false, "font_size": 13, "highlight_line": true, "indent_guide_options": [ "draw_normal", "draw_active" ], "line_padding_bottom": 2, "line_padding_top": 2, "margin": 2, "material_theme_compact_sidebar": true, "material_theme_compact_panel": true, "material_theme_small_statusbar": true, "material_theme_sant"_small_tab : 2, "theme": "OneDarkMaterial.sublime-theme", "word_wrap": "false", )

Förinställd kod för användarinställningar (Preferences.sublime-settings | Preferences > Settings) - separat:

( "show_definitions": false, "auto_complete": false, "bold_folder_labels": true, "color_scheme": "Packages/One Dark Material - Theme/schemes/OneDark.tmTheme", "fold_buttons": false, "font_size": 13 , "highlight_line": true, "indent_guide_options": [ "draw_normal", "draw_active" ], "line_padding_bottom": 2, "line_padding_top": 2, "margin": 2, "material_theme_compact_sidebar": true, "material_theme"_compact_compact , "material_theme_small_statusbar": true, "material_theme_small_tab": true, "tab_size": 2, "theme": "OneDarkMaterial.sublime-theme", "word_wrap": "false", )

Förinställd kod för anpassade kortkommandon (Standard (Windows). sublime-keymap | Preferences > Key Bindings) - separat:

[ ( "keys": ["alt+shift+f"), "command": "reindent" ), ]

Nu på val och på klick Alt+Skift+F din kod kommer automatiskt att indraga i linje med lämplig elementkapselhierarki.

Genom att placera dessa utdrag i lämpliga inställningsfiler får du en helt färdig att arbeta, anpassad Sublime Text eller så kan du anpassa redigeraren själv. Det finns två fält i inställningarna - det vänstra med standardinställningar och det högra med användarinställningar. I standardinställningarna kan du se tips för varje egenskap och tillämpa den på höger sida genom att kopiera och ställa in ditt värde.

Att ta reda på vilken fastighet som är ansvarig för vad är ganska enkelt - alla fastigheter har intuitiva namn på engelska. Alla fastigheter från ett stort överflöd av tillgängliga inställningar kan helt enkelt översättas till ryska och förstå vad det betyder.

För att säkerhetskopiera alla dina inställningar och snabbt distribuera Sublime Text till en annan arbetsplats, kopiera bara mappen

"C:\Users\(din användare)\AppData\Roaming\Sublime Text 3"
till en dold reservplats på din disk eller på ett USB-minne, och placera det sedan hos en annan användare eller på en annan dator i samma katalog under användaren.

Dessutom kan du, efter eget gottfinnande, stänga av minikartan till höger och dölja menyn. Detta kan göras genom att gå till Visa > Dölj minikarta och Visa > Dölj meny. Du kan visa menyn genom att trycka på Ctrl-tangenten på ditt tangentbord.

Sublime Text 3 är en av de mest populära textredigerarna för programmerare. Det ger sina användare unika funktioner som inte är tillgängliga någon annanstans. En av de viktigaste fördelarna är plattformsoberoende och utbyggbarhet.

Här kan du konfigurera allt - från utseende till programkomponenter (plugins). Men nivån på anpassningen i Sublime Text är lämplig - som redigerare för programmerare konfigureras den genom källkoden, vilket inte alla kan göra. I den här artikeln kommer vi att titta på hur Sublime Text 3 är konfigurerad.

För Sublime Text, från de allra första versionerna, var möjligheterna mycket högre än för andra redaktörer. Är det ett skämt - ett helt anpassningsbart gränssnitt, möjligheten att anpassa programmets beteende och inte bara skriva in text? Vad kan vi säga om plug-ins - koden som är skriven i Python låter användaren styra editorn på samma sätt som en ormtämjare, som spelar en magisk pipa, får en gigantisk boakonstriktor att darra framför sig. Men hur mycket vi än är ledsna, det är just detta som skrämmer nybörjare - eftersom de inte kan konfigurera redigeraren, slutar de att använda den.

Ställa in Sublime Text 3

Låt oss först prata om utseendet och sedan gå vidare till att ställa in snabbtangenter och plugins.

1. Utseendet av sublim text

Så, det är dags att starta Sublime Text (installationsartikel -). Många gillar utformningen av programmet, medan andra inte gör det. Och nu har du en unik möjlighet att ändra gränssnittet till oigenkännlighet!

Det enklaste sättet är att välja ett tema genom inställningarna. För att göra detta, gå till menyn "Inställningar" -> "Färgschema" och välj det tema du vill ha. Men den här metoden kommer bara att ändra färgerna på redigeraren, och inget mer.

Ett annat, mer komplicerat, men säkert alternativ är att hantera inställningsfilen. För att öppna den, gå till menyn "Inställningar" -> "Inställningar". Och nu, framför dig finns inget annat än en massa text. Men allt är inte så svårt som det verkar! Till vänster finns standardinställningarna, du behöver inte röra dem. De kan tas som exempel. Men till höger måste du placera dina inställningar - ta, kopiera önskad rad och ändra dess värde. Grund inställningar:

"färgschema"- färgtema. Du kan välja bland befintliga, eller så kan du ladda ner det till Paket / Färgschema - Standard / mappen.
"font_face"- Teckensnitt. Det är viktigt att det finns i systemet. För att se listan över tillgängliga teckensnitt, öppna valfri textredigerare, till exempel Lible Office Writer.
"textstorlek"- teckenstorlek, inställd som ett bråk- eller heltalsvärde.
"font_options"- Ytterligare teckensnittsalternativ som "no_bold", "no_italic".
"ord_separatorer"- ordavgränsare.
"radnummer"- linjenumreringsinställning.
"ränna"- om den ska visas "räffla"(den innehåller radnummer och bokmärken).
"marginal"- längden på indraget från "spår".
"fold_buttons"- om du håller muspekaren över "räffla", kommer triangulära pilar att vara synliga, så att du kan dölja eller visa en bit kod mellan lockiga hängslen. Du kan slå på eller av dem här.
"fade_fold_buttons"- om inställt på false, kommer triangulära knappar inte att döljas.

Här är ett exempel på inställningsåtgärden (glöm inte att spara filen):

Här kan du själv experimentera. Och vi går vidare.

2. Anpassa kortkommandon

Ja, ja, du hörde rätt! Vem som helst kan anpassa kombinationerna på sitt eget sätt genom att tilldela dem olika värden. För att öppna filen, gå till "Inställningar" -> "Nyckelbindningar".

Vi har återigen två filer, varav en är standardinställningarna och den andra är dina personliga inställningar. För att ändra kombinationen måste du kopiera en eller flera rader mellan hängslen. Här är ett exempel på min fil:

Naturligtvis ändrar detta ingenting (det är ett kortkommando för att stänga alla program), men den här filen är bara ett exempel.

Nåväl, det är allt, Sublime Text har blivit vad du behöver att det ska vara och du vet hur du ställer in Sublime Text 3. Och nu är det dags att gå vidare - att installera plugins.

3. Paketkontrollinstallation

Som nämnts tidigare har editorn möjlighet att lägga till plugins, oavsett om de är deras egna eller nedladdade från utvecklarens webbplats. Men trots allt är det inte särskilt bekvämt att installera plugins manuellt, och därför måste du ladda ner och installera en extra komponent.

Paketkontroll - designad för snabbare och bekvämare installation av plugins. Det låter dig installera dem genom ett renderat gränssnitt snarare än genom kod.

Installera först Package Control från den officiella webbplatsen. Det betyder inte att vi kommer att ladda ner det!

Låt oss kopiera texten från motsvarande textfält (beroende på versionen av Sublime Text).
Använda en kortkommando "Ctrl+~" vi kallar konsolen inbyggd i editorn (ja, det finns en sådan sak!).
Klistra in den kopierade koden i textfältet och vänta på en lyckad installation.
Vi startar om editorn.

paketkontroll installerad! Nu är det dags att ta reda på hur man använder den.

4. Arbeta med plugins i Package Control

För att starta Package Control måste du skriva kortkommandot "Ctrl+Skift+P" och välj elementet Package Control: Install Package från listan.

Och framför oss ligger den efterlängtade installationen av plugins! Nu är det möjligt att snabbt söka efter och välja dem, och om du väljer andra kommandon för Paketkontrollen kan du både ta bort och ändra editorelement. Nu måste vi öva på installationen. Ställ in materialtemat och konfigurera det sublima text 3-temat.

Starta plugin-installationsprogrammet.
Vi skriver i sökfältet Materialtema.
Tryck och vänta, en inskription ska dyka upp nedan "Installerar paketets materialtema". Under installationsprocessen kommer du att bli ombedd att lägga till ytterligare ett plugin, vi tillåter det.

För att tillämpa ett tema måste du gå till menyn "Inställningar" -> "Färgschema" -> "Materialtema" -> "scheman", och sedan det tema du gillar bäst.

Det är dock inte allt. Trots att temat har installerats som ett plugin är det inte helt aktiverat. För att fixa detta, gå till inställningsfilen och lägg till följande text:

"theme": "Material-tema. sublimt-tema",
"color_scheme": "Paket/Materialtema/scheman/Material-Theme.tmTheme",
"overlay_scroll_bars": "aktiverad",
"line_padding_top": 3,
"line_padding_bottom": 3,
// På retina Mac
"font_options": [ "gray_antialias" ],
"always_show_minimap_viewport": sant,
"bold_folder_labels": sant,
// Markera aktivt indrag
"indent_guide_options": [ "draw_normal", "draw_active" ]

Visa redigeraren efter att ha applicerat temat på den:

Inte illa, eller hur? Installationen av Sublime Text 3 är nästan klar. Och nu är det dags att etablera något mer omfattande. Låt oss ta en titt på de mest populära plugins för Sublime Text.

Topp 5 plugins för Sublime Text 3

1. Emmet

Emmet är ett plugin som låter dig göra kodvisning mer bekväm. Kortkommandon används här. Till exempel, "html+tab" skapar en dokumentram och " div omslag +tab" kommer att förvandlas till en fullvärdig kod:

Detta plugin är en samling av förkortningar för JavaScript. Längden på den maskinskrivna texten med hjälp av tips minskar verkligen! Till exempel istället för en uppsättning "document.querySelector("selektor");" du kan bara skriva "qs+Tab".

Varför leta efter en plats för en ny fil i ett obekvämt katalogträd? Denna plugin gör att du snabbt och effektivt kan ange nödvändiga data, och filen kommer att skapas med bara ett par knapptryckningar!

4. Git

Namnet på denna plugin talar för sig själv: du kan utföra alla nödvändiga åtgärder inom Git utan att lämna redigeraren!

Cross-platform textredigerare.

En kort guide för nybörjare att arbeta i sublim och inom layout. Allt du behöver och behöver finns här. (Klicka på länkarna för mer om det behövs)

Vi kommer att överväga det för Layout on Pug / Less, där vi inte behöver enorma felsökningsfunktioner. Därför är det denna editor (enligt mig) som vinner över sina konkurrenter både i hastighet och funktionalitet.

1. Installera programmet och kontrollera tillägg (paketkontroll)

Installera Sublime Text 3. Allt är enkelt - ladda ner och börja.

Nu trycker vi på ctrl/⌘+shift+sid eller i menyn (Verktyg > Kommandopalett).

Här kan vi ladda ner, installera, ta bort, se tillägg, etc.

2. Programinställningar:

Använd mellanslag istället för tabbar.
"translate_tabs_to_spaces": sant
Flikens storlek är 4 mellanslag.
tab_size: 4
Du frågar varför?
För att inte av misstag trycka ihop mellanslagstangenten och fliken och inte bryta mopsenheten.
Samt för enhetligheten i teamarbetet.
Strängar borde inte avsluta med tomma tecken.
För att göra detta använder vi plugin TrailingSpaces .

- Det är kanske här de obligatoriska MustHave-inställningarna slutar. Låt oss gå vidare till individen:

F11 helskärm + dölj menyraden (alt). Gör att du kan maximera användningen av monitorn i arbetet och inte bli distraherad av statusen för OS-panelen.
Förbjud radbrytning. Förmodligen den bästa på listan. Förhindrar förvirring i mops syntax. Visar alltid förväntad kod och kapsling oavsett skärmstorlek. Horisontell rullning görs med shift + hjul, (eller touchpanel)
"word_wrap": "falskt"
teman. Jag kan inte säga något om detta. Hitta bara det du gillar (helst med ett mörkt schema). Jag använder "theme": "Material-Theme-Darker.sublime-theme".
Syntaxmarkering. Tja, jag tror inte att det borde vara några problem. Om du ser till att expansionen och markeringen matchar (Pug for Pug, inte Jade for Pug)
Visa → Sidofält → Dölj öppna filer- Frigör utrymme för projektträdet. Eftersom det här fältet dupliceras av tabbar och tre prickar på toppen ändå

3. Användbara snabbtangenter:

Låt oss i första stycket säga att vi hoppar över alla standardkombinationer, som t.ex ctrl(⌘) + Z(⌘ - sedan är det bara ctrl). Ångra, spara, gör om, stäng flik, återställ flik, etc...
Den kanske näst mest populära kombinationen är:
crtl+P- Låter dig söka igenom filerna i projektet du har öppnat. Låter dig bli av med ett stort träd av öppna stilar.
Nästa i betydelse:
ctrl + D- Sök efter kopior av den markerade texten. Idealisk för multiredigering. Och att hitta dubbletter. Speciellt i större filer och större fragment. För flera markörer håll ctrl och använd musen.
ctrl+L- Väljer hela raden och låter dig ta bort den helt. Fungerar bra med ctrl+D.
Sök… Tja, förmodligen är den första ctrl+F - filsökning. Det andra och viktigare är att söka i en mapp efter många filer ctrl + shift + F (Du kan kalla det genom att högerklicka på mappen och välja "Hitta i mapp ...") Jag råder dig att inte inkludera " Famous Fat Man"-mappen i sökningen
ctrl+shift+upp/ner- Flyttar raden upp/ned (byt dem). Användbar för att arbeta med stilar och variabler.
Nu en liten tutorial på kombinationer av kortkommandon. Du har förmodligen sett dessa kombinationer åtskilda med kommatecken. Så jag såg ... och nu vet jag hur man använder dem. För att göra detta, tryck på dessa kombinationer i tur och ordning (du kan inte släppa den gemensamma mod-tangenten)
Här är några användbara:
ctrl+K, ctrl+4- Döljer alla grenar, vars häckning är större än 4. Analog av pilen för att kollapsa. ( ctrl+K, ctrl+J- expanderar allt som är)
ctrl+K, ctrl+B- Döljer/visar sidofältet. (fungerar bra med F12)

Sublime Text-plugins är skrivna i Python. Språket i sig är väldigt enkelt och om du är programmerare kommer det inte att vara svårt för dig att lära dig det. Om inte, så spelar det ingen roll heller, eftersom plugin-programmet troligen redan har skrivits för din uppgift.

Installera plugins i Sublime Text

För närvarande finns det två metoder för att installera plugins i programmet:

Barbarisk. Ladda bara ner det nödvändiga plugin-programmet från Internet och släpp det i lämplig mapp. Men detta är inte en korrekt metod, på grund av detta kommer vi inte att uppehålla oss vid det.
Via Sublime Package Control

Innan du börjar installera plugins måste du installera Sublime Package Control, läs om det.

För att installera plugins behöver du:

öppna kommandoraden genom att trycka på tangentkombinationen: ctrl+shift+p ;
i raden skriver vi in Installera paket och trycker på enter;
längst ner, i fältet som öppnas, ange namnet på plugin-programmet, till exempel: emmet;
tryck enter och vänta på slutet av installationen, en skärm med en massa rader kommer att dyka upp där;
Redo.

(se instruktioner på 3 skärmdumpar)

Det är inte mycket meningsfullt att prata om vilka plugins som är populära, och vilka som inte är mycket meningsfulla, eftersom Sublime skriver på flera dussin programmeringsspråk och varje språk har sina egna plugins.

Men eftersom majoriteten av människor som väljer denna editor skriver i php, kommer vi fortfarande att överväga några.

Sublim text Emmet

Lite tidigare i exemplet installerade vi detta plugin. Det påskyndar avsevärt utvecklingen av webbplatser. För att förstå vad den gör i det nedre högra hörnet, istället för vanlig text, välj PHP. Nu sätter vi i editorn! och tryck på TAB.

Du kan också ange: .wrapper press tab, som vi ser har vi en div.

För att göra en meny med 10 länkar kan du skriva följande och sedan trycka på tab: .menu>ul>li*10>a(menu_$)

På vänster sida “!+tab” , i den centrala delen “.wrapper + tab”, och på höger sida “menu>ul>li*10>a(menu_$) + tab” tror jag att du förstår poängen.

Avancerad ny fil

Låter dig skapa nya filer. Installera plugin, öppna den högra sidofältet (vy - sidofält -visa sidofält), tryck sedan på tangentkombinationen ctrl + alt + n och skriv index.php, eftersom vi ser att filen har skapats, och det går väldigt snabbt och bekvämt.

Bracket highlighter

Som standard, om vi till exempel står på någon div, så är det väldigt svårt att lägga märke till den avslutande taggen, eftersom den är för svagt understruken. Bracket highlighter.

Det märks att understruken med en klar vit linje.

färg highlighter

Föreslår färgen på koden, det vill säga som standard är det inte klart för oss vilken färg #224f43-koden kommer att ha, och plugin-programmet understryker koden med den färg den är. Dessutom, om vi klickar på koden kommer den att markera den med denna färg.

Gotocs deklaration

Hjälper till att hitta och gå till önskat css-element direkt från html-koden. Du behöver bara högerklicka på elementet som denna stil tillämpas på och välja Gå till CSS-deklaration

// echo get_the_post_thumbnail(get_the_ID(), "relatedthumbnail"); // visar min miniatyrstorlek?>

Hej, mycket har redan skrivits om Sublime Text. I min blogg skrev jag om Sublime Text 2. Nu har Sublime Text 3 redan lämnat alfaversionen (alfa betyder en ny och extremt instabil version), och flyttat till beta (betan är fortfarande inte stabil, men är redan avsedd för testning, efter betan kommer vanligtvis den officiella releasen). Och jag bestämde mig för att helt ta itu med Sublime Text 3 (nedan kallad ST3).

Om du ska installera SublimeText3 så är detta den mest kompletta guiden för dig. Här kommer jag att beskriva allt som har med denna redaktör att göra, och han vet verkligen mycket.

Först tog jag bort ST2 och alla spår av den från systemet. Tog även bort node.js och npm som parades ihop med den. Eftersom jag har för avsikt att konfigurera om kompileringen av mindre, och sedan saas-filer, korrekt och korrekt, genom sublim. Men mer om det senare.

Del 1. Installera och konfigurera Sublime Text 3

Ladda ner och installera Sublime Text 3

Om du inte redan är medveten om det är Less en JavaScript-baserad CSS-förprocessor. Detta är koden som kompileras till CSS. Det finns olika sätt att kompilera mindre till css: Grunt , Guard och Less.app . Men du kanske inte vill eller behöver använda ytterligare verktyg och vill göra allt rätt i kodredigeraren. Nedan har jag gett instruktioner som är lämpliga för Windows-användare (jag har själv gjort installationen på den, och även för mac OS.)

Installera Node.js
Installera NPM (installerad med Node.js)
Installera mindre globalt. Öppna Windows-konsolen och skriv npm install less -gd
Installera plugin-programmet Less2Css och SublimeOnSaveBuild

Låt oss öppna ST3-inställningarna: Inställningar → Inställningar - Standard, och lägg till raden i slutet:

"lesscCommand": "/usr/local/share/npm/bin/lessc"

Låt oss öppna valfri .less-fil och försöka bygga den. Gör bara ändringar i filen och tryck på Ctrl + S.

Om ett fel uppstår: Kan inte tolka argument clean-css... Detta hände för att clean-css-pluginet var separat och inte inkluderat i mindre-paketet. Därför måste den installeras separat. Installera. Vi går till konsolen och skriver:

npm installera -g less-plugin-clean-css

SASS är en annan CSS-förprocessor. Vinner i popularitet, och går redan om mindre i spridningen av användning.

Installera Ruby
Vi startar konsolen och sätter Ruby Gem gem install sass
Installera Sass Plugin för Sublime Text
Installera Sass Build Plugin för Sublime Text
Installera SublimeOnSave Plugin för Sublime Text
(vi pratade om detta plugin i instruktionerna ovan)

Låt oss nu lägga till inställningar till Sublime Text Settings - Standard:

( "filename_filter": ".(sass|scss)$", "build_on_save": 1 )

Glöm inte heller att öppna .sass-filen och välj byggsystemet i Verktyg → Bygg system → SASS Compressed Nu, när du sparar .sass-filen, kommer .css att kompileras.

Jade är en förprocessor för att skriva html-kod, och som less eller sass för css gör det att skriva html-markering snabbare och enklare (för erfarna layoutdesigners). Hur man installerar och konfigurerar dess funktion.

Måste ha node.js installerat med npm (vanligtvis tillsammans med nod)
Vi går till konsolen och installerar jade med kommandot npm install jade --global
Installera Jade Build Plugin i Sublime Text
Öppna .jade-filen i Sublime Text och välj Jade-byggsystem
Om du följer alla instruktionerna i det här inlägget så kommer jag i Sublime-inställningarna att komplettera raden om Save On Build med jade-tillägget och nu kommer det att se ut så här "filename_filter": ".(sass|scss|jade)$" ,
Installera Jade Plugin i Sublime

Efter dessa manipulationer kompileras jade-filer.

Om det inte finns någon Jade-kodmarkering, gå till det nedre högra hörnet av ST, och det står förmodligen Plain Text, klicka på den inskriptionen och välj sedan Jade-markering. Nu kommer bakgrundsbelysningen att fungera.