Créer un package NuGet

Effectué

Lorsque vous empaquetez votre bibliothèque de classes Razor, vous disposez d’un livrable binaire que d’autres projets Blazor peuvent référencer et les composants qu’il contient peuvent être utilisés dans ces projets.

Dans une unité antérieure, vous avez créé une bibliothèque de classes Razor avec un composant modal qui fournit une fenêtre de dialogue modale pour les applications Blazor. Pour partager ce composant à utiliser dans d’autres applications, vous devez le empaqueter et le placer dans un référentiel ou un dossier dans lequel d’autres développeurs peuvent l’acquérir.

Dans cette unité, vous mettez à jour ce projet et générez un package NuGet. Enfin, vous déployez ce package NuGet sur votre application serveur Blazor.

Ajouter des propriétés de package à FirstClassLibrary

Commencez par mettre à jour le projet FirstClassLibrary avec des propriétés qui lui permettent d’être empaquetées pour le déploiement en tant que package NuGet.

  1. Ouvrez le fichier projet pour le projet FirstClassLibrary . Double-cliquez sur le projet dans l’Explorateur de solutions Visual Studio ou ouvrez le fichier FirstClassLibrary.csproj dans Visual Studio Code.

  2. En haut du fichier, dans la section avec la <PropertyGroup> balise, ajoutez le contenu suivant avant la balise de fermeture </PropertyGroup> :

        <PackageId>My.FirstClassLibrary</PackageId>
        <Version>0.1.0</Version>
        <Authors>YOUR NAME</Authors>
        <Company>YOUR COMPANY NAME</Company>
        <Description>This is a Razor component library with a cool modal window component.</Description>
      </PropertyGroup>
    

    Ce code définit votre bibliothèque de classes Razor comme ayant <PackageId> « My.FirstClassLibrary » et <Version> 0.1.0. Entrez votre propre nom et le nom de votre société dans ces deux champs.

Empaqueter la bibliothèque à réutiliser

Ensuite, vous exécutez la commande .NET sur la ligne de commande pour empaqueter la bibliothèque de classes Razor afin que d’autres applications en dehors de votre solution puissent les référencer.

Vous pouvez exécuter ces mêmes étapes dans votre processus d’intégration continue pour empaqueter une bibliothèque et la déployer sur NuGet.org, un dépôt GitHub ou un autre emplacement pour que votre organisation partage.

Dans le même dossier que le fichier FirstClassLibrary.csproj , exécutez la commande suivante :

dotnet pack

Cette commande écrit un fichier nommé My.FirstClassLibrary.0.1.0.nupkg dans votre dossier bin/Release .

Ajouter une référence au package NuGet dans l’application MyBlazorApp

Vous avez déjà référencé le projet FirstClassLibrary dans votre application MyBlazorApp, car il se trouvait dans la même structure de dossiers que l’application web.

À présent, vous annulez cette référence de projet et ajoutez une référence au package NuGet que vous avez créé précédemment.

Les étapes suivantes ne décrivent pas de configuration classique. Les projets de bibliothèque qui résident dans les mêmes dossiers ou solutions que les applications qui souhaitent les référencer peuvent référencer directement le projet, comme vous l’avez vu dans l’exercice précédent.

  1. Ouvrez le fichier MyBlazorApp.csproj en double-cliquant sur le nom du projet MyBlazorApp dans Visual Studio ou en ouvrant le fichier dans Visual Studio Code.

  2. Dans le fichier MyBlazorApp.csproj , supprimez la ligne suivante :

    <ProjectReference Include="..\FirstClassLibrary\FirstClassLibrary.csproj" />

  3. Dans le même dossier que MyBlazorApp.csproj, exécutez la commande suivante :

    dotnet add package My.FirstClassLibrary -s ../FirstClassLibrary/bin/Release
    

    Cette commande récupère le package NuGet que vous avez créé précédemment, installe une copie dans votre cache de package NuGet local, puis ajoute une référence à ce package dans le fichier MyBlazorApp.csproj .

Vérifier votre travail

Votre nouveau package s’est-il correctement installé ? Pouvez-vous démarrer l’application FirstServer et voir une fenêtre modale au démarrage de l’application ?

Voyons :

  1. Démarrez l’application MyBlazorApp dans Visual Studio, en sélectionnant F5 ou dans le dossier MyBlazorApp, en exécutant la commande suivante :

    dotnet run

  2. Dans votre navigateur, accédez à la page d’accueil de l’application MyBlazorApp : https://localhost:5000.

    La boîte de dialogue modale "My first Modal dialog" s'affiche-t-elle ? Si c’est le cas, félicitations ! Vous avez correctement empaqueté et déployé le projet FirstClassLibrary . Les applications partout peuvent désormais utiliser votre composant de fenêtre modale en référençant votre package NuGet nouvellement créé.