Pagrindinis » Interneto svetainės dizainas » Kaip pritaikyti „Visual Studio“ kodą

    Kaip pritaikyti „Visual Studio“ kodą

    „Visual Studio Code“, „Microsoft“ naujasis atviro kodo redaktorius, siūlo daugybę nuostabių funkcijų, kurios yra labai svarbios palengvinti pirminio kodo redagavimo procesą. Be to, „Visual Studio Code“ taip pat užtikrina, kad naudotojai nebus nuobodu, kai jie dirba su juo, nes tai leidžia jiems pritaikyti kelias jo išvaizdos dalis, pvz., spalvos, šriftai, tarpai ir teksto formatavimas, kaip ir daugelis funkcijų, pvz., įdėjimas ir galiojimo taisykles.

    Šiame pranešime pirmiausia pažvelgsime kaip pakeisti „Visual Studio Code“ darbo vietos išvaizdą, tada aš jums parodysiu, kaip pritaikyti numatytuosius nustatymus dviejų pagalba JSON-suformatuoti konfigūracijos failai.

    Kaip nustatyti spalvų temą VS kode

    „Visual Studio“ kodas leidžia nustatyti pasirinktinę spalvų temą redaktoriui.

    Jei norite naudoti iš anksto sukurtą temą, spustelėkite Failas> Nuostatos> Spalvos tema viršutiniame meniu juostoje. Kai paspausite “Įveskite”, atsiranda komandų paletė ir rodomas išskleidžiamajame sąraše esančių temų.

    Tą patį efektą galite pasiekti, jei paspausite F1 atidaryti komandų paletę ir įveskite Nuostatos: spalvų tema komandą į įvesties lauką.

    Perkeldami parinktis iš išskleidžiamojo sąrašo, darbo vietos išvaizda keičiasi realiu laiku, todėl galite greitai pamatyti, kuri tema geriausiai atitinka jūsų poreikius.

    Aš pasirinkau “Aukštas kontrastas” spalvos tema, nes mano akys nėra geriausios. Štai kaip atrodo mano vaizdas.

    Kaip įdiegti temą iš „VS Code Marketplace“

    Jei jums nepatinka jokios spalvų temos „VS Code“ pasiūlymas, galite atsisiųsti daug kitų iš „VS Code Marketplace“.

    Čia galite apžvelgti temas, kurias šiuo metu turi „Marketplace“. Jei norite įdiegti temą iš rinkos, paspauskite F1 VS kodo redaktoriaus viduje, kad atidarytumėte komandų paletę, tada įveskite ext install komandą į įvesties lauką, pagaliau pasirinkite Plėtiniai: diegimo plėtinys parinktis iš sąrašo, kuris pasirodo.

    Spustelėjus šią parinktį atsiranda naujas komandų paletės pavyzdys. Įveskite „ext install theme“ į naują įvesties lauką, ir jūs gauti visų temų sąrašą kuriuos galima gauti iš „VS Code Marketplace“.

    Aš pasirinksiu pavadintą temą “Medžiagos temų rinkinys”, ir įdiekite jį spustelėdami. Jei norite, kad naujoji tema būtų įtraukta į spalvų temų sąrašą, toje pačioje vietoje, kur yra kitos numatytosios temos iš naujo paleiskite VS kodą. Iš naujo paleidus naują temą rodoma temų sąraše ir galite jį nustatyti iš komandų paletės.

    Naudojant naują medžiagos temą, mano redaktorius dabar atrodo taip:

    Galite grįžti į ankstesnę temą (kaip ir aš, nes vis dar norėčiau, kad ši tema būtų), arba jūs galite žaisti šiek tiek daugiau su kitomis temomis, kad pamatytumėte, kuri yra tinkamiausia jums.

    Jei norite, taip pat galite sukurti savo pasirinktą temą, ir paskelbite jį VS kodo rinkoje, naudodami „vsce“ plėtinio tvarkyklės įrankį.

    Keisti naudotojo ir darbo vietos nustatymus

    VS kodas leidžia ne tik nustatyti pasirinktinę temą, bet taip pat galite konfigūruoti daugelį kitų nustatymų, pavyzdžiui, formatavimo taisyklės, skirtingų funkcijų naudojimas, avarijų ataskaitos, HTTP nustatymai, failų asociacijos, įdėjimo taisyklės ir kt.

    Tai galite padaryti redaguodami du konfigūracijos failus, abu JSON formatu. Nesijaudinkite, jums nereikia būti profesionalu, nes VS kodas siūlo gana paprastą ir intuityvų būdą greitai pridėti pritaikymus.

    Iš pradžių pažiūrėkime, koks skirtumas tarp dviejų konfigūracijos failų. VS kodas turi dvi sritis (pasauliniu mastu ir vietos) nustatymams, todėl du atskiri failai:

    1. pasaulio settings.json, kurioje kiekvienos darbo vietos konfigūracijos taisyklės galioja
    2. susijusi su darbo vieta .vscode / settings.json, tai susiję tik su individualia darbo vieta

    The pasauliniu mastu settings.json failą galima rasti aplanke, kuriame jūsų operacinė sistema saugo visus kitus su programa susijusius konfigūracijos failus:

    • sistemoje „Windows“: % APPDATA% Kodas Vartotojo nustatymai.json
    • Linux: $ HOME / .config / Code / Vartotojas / settings.json
    • „Mac“: $ HOME / Library / Application Support / Kodas / Vartotojas / settings.json

    The darbo vietos settings.json failas yra saugomas dabartinio projekto aplanke. Pagal numatytuosius nustatymus šis failas neegzistuoja, bet kai tik pridedate pasirinktinį darbinės vietos nustatymą, VS kodas sukuria a .vscode / settings.json failą vienu metu, ir į jį įkelia pasirinktines specifines darbo vietas.

    Taigi, kada jūs naudojate settings.json rinkmenas?

    Jei norite, kad VS kodas naudotų jūsų pasirinktines konfigūravimo taisykles visi savo projektus, juos į pasaulį settings.json failą.

    Jei norite, kad jūsų nustatymai galioja tik jūsų dabartinį projektą, įdėkite juos į darbo vietą settings.json failą.

    Darbo vietos nustatymai nepaiso bendrų nustatymų, Būk atsargus.

    Skambinami globalūs nustatymai “Vartotojo nustatymai” VS kodekse. Atidarykite juos paspaudę ant Failas> Nuostatos> Vartotojo nustatymai meniu arba pradėdami rašyti išraišką “Vartotojo nustatymai” į komandų paletę (atidarykite jį F1).

    VS kodas atveria dvi šalia esančias plokštes: kairėje yra visos parinktys, kurias galima konfigūruoti, o dešinėje - pasaulinis settings.json failą. Į šį failą turite įdėti savo pasirinktines konfigūravimo taisykles.

    Kaip matote, jums nereikia nieko daryti, tiesiog nukopijuokite norimus keisti nustatymus iš kairės į dešinę ir pridėkite modifikuotas reikšmes.

    Pažvelkime į trumpą pavyzdį (bet jūs galite atlikti bet kokius kitus pakeitimus pagal individualius poreikius). Aš pakeisiu šriftų šeimą, sumažinsiu a skirtuką nuo numatytojo keturių erdvių iki dviejų, sumažinkite maksimalų darbinių failų skaičių nuo devynių iki penkių ir pakeiskite vieną iš CSS įterpimo taisyklių, susijusių su dvigubais stiliais iš „ignoruoti“ į „įspėjimas“.

    Po kopijavimo, mano pasaulis settings.json failas atrodo taip:

     // Įdėkite nustatymus šiame faile, kad perrašytumėte numatytuosius nustatymus "editor.fontFamily": "Courier New", "editor.tabSize": 2, "explorer.workingFiles.maxVisible": 5, "css.lint.duplicateProperties" : "įspėjimas"

    Išsaugoję modifikuotą settings.json failas, mano redaktoriaus išvaizda iš karto keičiasi (žemiau esančiame paveikslėlyje matomas tik šrifto šeimos keitimas):

    Taip pat galite pakeisti darbo vietos nustatymus. Dabar jums reikia paspausti ant Failas> Nuostatos> Darbo vietos nustatymai viršutiniame meniu juostoje galite pasiekti su darbo vieta susijusią informaciją .vscode / settings.json failą.

    Darbo vietos nustatymai turi lygiai tokias pačias konfigūravimo parinktis, kaip ir Vartotojo nustatymai, ir jūs galite naudoti tą pačią kopijavimo įterpimo techniką. Yra tik du skirtumai: taikymo sritis (vietinė, o ne pasaulinė) ir settings.json failą, į kurį bus išsaugotos pasirinktinės konfigūracijos.