creare extension pack vscode

Generare un Extension Pack con Visual Studio Code

Pubblicato su 23 Ottobre, 2019 da Manuel Ricci in Web Development

Quando inizia ad insegnare nel corso di web design di Dot Academy perdevo, ogni volta, mezz’ora per far configurare ai ragazzi Visual Studio Code. Dirgli il nome delle estensioni utili, fargliele scaricare, assicurarsi che avessero inserito il nome giusto e che non avessero scaricato un’estensione omonima e allineare i vari ambienti al mio era una gran rottura di scatole.

Mi misi quindi alla ricerca di una soluzione e fortunatamente Visual Studio Code permette di creare un bundle di estensioni o Extension Pack da poter installare su altri terminali senza perdere più tutto quel tempo.

Sono sicuro che anche tu che stai leggendo questo articolo ti trovi nella stessa situazione in cui mi trovavo io. Nei paragrafi che seguono condividerò con te i passaggi necessari a creare il tuo primo Extension Pack da condividere con i tuoi studenti, colleghi, amici, cuggini e parenti tutti.

Come creare extension pack su Visual Studio Code con Yeoman e Generator Code

  1. Installare Yeoman e Generator Code via NPM attraverso il comando da terminale npm install -g yo generator-code
  2. Eseguire il comando yo code
  3. Dal menu che ti si presenterà subito dopo scegliere “New Extension Pack”
  4. Scegliere ‘Sì’ se si vogliono includere tutte le estensioni installate al momento in VS Code oppure scegliere ‘No’ per includerle manualmente successivamente
  5. Inserire il nome dell’extension pack (ad esempio: manuelextensionpack)
  6. Inserire nell’array extensionPack con gli ID delle varie estensioni (si trovano affianco al nome dell’estensione nel marketplace
  7. Inserire il campo publisher nel package.json utilizzando un valore url friendly (senza spazi)
  8. Da terminale/powershell creare il package con il comando vsce package (se vsce non è presente, installarlo globalmente tramite npm con il comando npm install -g vsce)

Il tuo Extension Pack a questo punto è pronto non ti rimane che condividerlo con chi desideri.

Installare un Extension Pack su Visual Studio Code

Per installare l’extension pack su Visual Studio Code ci sono due metodi, entrambi molto semplici.

Installare l’extension pack da VSIX

  1. Nella directory generata in precedenza troverai un file con estensione VSIX, cliccaci due volte per procedere con l’installazione

Installare l’extension pack da Visual Studio Code

Se il primo metodo non dovesse funzionare, molto raro, il secondo modo per installare un extension pack su Visual Studio Code è attraverso Visual Studio Code stesso, nel dettaglio:

  1. Andare in “Extensions” (Ctrl + Shift + X)
  2. Aprire il menu “More Action” (ellissi in alto a destra)
  3. Clicca su “Install from VSIX…”
  4. Trova il file con estensione VSIX e selezionalo
  5. Riavvia VSCode

Niente di più facile.

Ora con il tuo Extension Pack è pronto per l’installazione non perderai più tempo a leggere la tua lista e condividere un’estensione per volta con i tuoi colleghi o studenti.

Buona generazione!