Il presente articolo è stato tradotto automaticamente.

ASP.NET

Creare i propri modelli di Visual Studio con SideWaffle

Sayed Hashimi
Tyler Hughes

Scaricare il codice di esempio

Grazie al rilascio della nuova comunità edizione del Visual Studio, gli sviluppatori che hanno utilizzato le edizioni Express in passato ora possono utilizzare le estensioni che hai tanto sentito parlare. Nel caso ve lo chiediate, estensioni sono plug-in che può estendere le funzionalità di Visual Studio. Ci sono tutti i tipi di estensioni disponibili.

Siamo sempre alla ricerca di modi codificare in modo più efficiente e, circa un anno fa, ci siamo imbattuti in un'estensione chiamata SideWaffle (sidewaffle.com). SideWaffle aggiunge il nuovo progetto e modelli realizzati da altri sviluppatori di Visual Studioe consente di creare i propri modelli e frammenti di codice. In questo articolo, ci potrai dare un'occhiata a SideWaffle e mostrarvi come creare i propri modelli e frammenti.

Perché usare SideWaffle?

Come notato, SideWaffle aggiunge nuovi modelli di progetto e di elemento Visual Studio. Forse vi starete chiedendo, "Come questo aiuta me?" Diciamo che sei un freelance Web developer che sviluppa siti Web per i clienti. Probabilmente avete cose specifiche che si ripete per ogni sito, forse usando una libreria JavaScript di terze parti come Knockout.js, o creazione di una struttura di cartelle del progetto specifico. Non importa come si imposta un progetto, SideWaffle può trasformarlo in un modello riutilizzabile. Plus, SideWaffle include un pacchetto di NuGet riutilizzabile, TemplateBuilder, che costruisce modelli in estensioni...

Creazione di un Template Pack

Prima di creare un modello, è necessario impostare l'ambiente di sviluppo. Il primo elemento che è necessario, ovviamente, è Visual Studio. Per questo articolo, abbiamo utilizzato la Community Edition di Visual Studio 2013 (bit.ly/1GUTLo3). Successivamente, è necessario il SDK Visual Studio 2013 (bit.ly/1NZVkD9). Infine, scaricare e installare l'estensione di SideWaffle da sidewaffle.com.

Con tutti gli strumenti installati e pronti a partire, iniziare aprendo Visual Studio e creazione di un nuovo progetto. Ci sono due tipi di progetti che è possibile utilizzare per creare un pacchetto di modello. Il primo è un progetto VSPackage, che vi dà la possibilità di aggiungere funzionalità come voci di menu o menu di contesto in Visual Studio. Il secondo è un progetto VSIX, che è solo un contenitore per contenere le risorse e i file di progetto e non fornisce funzionalità aggiuntive. Si possono trovare entrambi questi nella finestra di dialogo Nuovo progetto nodo Extensibility. Oggi, vogliamo solo un modello base, quindi un progetto VSIX funzionerà. È possibile lasciare il nome predefinito del progetto.

Una volta creato il progetto, il file manifesto si aprirà automaticamente. Il campo autore è richiesto, quindi aggiungere il vostro nome (o nome azienda) qui. La descrizione è quello che sarà mostrato nella finestra di dialogo Visual Studio estensione, in modo da essere sicuri di aggiungere qualche testo utile. Salvare il file e chiuderlo. Il passo successivo consiste nell'aggiungere il pacchetto TemplateBuilder NuGet al progetto, che si può fare utilizzando la finestra di dialogo Gestisci pacchetti NuGet o la Console di Gestione pacchetti .

Let's smettere per un secondo momento e dare un'occhiata dietro le quinte. Quando si installa TemplateBuilder in un progetto, ecco cosa succede:

1. Viene aggiunto un riferimento a TemplateBuilder.dll. Questo assembly contiene le procedure guidate personalizzate che possono essere utilizzate durante il processo di creazione del modello, così come altri aiutanti.
2. Per importare un file aggiuntivo di bersagli di MSBuild , consentendo il processo di compilazione supportare modelli aggiungendo al VSIX generato viene modificato il file di progetto. Perché questo è implementato con MSBuild, si può costruire l'estensione sui server di integrazione continua e dalla riga di comando.
3. Un file di puntelli è aggiunto al Properties\template-builder.props. È possibile specificare il nome di foglia predefinito del nodo che dovrebbe contenere i modelli. È anche possibile utilizzare questo file per controllare gli aspetti specifici di TemplateBuilder.
4. Il manifesto VSIX (in genere denominato source.exten­sion.vsixmanifest) è modificata per includere i tag Asset per i modelli generati.

Con TemplateBuilder installato, è possibile avviare la creazione di modelli. Quando si compila il progetto VSIX, TemplateBuilder interviene automaticamente e inizia l'elaborazione dei modelli.

Aggiungendo al progetto TemplateBuilder completa di tutti i requisiti preliminari. Ora possiamo aggiungere il modello di progetto alla soluzione attualmente aperta.

Creando il primo modello di progetto

Abbiamo intenzione di utilizzare un progetto esistente, che risulta essere un generico progetto di Contoso ASP.NET Web Forms/MVC. Questo progetto utilizza 3 Bootstrap, jQuery e Modernizr, che contribuirà ad accelerare ogni volta che creiamo un nuovo progetto basato su questo modello di sviluppo. Come regola generale, è una buona idea prima di eseguire qualsiasi progetto dopo averlo aggiunto alla soluzione. Questa è solo una precauzione per assicurarsi che il progetto funziona come previsto prima di creare il modello. Quindi eseguire questo progetto (Ctrl + F5) e assicurarsi che si sta lavorando.

Per creare un modello di progetto, è necessario effettuare le seguenti operazioni:

• Aggiungere il progetto alla soluzione e disattivarlo dall'edificio.
• Aggiungere un modello di riferimento per il progetto VSIX.
• Aggiungere file di metadati al progetto sorgente per informazioni modello.

Per mantenere il progetto modello di qualsiasi essere costruito più di Visual Studio in questa soluzione (si può ancora creare ed eseguire questo progetto in altre soluzioni), scegliere dal menu a discesa per la configurazione di compilazione e selezionare Configuration Manager dall'elenco. Viene visualizzata la finestra di dialogo Gestione configurazione. Per mantenere il progetto di essere costruito, deselezionare nella colonna Build. Una volta che hai fatto per la configurazione di Debug, selezionare il menu a tendina configurazione soluzione attiva e ripeti la procedura per la configurazione di rilascio.

Ci può venire un momento quando si desidera creare un modello contenente più progetti. Se si finisce per lavorare su un progetto complesso come quello e arrivare a questo passo, tenere a mente l'unica cosa che deve essere controllato per il Debug e configurazioni di rilascio è il progetto VSIX o package VS progetto, a seconda che quello che hai scelto prima. Figura 1 Mostra la finestra Configuration Manager dopo aver fermato il progetto da essere costruito.

Figura 1 disabilitare la configurazione di Debug da in costruzione

Avanti, volete collegare il progetto VSIX al progetto principale, che tu lo farai con l'aggiunta di un modello di riferimento. Tasto destro del mouse sul progetto VSIX e selezionare Aggiungi | Aggiungere il modello di riferimento (progetto SideWaffle) delle opzioni.

Apparirà una finestra di dialogo Selettore di progetto. Dall'elenco, selezionare il progetto che si desidera utilizzare come modello e fare clic su OK. Questo apporterà delle modifiche al progetto VSIX e vi verrà chiesto di ricaricare il progetto. Potete selezionare l'opzione ricarica tutti e poi aspettare che SideWaffle alla fine.

Ora, aggiungiamo i file di metadati del modello di progetto Web. Tasto destro del mouse sul progetto principale e selezionare Aggiungi | Nuovo elemento delle opzioni elencate. Nella finestra Aggiungi nuovo elemento di dialogo che appare, vai alla sezione estensibilità e selezionare il file del modello di progetto SideWaffle. È possibile utilizzare il nome predefinito dato dallo Visual Studio. Dopo aver selezionato il modello di elemento del file di progetto modello, fare clic sul pulsante Aggiungi.

L'elemento del file di progetto modello aggiunge due nuovi file al progetto principale. In primo luogo, aggiunge la _preprocess.xml, che dice Visual Studio dove inserire il tuo modello quando si apre la finestra di dialogo Nuovo progetto. Ecco il contenuto predefinito per questo file:

<?xml version="1.0" encoding="utf-8" ?>
<Preprocess>
  <TemplateInfo Path="CSharp\Web\SideWaffle"/>
  <Replacements Include="*.*" Exclude="*.vstemplate;
    *.jpg;*.png;*.ico;_preprocess.xml;_project.vstemplate.xml">
    <add key="ContosoWebFormsMvc" value="$safeprojectname$"/>
  </Replacements>
</Preprocess>

In questo file troverete le seguenti informazioni:

• Il percorso del nodo dove il modello verrà visualizzato nella finestra di dialogo Nuovo progetto.
• Informazioni su sostituzioni di origine.

L'attributo Path sul modello­Info elemento specifica la posizione dove il modello verrà visualizzato nella finestra di dialogo Nuovo progetto.

All'interno dell'elemento di sostituzioni, è possibile dichiarare eventuali sostituzioni che devono essere applicate durante il modello di processo di compilazione. Ottenere una sostituzione predefinito per il nome del progetto, che sarà sostituito con $safeprojectname$ nel modello generato. In genere questo aggiornerà le dichiarazioni dello spazio dei nomi. Utilizzando $safeprojectname$ quando viene utilizzato il modello in Visual Studio, le dichiarazioni dello spazio dei nomi verranno aggiornate con il nome specificato dall'utente. Non sei limitato a una sostituzione; è possibile aggiungere come necessari. A volte potrebbe essere necessario modificare le fonti per effettuare selezioni unico modo che le sostituzioni non in conflitto.

Ora, passiamo a altro file che è stato aggiunto al progetto, _project.vstemplate.xml, che contiene i metadati relativi al modello. Figura 2 Mostra il contenuto predefinito per il file, dove ContosoWebFormsMvc è il nome del progetto.

Figura 2 File generico _project.vstemplate.xml

<VSTemplate Version="3.0.0"
  xmlns="https://schemas.microsoft.com/developer/vstemplate/2005"
  Type="Project">
  <TemplateData>
    <Name>Your name here</Name>
    <Description>Project description here</Description>
    <DefaultName>ContosoWebFormsMvc</DefaultName>
    <ProjectType>CSharp</ProjectType>
    <ProjectSubType></ProjectSubType>
    <SortOrder>1000</SortOrder>
    <CreateNewFolder>true</CreateNewFolder>   
    <ProvideDefaultName>true</ProvideDefaultName>
    <LocationField>Enabled</LocationField>
    <EnableLocationBrowseButton>true</EnableLocationBrowseButton>
    <Icon>sw-file-icon.png</Icon>
    <!-- Indicates how many parent folders this item template should appear in -->
    <NumberOfParentCategoriesToRollUp>1</NumberOfParentCategoriesToRollUp>
  </TemplateData>
  <TemplateContent>
    <Project TargetFileName="ContosoWebFormsMvc.csproj"
      File="ContosoWebFormsMvc.csproj"
      ReplaceParameters="true">     
    </Project>
  </TemplateContent>
</VSTemplate>

Questo è un file. vstemplate standard; Potete trovare il riferimento per questo file in bit.ly/18T090m. Durante il processo di compilazione del modello, i file dal progetto saranno fusi in questo per creare il file. vstemplate finale che viene utilizzato per il modello. Ci sono alcuni elementi da notare qui. È necessario aggiornare i seguenti elementi sotto TemplateData:

• Nome: Questo è il nome del modello come mostrato nella finestra di dialogo Nuovo progetto.
• Descrizione: Questa è la descrizione del progetto che viene mostrato sul lato destro della finestra di dialogo Nuovo progetto quando è selezionato il modello.
• DefaultName: Questo è il nome predefinito del nuovo progetto creato. Un numero verrà automaticamente aggiunto a questo basato sul contenuto della directory.
• SortOrder: Questo determina la posizione dei modelli rispetto a altri modelli. Questo deve essere un multiplo di 10; più basso il numero, più alta la voce è ordinata in Visual Studio.
• NumberOfParentCategoriesToRollup: Questo determina quanti nodi padre in cui verrà mostrato il modello.

Si dovrebbero anche controllare nuovamente i valori per gli attributi TargetFileName e File sul tag di progetto. Questi deve corrispondere al nome del progetto su disco. Quando TemplateBuilder elabora questo file, il file. vstemplate finale si fonderà file sorgente elencati nel progetto. Se avete bisogno di una gestione speciale per qualsiasi file particolari, è possibile elencare quelli sotto l'elemento di progetto. Vedere il riferimento vstemplate legato in precedenza.

Ora che hai personalizzato sia _preprocess.xml e i. vstemplate.xml file, è il momento di testare il modello. Assicurarsi che il progetto VSIX è configurato come progetto di avvio in Visual Studio e quindi preme Ctrl + F5. Questo lancia l'istanza sperimentale di Visual Studio, e il modello di progetto verrà caricato automaticamente. Aprire la finestra di dialogo Nuovo progetto. Se vai al percorso che è stato impostato nel file _preprocess.xml, si dovrebbe vedere il modello appena creato. Andare avanti e creare un nuovo progetto utilizzando il nuovo modello di provarlo. Assicurarsi che tutto funziona come previsto.

Se tutto funziona bene, complimenti sono in ordine come appena creato il primo modello di progetto. Se si desidera installare questo modello o condividerlo con gli altri, andare alla cartella bin e trovare il file VSIX installare. Se voi o il vostro team intende condividere il vostro progetto tramite un repository Git, c'è un ulteriore passo che devi fare prima di caricarlo.

Quando si crea un progetto VSIX o package VS, Visual Studio aggiorna il file di progetto con valori per i tag StartProgram e StartArguments. Questi valori vengono utilizzati per garantire che F5 e Ctrl + F5 funziona correttamente. Tuttavia, questi cambiamenti sono configurati solo su un singolo utente. Quando si aggiunge il progetto al vostro repo, Visual Studio non include questi cambiamenti. Essi stanno salvate in un file di utente che non è controllato, così quando un altro utente apre la soluzione e si tenta di eseguire il progetto in un'istanza sperimentale, non può funzionare. Per risolvere questo problema, è sufficiente aprire il file del progetto csproj e aggiungere le seguenti righe appena prima della fine del primo gruppo di proprietà:

<StartProgram Condition=
    " '$(StartProgram)'=='' ">
    $(DevEnvDir)\devenv.exe
  </StartProgram>
  <StartArguments Condition=
    " '$(StartArguments)'=='' ">
    /rootsuffix Exp</StartArguments>

Ora eseguire il progetto di nuovo solo per assicurarsi che niente ha incasinato. Se funziona come previsto, sei pronto per aggiungere il progetto al tuo repository Git e condividerlo con tutti.

Hai appena creato un'estensione di Visual Studio che contiene un modello di progetto singolo. È possibile ripetere questo processo per includere modelli aggiuntivi nell'estensione. Non c'è limite al numero di modelli in un'estensione. È possibile condividere il modello di lavoro con gli altri che si possono provare. Per fare che è necessario distribuire il file. vsix che è nella cartella bin.

Se si desidera rendere disponibili pubblicamente l'estensione, è possibile caricare alla Galleria Visual Studio a bit.ly/115mBzm. Se la tua estensione contiene più di un modello (modello di un progetto o un elemento), la galleria non accetterà tali estensioni oggi. Invece di caricarle direttamente, è possibile caricare le estensioni come link nella galleria Visual Studio . Se fate questo, è necessario ospitare il file VSIX su un URL disponibili pubblicamente. È possibile utilizzare vsixgallery.com per ospitare il vsix file e si può utilizzare per ospitare nightly build. Si può facilmente automatizzare la pubblicazione nightly build di vsixgallery.com utilizzando Windows PowerShell o c#.

Abbiamo coperto solo le basi della creazione di modelli di progetto. Ci sono altri scenari, ad esempio modelli multiprogetto, utilizzando le procedure guidate personalizzate e molto altro ancora. Si può guardare il SideWaffle wiki su GitHub per ulteriori informazioni. Ora è il momento di passare a modelli di elemento.

Aggiunta di modelli di voce

Oltre che ti permette di creare i propri modelli di progetto, SideWaffle vi dà la possibilità di creare i propri modelli di elemento. Aggiungeremo al progetto di estensione che abbiamo appena creato.

Abbiamo osservato in precedenza che il progetto utilizzato 3 Bootstrap, jQuery e Modernizr. Una volta che il progetto di base è stato creato, ogni volta che vogliamo creare una nuova pagina del sito Web, dobbiamo creare un nuovo file HTML e includere tutti i file CSS e JavaScript manualmente. Sarebbe bello creare un modello di elemento personalizzato che fa tutto questo per noi.

Per fortuna, TemplateBuilder elabora modelli di progetto e di elemento nello stesso modo di mantenere le cose coerenti per lavorare con entrambi, così alcuni dei passaggi per la creazione di un modello di elemento sono identici a quelli che abbiamo già fatto per il modello di progetto. Durante la compilazione del modello, modelli di progetto e di elemento essenzialmente sono trattati allo stesso modo. Se stai per iniziare con un nuovo progetto, assicurarsi di aggiungere prima il pacchetto TemplateBuilder NuGet.

Successivamente, creare una cartella denominata ItemTemplates all'interno del progetto VSIX. Come mostrato Figura 3, questa è la cartella dove verranno memorizzati tutti i modelli di elemento.

Figura 3 il modello Will visualizzato nella cartella Web

Direttamente sotto la cartella ItemTemplates si creerà le directory per la voce di file modello. Il nome del primo figlio di ItemTemplates sarà il nodo in cui il modello verrà visualizzato per impostazione predefinita. Ad esempio, in Figura 3, si può vedere che abbiamo creato una cartella Web, quindi modelli in quella cartella apparirà sotto Visual C# \Web, o \Web Visual Basicper VB o similmente per le altre lingue. È anche possibile utilizzare _preprocess.xml per cambiare questo, ma per questo esempio, ti mettiamo tutti i modelli di elemento nella cartella Web.

Ora creiamo il nostro primo modello di elemento. Per ogni modello di elemento, potrai creare una cartella unica nel Web, quindi aggiungere il nostro primo modello di elemento, un modello base di bootstrap. Per iniziare, creare una nuova cartella sotto Web denominato Bootstrap 3 modello base. Questo modello sarà contenere due file HTML (HTMLPage1.html e HTMLPage2.html), quindi metterli in una cartella denominata vista. Per questo esempio, è possibile utilizzare il contenuto in Figura 4, che è stato preso da doc Bootstrap 3 a bit.ly/1iKHGX3, per entrambi i file.

Figura 4 HTML5 base modello Bootstrap

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>Basic Bootstrap Template</title>
  <link href="css/bootstrap.min.css" rel="stylesheet">
  <!-- HTML5 shim and Respond.js for IE8 support of -->
  <!-- HTML5 elements and media queries -->
  <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
  <!--[if lt IE9]>
  <script src=
    "https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
  <script src=
    "https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
  <![endif]-->
</head>
<body>
  <h1>Hello, world!</h1>
  <script src=
    "https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js">
    </script>
  <script src="js/bootstrap.min.js"></script>
</body>
</html>

Dopo aver aggiunto i file di origine per la creazione del modello, aggiungiamo i file che includono i metadati relativi al modello dell'elemento. Per fare questo, tasto destro del mouse sulla cartella Bootstrap 3 modello base e selezionare Aggiungi nuovo elemento. Come mostrato Figura 5, selezionare il modello di elemento di SideWaffle sotto il nodo Extensibility.

Figura 5 il modello di elemento di SideWaffle si trova nel nodo Extensibility del nuovo elemento finestra di dialogo Aggiungi

Il valore nella casella di testo nome viene ignorato qui perché i file hanno nomi file hardcoded. Quando si utilizza il modello di modello di elemento di SideWaffle, si ottiene quattro file in una nuova cartella denominata definizioni (vedere Figura 6). Quei quattro file sono CSharp.vstemplat-, VB.vstemplat-, Web.csharp.vstemplat - e il Web. VB.vstemplat, corrispondente al primo livello lingue/progetti supportati. CSharp.vstemplate è usato per i modelli che verranno visualizzati nel nodo Visual c# per progetti c#. VBvstemplate viene utilizzato per i modelli che verranno visualizzati sotto Visual Basic nella finestra di dialogo nuovo elemento. I due file Web sono per mostrare il modello per i progetti Web. Nota per visualizzare il modello, è necessario cambiare l'estensione da CSharp.vstemplat - a CSharp.vstemplate. È possibile eliminare i file in cui tu non sei interessato. Come mostrato Figura 6, ti tenere tutti e quattro e modificare l'estensione in vstemplate.

Figura 6 il SideWaffle elemento modello aggiunge una cartella definizioni e vstemplate quattro file

Ora dobbiamo modificare i file vstemplate per includere i due file di origine HTML nel template, quindi aggiungeremo alcuni elementi ProjectItem al file CSharp.vstemplate sotto l'elemento TemplateContent. Il contenuto del file dovrebbe essere simile a quello mostrato nella Figura 7.

Figura 7 campione _project.vstemplate.xml File con più file aggiunti al modello di elementi

<VSTemplate Version="3.0.0"
  xmlns="https://schemas.microsoft.com/developer/vstemplate/2005" Type="Item">
  <TemplateData>
    <ProjectType>CSharp</ProjectType>
    <DefaultName>Bootstrap 3 Basic Template.txt</DefaultName>
    <Name>Bootstrap 3 Basic Template</Name>
    <Description>A basic HTML5 template using Bootstrap 3</Description>   
    <Icon>icon.png</Icon>
    <NumberOfParentCategoriesToRollUp>1</NumberOfParentCategoriesToRollUp>
  </TemplateData>
  <TemplateContent>
    <References />
    <ProjectItem TargetFileName="View/HTMLPage1.html" >
      View/HTMLPage1.html</ProjectItem>
    <ProjectItem TargetFileName="View/HTMLPage2.html" >
      View/HTMLPage2.html</ProjectItem>
  </TemplateContent>
</VSTemplate>

Come potete vedere, abbiamo aggiunto due progetto­voce voci corrispondenti ai due file che sono stati creati. Il valore dell'elemento indica il file sul disco dove è contenuto il modello. Il valore di TargetFileName determinerà i nomi dei file visualizzati quando viene richiamata la finestra di dialogo nuovo elemento.

Dopo aver aggiunto il modello di elemento e incluso i file, è possibile testare il modello dell'elemento. Come l'ultima volta, premere Ctrl + F5 per aprire l'istanza sperimentale di Visual Studio, quindi creare o aprire un progetto di esempio e provare il modello.

Successivamente, illustreremo frammenti, ma prima una breve nota sulle sostituzioni. Nella sezione progetto modello, hai visto come _preprocess.xml potrebbe essere utilizzato per aggiornare il contenuto del progetto durante il processo di compilazione del modello. Se avete bisogno di effettuare eventuali sostituzioni per i modelli di elemento, è possibile utilizzare la stessa tecnica. Proprio come con i modelli di progetto, abbiamo coperto solo le basi della creazione di modelli di elemento. C'è un intero lotto di terreno che non abbiamo ottenuto a — utilizzando le procedure guidate personalizzate, incorporamento di icone come risorse, nidificazione file e altro ancora. Per informazioni su questi argomenti, è possibile fare riferimento al contenuto esistente per i modelli standard di Visual Studio . Si può anche guardare il wiki la pagina del progetto SideWaffle GitHub.

Come aggiungere snippet

Abbiamo tutti i frammenti di codice che usiamo regolarmente nei nostri progetti. Se chiedo se c'è un modo per ottenere Visual Studio per tenere traccia dei tuoi preferiti frammenti, sei fortunato. Proprio come prima, iniziare creando un progetto VSIX e aggiornare i campi autore e descrizione della source.extension.vsixmanifest.

Per avere Visual Studio leggere i file di frammento, è necessario creare una struttura di cartelle che riconosce. Figura 8Mostra la struttura se si dovesse creare frammenti per ogni linguaggio di programmazione.

Figura 8 le cartelle mostrate qui vengono riconosciuti automaticamente da Visual Studio

Dopo aver creato le cartelle che è necessario, è possibile aggiungere i file frammento nella cartella SideWaffle per la rispettiva lingua del frammento. Nell'aggiungere ogni file, fare clic sul file e guardare la sua operazione di compilazione nella finestra Proprietà. Ogni file deve avere la proprietà Build Action impostata contenuto quindi Visual Studio include automaticamente il file nel progetto VSIX quando è costruito.

Successivamente, è necessario aggiungere un file di definizione del pacchetto nella directory principale del tuo progetto. Il file di pkgdef verrà impostato alcune chiavi del registro di sistema, consentendo di utilizzare i frammenti aggiunti nell'ultimo passaggio. Perché Visual Studio non sono dotati di un modello di elemento per pkgdef file, dovrete creare un file di testo e rinominarlo per utilizzare l'estensione pkgdef. È possibile denominare il file di pkgdef quello che vuoi, ma mantenere le cose semplici abbiamo chiamato la nostra snippets.pkgdef. Come mostrato Figura 9, una chiave di registro diverso deve essere aggiornato per ogni lingua che si utilizza.

Figura 9 File di definizione del pacchetto che contiene le informazioni del registro di sistema per ogni lingua

// ---------------------- SNIPPETS ----------------------
// Visual Basic
[$RootKey$\Languages\CodeExpansions\Basic\Paths]
"My Snippets"="$PackageFolder$\Snippets\VisualBasic\My Snippets"
// C++
[$RootKey$\Languages\CodeExpansions\C/C++\Paths]
"My Snippets"="$PackageFolder$\Snippets\C++\My Snippets"
// C#
[$RootKey$\Languages\CodeExpansions\CSharp\Paths]
"My Snippets"="$PackageFolder$\Snippets\CSharp\My Snippets"
// CSS
[$RootKey$\Languages\CodeExpansions\CSS\Paths]
"My Snippets"="$PackageFolder$\Snippets\CSS\My Snippets"
// HTML
[$RootKey$\Languages\CodeExpansions\HTML\Paths]
"My Snippets"=""$PackageFolder$\Snippets\HTML\My Snippets"
// JavaScript
[$RootKey$\Languages\CodeExpansions\JavaScript\Paths]
"My Snippets"="$PackageFolder$\Snippets\JavaScript\My Snippets"
// SQL
[$RootKey$\Languages\CodeExpansions\SQL_SSDT\Paths]
"My Snippets"="$PackageFolder$\Snippets\SQL\My Snippets"
// XML
[$RootKey$\Languages\CodeExpansions\XML\Paths]
"My Snippets"="$PackageFolder$\Snippets\XML\My Snippets"

L'ultimo passo prima di poter testare il vostro nuovo snippet è per registrare il file di pkgdef. Aprire il file source.extension.vsixmanifest, passare alla scheda attività e fare clic sul pulsante New. Dovrebbe apparire la finestra di dialogo Aggiungi nuovo Asset, offrendo diverse opzioni. Come mostrato Figura 10, selezionare Microsoft.VisualStudio.VsPackage per il tipo di risorsa.

Figura 10 registrazione di File di definizione del pacchetto con Visual Studio

Avanti, selezionare File su filesystem come il tipo di origine. Questo farà sì che la finestra di dialogo espandere, dandovi la possibilità di selezionare il file pkgdef creato. Selezionare il file di pkgdef e fare clic su OK.

Ora sei pronto per testare i tuoi frammenti. Come prima, colpire Ctrl + F5 per aprire un'istanza sperimentale di Visual Studio. Quindi aprire il progetto utilizzato in precedenza per la prova e passare a strumenti | Gestione frammenti di codice. Se tutto viene caricato correttamente, hai finito.

Abbiamo ora esaminato i principali vantaggi di SideWaffle finora: modelli di progetto e di elemento e frammenti di codice. Quali sono le prospettive?

Il team di sviluppo sta attualmente lavorando su una caratteristica di modelli dinamici per SideWaffle che speriamo di avere pronto per la prossima release. Questo renderà molto più semplice per creare e gestire modelli. L'idea è che potete pubblicare i vostri modelli a una cartella di rete o un repo Git e condividerli con amici e colleghi. Poi è possibile configurare SideWaffle per raccogliere i modelli da posizione remota. L'utente finale sarà in grado di controllare la frequenza di controllare gli aggiornamenti. Per tenere il passo con questa caratteristica, visita la pagina del modello dinamico a bit.ly/18DepKM.

Conclusioni

Come si è visto in questo articolo, creare i propri modelli è abbastanza semplice. Ora che sapete come fare questo, si possono mostrare ai tuoi amici e colleghi, quanto tempo si sta salvando con SideWaffle. Ricordate, quando il vostro pacchetto di modello di condivisione con la Comunità, siete sempre Benvenuti a caricarle alla Galleria Visual Studio , e vsixgallery.com è sempre disponibile, se ne avete bisogno. Se si desidera condividere i propri modelli con gli altri tramite SideWaffle, inviare una richiesta di tirare su GitHub. Ora, iniziare a creare il tuo pacchetto di modello e fateci sapere se avete bisogno di aiuto.

Tyler Hughes è un neolaureato della Jacksonville State University dove studiò sistemi informativi Computer. Egli è stato uno sviluppatore hobbista per cinque anni e attualmente fa parte del team sviluppatore principale SideWaffle.

Sayed Ibrahim Hashimi è un senior program manager di Microsoft team Web Visual Studio . Ha scritto diversi libri su tecnologie Microsoft ed è il creatore di SideWaffle e TemplateBuilder, così come co-creatore di OmniSharp.