Online Code Snippet Converter -työkalu, tukee JavaScript / TypeScript / React / JSX / TSX      

Anna katkelman nimi (name)
Anna katkelman etuliite (prefix)
Anna katkelman kuvaus (description)
Syötä kooditeksti (code body)
Sukupolven tyyppi
Luotu katkelmatulos

VSCode Kuinka käyttää koodinpätkiä


Snippets in Visual Studio Code
VS-koodinpätkät ovat tehokas tapa parantaa koodauksen tuottavuutta automatisoimalla yleisesti käytettyjen koodilohkojen lisääminen. Ne voivat olla yksinkertaisia tekstilaajennuksia tai monimutkaisempia malleja, joissa on paikkamerkit ja muuttujat. Näin voit hyödyntää niitä:

Katkelmien luominen:

Katkelmien asetusten käyttäminen: Siirry kohtaan Tiedosto > Asetukset > Käyttäjän katkelmat (Koodi > Asetukset > Käyttäjän katkelmat macOS:ssä). Vaihtoehtoisesti voit käyttää komentopalettia (Ctrl+Shift+P tai Cmd+Shift+P) ja kirjoittaa "Preferences: Configure User Snippets".

Valitse kieli: Sinua pyydetään valitsemaan katkelmallesi kieli (esim. javascript.json, python.json jne.). Tämä varmistaa, että katkelma on saatavilla vain kyseiselle kielelle. Voit myös luoda "Global Snippets" -tiedoston, jos haluat koodinpätkän olevan käytettävissä kaikilla kielillä.

Määritä katkelma: Katkelmat määritellään JSON-muodossa. Jokaisella katkelmalla on nimi, etuliite (pikanäppäin, jonka kirjoitat katkelman käynnistämiseksi), runko (lisättävä koodi) ja valinnainen kuvaus.

Esimerkki (JavaScript):
{
  "For Loop": {
    "prefix": "forl",
    "body": [
      "for (let i = 0; i < $1; i++) {",
      "  $0",
      "}"
    ],
    "description": "For loop with index"
  }
}
Tässä esimerkissä:

"For Loop": katkelman nimi (viite).
"forl": etuliite. Kun kirjoitat "forl" ja painat sarkainta, katkelma lisätään.
"body": lisättävä koodi. $1, $2 jne. ovat sarkaimia (paikkamerkkejä). $0 on kursorin viimeinen sijainti.
"description": valinnainen kuvaus, joka näkyy IntelliSense-ehdotuksissa.
Katkelmien käyttäminen:

Kirjoita etuliite: Aloita määrittämäsi etuliite (esim. forl) kirjoittaminen oikeankieliseen tiedostoon.

Valitse katkelma: VS Coden IntelliSense ehdottaa katkelmaa. Valitse se nuolinäppäimillä tai napsauttamalla.

Käytä sarkainmerkkejä: Paina sarkainta siirtyäksesi sarkainten välillä ($1, $2 jne.) ja täytä arvot.

Muuttujat:

Katkelmat voivat myös käyttää muuttujia, kuten $TM_FILENAME, $CURRENT_YEAR jne. Katso täydellinen luettelo VS-koodin dokumentaatiosta.

Esimerkki muuttujilla (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}"
    ]
  }
}
Hallitsemalla katkelmia voit merkittävästi vähentää toistuvaa kirjoittamista ja varmistaa koodisi johdonmukaisuuden. Kokeile omien katkelmien luomista yleisesti käytetyille koodimalleille ja seuraa koodaustehokkuutesi huimaa nousua.