Kaip automatiškai suformatuoti kodą VS kode

Įrenginių nuorodos

  • HTML
  • JSON
  • Python
  • Automatinis formatavimas įrašant
  • Trūksta įrenginio?

Jei galvojate apie mokymąsi koduoti arba jau rašote jį kiekvieną dieną, būtina turėti patikimą kodo rengyklę, pvz., Visual Studio Code. Rašydami kodą turite galvoti apie formatavimą, nes taip žmonėms lengviau jį skaityti.

Kaip automatiškai suformatuoti kodą VS kode

Visos šios konkrečios taisyklės dėl įtraukų ir tarpų tarp eilučių yra būtinos, tačiau jas lengva pamiršti, kai sutelkiate dėmesį į savo darbą.

Štai kodėl VS Code leidžia naudoti automatinio formatavimo plėtinius, kurie gali jums padėti. Kai kurie automatinio formatavimo plėtiniai gali formatuoti daugiau nei vieną programavimo kalbą, o kitiems reikės integruoti specializuotus plėtinius.

Kaip automatiškai formatuoti HTML

Hiperteksto žymėjimo kalba arba HTML yra kodavimo kalba, naudojama tinklalapiams kurti ir rodyti. Žiniatinklio kūrėjai ir programinės įrangos inžinieriai kasdien naudoja HTML ir gali pasinaudoti automatinio formatavimo įrankiu.

Jei pasirinktas kodo rengyklė yra VS Code, štai kaip galite rasti Prettier, populiarų kodo formatavimo priemonę, ir įjungti automatinio formatavimo funkciją.

  1. Kompiuteryje atidarykite „Visual Studio Code“.
  2. Eikite į plėtinio skirtuką kairėje ekrano pusėje. Jis pavaizduotas kaip keturi blokai.
  3. Paieškos juostos lauke įveskite „Gražesnis kodo formatuotojas“.
  4. Gausite kelis paieškos rezultatus, bet pasirinkite tą, kurį sukūrė Prettier, o ne kitas asmuo ar įmonė.
  5. Spustelėkite mygtuką „Įdiegti“ ir plėtinys atsisiųs per kelias sekundes.

Įdiegę Prettier formaterį, galite įjungti automatinio formatavimo funkciją ir užtikrinti nuoseklų stilių rašydami kodą.

  1. Atidarykite arba sukurkite naują HTML failą „VS Code“.
  2. Eikite į „Nustatymai“, esantį apatiniame kairiajame ekrano kampe.
  3. Paieškos laukelyje įveskite „Formatas“ ir pereikite į skirtuką „Vartotojas“.
  4. Spustelėkite parinktį „Numatytasis formatavimas“ ir sąraše pasirinkite „Gražesnis“.
  5. Šiek tiek slinkite žemyn, kol pamatysite parinktį „Redaktorius: formatuoti išsaugojant“.
  6. Pažymėkite langelį šalia šios parinkties.
  7. Grįžkite į failą ir patikrinkite, ar nustatymas veikia.

Prettier turėtų automatiškai suformatuoti HTML failus, kai juos išsaugosite.

Automatinis JSON formatavimas

„JavaScript“ objektų žymėjimas arba JSON yra klasifikuojamas kaip nuo kalbos nepriklausomas duomenų mainų formatas. Programėlės mobiliesiems ir kompiuterių programos naudoja JSON failus, kad nuskaitytų duomenis iš serverių ir parodytų juos ekrane.

Kai kuriate JSON failą Visual Studio kodo rengyklėje, taip pat turite atsižvelgti į formatavimą. Geros naujienos yra tai, kad galite naudoti Prettier formatavimo plėtinius VS kode, kad užtikrintumėte nuoseklų JSON failų stilių.

Štai viskas, ką reikia padaryti, kad įjungtumėte automatinio JSON failų formatavimo funkciją.

  1. Paleiskite „VS Code“ ir eikite į nurodytą plėtinių skirtuką kairėje lango pusėje.
  2. Paieškos laukelyje ieškokite „Gražesnis kodo formatuotojas“.
  3. Pirmasis rezultatas paprastai yra tas, kurį norite spustelėti. Tačiau norėdami įsitikinti, pasirinkite tą, kurio kūrėjas yra „Gražesnis“.
  4. Spustelėkite „Įdiegti“ ir palaukite kelias sekundes, kol formatatorius atsisiųs.

Įdiegę Prettier formaterį, atlikdami šiuos veiksmus įsitikinkite, kad įjungta automatinio formatavimo funkcija.

  1. Sukurkite naują JSON failą arba atidarykite dar nesuformatuotą.
  2. Apatiniame kairiajame kampe spustelėkite „Nustatymai“.
  3. Ieškokite „Formatas“.
  4. Spustelėkite skyrių „Numatytasis formatavimas“. išskleidžiamajame sąraše pasirinkite „Gražesnis“.
  5. Slinkite žemyn ir sustokite, kai pamatysite parinktį „Redaktorius: formatuoti išsaugojant“.
  6. Spustelėkite žymimąjį laukelį šalia šios parinkties.
  7. Patikrinkite, ar veikia automatinio formatavimo funkcija.

Tai viskas. Prettier plėtinys VS kodo rengyklėje palengvina automatinį formatavimą.

Automatinis Python formatavimas

Šiomis dienomis Python yra viena iš populiariausių programavimo kalbų ir yra plačiai naudojama žiniatinklio kūrėjų ir kodavimo entuziastų. Jis naudojamas programinei įrangai ir svetainėms kurti ir kurti, duomenims analizuoti, užduotims automatizuoti ir dar daugiau.

Jei naudojate VS kodą Python failui redaguoti, turėsite naudoti tinkamą formatuotoją. Nors Prettier veikia su daugeliu skirtingų programavimo kalbų, ji nesuderinama su Python.

Laimei, VS Code siūlo sprendimą. Vienas iš geriausių Python formatuotojų VS Code yra juodas, ir jį galima naudoti formatuojant kodą, kai automatiškai išsaugote failą. Tačiau prieš naudodami „Black“, turite atsisiųsti „Microsoft“ Python plėtinį, skirtą VS kodui:

  1. Atidarykite „VS Code“ ir paieškos laukelyje ieškokite „Python“.
  2. Įsitikinkite, kad tai yra „Microsoft“ plėtinys, ir spustelėkite „Įdiegti“.
  3. Norėdami įdiegti „Phyton“ formatuotoją, savo virtualioje aplinkoje įveskite šį tekstą: „$ pip install black“.
  4. „VS Code“ eikite į „Nustatymai“ ir ieškokite „Phyton formatavimo teikėjas“.
  5. Išskleidžiamajame meniu pasirinkite „Juoda“.
  6. Slinkite žemyn ir suraskite parinktį „Redaktorius: formatuoti išsaugojant“.
  7. Pažymėkite langelį šalia šios parinkties.

Juoda, Python formatuotojas dabar automatiškai formatuos kodą kiekvieną kartą, kai įrašysite failą.

VS kodo automatinis formatas išsaugojimo metu

Galite įjungti automatinio formatavimo funkciją, neatsižvelgdami į tai, kurią programavimo kalbą ar kodo formatuotoją naudojate programoje VS Code.

Daugelis kūrėjų naudoja kelis kodo formatavimo plėtinius „VS Code“, todėl galite užtikrinti, kad kiekvienas iš jų automatiškai formatuotų failą, kai jį išsaugosite.

Štai kaip tai veikia.

  1. Atidarykite „Visual Studio“ kodo rengyklę.
  2. Apatiniame kairiajame kampe spustelėkite krumpliaračio piktogramą „Nustatymai“.
  3. Ieškokite „Formateris“ ir spustelėkite parinktį „Redaktorius: numatytasis formatavimas“.
  4. Išskleidžiamajame meniu pasirinkite norimą naudoti kodo formatavimo priemonę.
  5. Slinkite šiek tiek žemyn ir pažymėkite langelį šalia parinkties „Redaktorius: formatuoti išsaugojant“.

Galite pakartoti procesą kiekvienam kodo formatuotojui, kurį naudojate „VS Code“.

DUK

Kodėl automatinis „Format On Save“ neveikia?

Jei VS kodo formatuoklyje turite parinktį „Format on Save“ ir ji neveikia tinkamai, greičiausiai susiduriate su trikdžiu.

Galbūt jūsų turimoje formatavimo versijoje kyla problemų, todėl turite patikrinti, ar yra naujinimas. Tačiau problema gali kilti ne jums, o triktį pašalins VS kodo kūrėjai.

Kaip išjungti automatinį formatavimą VS Code?

Išjungti automatinio formatavimo funkciją yra paprasta. Norėdami išjungti automatinį formatavimą, atlikite šiuos veiksmus.

1. Atidarykite VS kodo rengyklę ir spustelėkite piktogramą „Nustatymai“.

2. Ieškokite „Formateris“ ir pasirinkite formatuotoją, kuriam norite išjungti automatinį formatavimą.

3. Raskite parinktį „Redaktorius: formatuoti išsaugojant“ ir panaikinkite šalia jos esančio laukelio žymėjimą.

Lengvas automatinis kodo formatavimas „Visual Studio Code“.

Vienas geriausių VS kodo naudojimo aspektų yra gerai suprojektuota sąsaja, leidžianti net pradedantiesiems rasti kelią redaktoriuje.

Tinkamas ir nenutrūkstamas kodo formatavimas yra būtinas skaitomam kodui, tačiau šie susitarimai gali būti sudėtingi, jei turite juos atlikti rankiniu būdu.

Tačiau gera žinia ta, kad VS Code redaktorius turi daugybę kodo formatuotojų, kurie gali palengvinti ir pagreitinti skaitomo kodo rašymą.

Nesvarbu, ar tai gražesnė, juoda ar bet koks kitas plėtinys, vartotojai visada turi galimybę automatiškai formatuoti kodą išsaugodami failą.

Kurią programavimo kalbą naudojate ir kuris formatuotojas veikia geriausiai? Praneškite mums toliau pateiktame komentarų skyriuje.