Koduleht » Veebidisain » Visual Studio koodi kohandamine

    Visual Studio koodi kohandamine

    Visual Studio Code, Microsofti uus avatud lähtekoodiga toimetaja pakub arendajatele palju suurepäraseid omadusi lihtsustada lähtekoodi redigeerimise protsessi. Pealegi tagab Visual Studio Code ka selle, et kasutajad ei saa sellega koos töötada, kuna see võimaldab kohandage selle välimuse mitmeid osi, nagu värvid, fondid, vahekaugus ja teksti vormindamine, nagu paljud funktsioonid, näiteks lintimine ja valideerimise eeskirjad.

    Selles postituses vaatame kõigepealt kuidas muuta Visual Studio Code tööruumi välimust, siis ma näitan teile, kuidas kohandada vaikesätteid kahe abil JSON-vormindatud konfiguratsioonifailid.

    Kuidas määrata värvi teema VS koodile

    Visual Studio kood võimaldab teil määrake kohandatud värvi teema redaktori jaoks.

    Eelseadistatud teema kasutamiseks klõpsa nupul Fail> Eelistused> Värvi teema menüüribal. Kui vajutad “Sisenema”, avaneb käsupalett ja kuvatakse nende teemade rippmenüü, millest saate valida.

    Sama efekti saate saavutada, kui vajutate F1 käsupaleti avamiseks ja tippige Eelistused: värvi teema käsk sisestusväljale.

    Kui rippmenüüst valikud üle lohistatakse, töökoha välimus muutub reaalajas, nii saate kiiresti näha, milline teema sobib teie vajadustele kõige paremini.

    Ma valin “Kõrge kontrastsus” värvi teema, sest mu silmad ei ole parimad. Siin näeb välja minu vaade.

    Teema installimine VS kooditurult

    Kui teile ei meeldi ühtegi värvi teemat VS Code pakub, saate VS kooditurult alla laadida palju teisi.

    Siin saate vaadata teemasid, mida Marketplace praegu omab. Kui soovite teemat turuplatsilt installida, siis vajuta F1 paremale VS-koodi redaktorisse, et avada käsupalett, seejärel tippige ext install käsk sisendväljale, vali lõpuks Laiendused: laienduse installimine avaneb loendist valik.

    Sellele valikule klõpsates avaneb uus käsuriba palett. Sisestage "ext install theme" käsk uude sisendivälja, ja te saate saada kõigi teemade loend mis on saadaval VS kooditurul.

    Ma valin valitud teema “Materjali teema komplekt”, ja installige see klõpsates. Uue teema värvilises loendis olekuks, samas kohas, kus teised teemad on, peate seda tegema taaskäivitage VS-kood. Pärast taaskäivitamist ilmub uus teema teemaloendisse ja selle saab määrata käsupalettist.

    Uue materjali teemaga näeb mu toimetaja nüüd järgmist:

    Võite minna tagasi eelmisele teemale (nagu ma tegin, sest eelistan ikka seda teemat) või te saate mängida veel mõne muu teemaga, et näha, mis on teie jaoks kõige sobivam.

    Kui soovite, võite ka luua oma kohandatud teema, ja avaldage see VS-kooditurul, kasutades vsce-laiendushalduri tööriista.

    Muuda kasutaja ja tööala seadeid

    VS-kood ei võimalda ainult seadistada kohandatud teema, kuid saate ka seadistage palju muid seadeid, näiteks vormindamise reeglid, erinevate funktsioonide kasutamine, krahhi aruanded, HTTP-seaded, failide ühendused, lintimisreeglid jne.

    Seda saate teha, redigeerides kahte konfiguratsioonifaili, mõlemad JSON-vormingus. Ärge muretsege, sa ei pea olema pro, sest VS kood pakub üsna lihtsat ja intuitiivset viisi oma kohanduste kiireks lisamiseks.

    Kõigepealt vaatame, milline on kahe konfiguratsioonifaili vahe. VS-koodil on kaks ulatust (globaalne ja kohalik) seadete jaoks, seega kaks eraldi faili:

    1. globaalne settings.json, kus konfiguratsioonieeskirjad kehtivad iga tööruumi jaoks
    2. tööruumiga seotud .vscode / settings.json, see on seotud ainult üksiku töötsooniga

    The globaalne settings.json faili leiate kaustast, kus teie operatsioonisüsteem salvestab kõik teised rakendusega seotud konfiguratsioonifailid:

    • Windowsis: % APPDATA% Kood Kasutaja seaded.json
    • Linuxis: $ HOME / .config / Code / Kasutaja / settings.json
    • Macis: $ HOME / Raamatukogu / rakenduste tugi / kood / kasutaja / settings.json

    The tööruumiga seotud settings.json fail salvestatakse teie praeguse projekti kausta. Vaikimisi ei ole see fail olemas, kuid kohe, kui lisate kohandatud tööruumi seadistuse, loob VS kood a .vscode / settings.json faili korraga ja asetab sellele kohandatud tööala-spetsiifilised konfiguratsioonid.

    Nii et millal te seda kasutate settings.json faile?

    Kui soovite, et VS-kood kasutab teie kohandatud konfiguratsioonieeskirju kõik teie projektid, pange need globaalsesse settings.json faili.

    Kui soovite, et teie seaded kehtiksid ainult teie praegune projekt, asetage need tööruumi settings.json faili.

    Tööruumi seaded tühistavad üldised seaded, olge siis ettevaatlik.

    Globaalseid seadeid nimetatakse “Kasutaja seaded” VS koodis. Avage need kas klõpsates Fail> Eelistused> Kasutaja seaded menüüst või alustades avalduse kirjutamisega “Kasutaja seaded” käsupaletti (avage see F1-ga).

    VS-kood avab üksteise kõrval kaks klaasi: vasakpoolne sisaldab kõiki seadistusi, mida on võimalik konfigureerida, ja õige kuvab globaalse settings.json faili. Peate oma kohandatud konfiguratsioonieeskirjad sellesse faili asetama.

    Nagu näete, ei pea te midagi muud tegema, lihtsalt kopeerige seaded, mida soovite muuta, vasakult paremale ja lisage muudetud väärtused.

    Vaatame lühikest näidet (kuid te saate teha muid muudatusi vastavalt teie individuaalsetele vajadustele). Ma muudan fontide perekonda, vähendan a vahekaart vaikimisi neljast tühikust kahele, vähendage maksimaalset tööfailide arvu üheksalt viiele ja muutke ühte CSS-i lintimisreeglitest, mis puudutavad duplikaadi stiilide kasutamist "ignoreerida" kuni "hoiatus".

    Pärast kopeerimise kleepimist, minu globaalne settings.json fail näeb välja selline:

     // Asetage oma seadistused sellesse faili, et kirjutada üle vaikeseaded "editor.fontFamily": "Courier New", "editor.tabSize": 2, "explorer.workingFiles.maxVisible": 5, "css.lint.duplicateProperties" : "hoiatus"

    Pärast modifitseeritud salvestamist settings.json faili redigeerimine muutub kohe (alloleval pildil on näha ainult fontide perekonna muutus):

    Sarnaselt saate muuta tööruumi sätteid. Nüüd peate klikkima Fail> Eelistused> Tööruumi seaded tööruumi juurde pääsemiseks klõpsake ülemises menüüribas .vscode / settings.json faili.

    Tööruumi seadistustel on täpselt samad seadistusvõimalused nagu kasutaja seadistused, ja saate kasutada sama kopeerimise kleepimise tehnikat. On ainult kaks erinevust, ulatus (kohalik, mitte globaalne) ja settings.json faili, kuhu teie kohandatud konfiguratsioonid salvestatakse.