Online nástroj na prevod kódu na úryvky, podpora JavaScript / TypeScript / React / JSX / TSX      

Zadajte názov úryvku (name)
Zadajte predponu úryvku (prefix)
Zadajte popis úryvku (description)
Zadajte text kódu (code body)
Typ generácie
Vygenerovaný výsledok úryvku

VSCode Ako používať útržky kódu


Snippets in Visual Studio Code
Útržky kódu VS predstavujú účinný spôsob, ako zvýšiť produktivitu kódovania automatizáciou vkladania bežne používaných blokov kódu. Môžu to byť jednoduché rozšírenia textu alebo zložitejšie šablóny so zástupnými symbolmi a premennými. Tu je návod, ako ich využiť:

Vytváranie úryvkov:

Prístup k nastaveniam úryvkov: Prejdite na Súbor > Predvoľby > Používateľské úryvky (Kód > Predvoľby > Používateľské úryvky v systéme macOS). Prípadne použite paletu príkazov (Ctrl+Shift+P alebo Cmd+Shift+P) a zadajte „Predvoľby: Konfigurovať používateľské úryvky“.

Vyberte jazyk: Zobrazí sa výzva na výber jazyka pre váš úryvok (napr. javascript.json, python.json atď.). To zaisťuje, že úryvok je dostupný iba pre tento konkrétny jazyk. Môžete tiež vytvoriť súbor „Global Snippets“, ak chcete, aby bol úryvok dostupný vo všetkých jazykoch.

Definujte úryvok: Úryvky sú definované vo formáte JSON. Každý úryvok má názov, predponu (skratka, ktorú zadáte na spustenie úryvku), telo (kód, ktorý sa má vložiť) a voliteľný popis.

Príklad (JavaScript):
{
  "For Loop": {
    "prefix": "forl",
    "body": [
      "for (let i = 0; i < $1; i++) {",
      "  $0",
      "}"
    ],
    "description": "For loop with index"
  }
}
V tomto príklade:

„For Loop“: názov úryvku (pre vašu informáciu).
"forl": Predpona. Ak napíšete „forl“ a stlačíte kláves Tab, vložíte úryvok.
"body": Kód, ktorý sa má vložiť. $1, $2 atď. sú zarážky (zástupné symboly). $0 je konečná pozícia kurzora.
"description": Voliteľný popis zobrazený v návrhoch IntelliSense.
Používanie úryvkov:

Zadajte predponu: V súbore správneho typu jazyka začnite písať predponu, ktorú ste definovali (napr. forl).

Vyberte Snippet: IntelliSense VS Code navrhne úryvok. Vyberte ho pomocou šípok alebo kliknutím.

Používanie zarážok tabulátora: Stlačením klávesu Tab môžete prechádzať medzi zarážkami tabulátora (1, 2, atď.) a vypĺňať hodnoty.

Premenné:

Úryvky môžu využívať aj premenné ako $TM_FILENAME, $CURRENT_YEAR atď. Úplný zoznam nájdete v dokumentácii VS Code.

Príklad s premennými (Python):
{
  "New Python File": {
    "prefix": "newpy",
    "body": [
      "#!/usr/bin/env python3",
      "# -*- coding: utf-8 -*-",
      "",
      "# ${TM_FILENAME}",
      "# Created by: ${USER} on ${CURRENT_YEAR}-${CURRENT_MONTH}-${CURRENT_DATE}"
    ]
  }
}
Zvládnutím úryvkov môžete výrazne obmedziť opakované písanie a zabezpečiť konzistentnosť kódu. Experimentujte s vytváraním vlastných úryvkov pre bežne používané vzory kódu a sledujte, ako vaša efektivita kódovania stúpa.