Creación de un paquete NuGet

  • 3 minutos

Al empaquetar la biblioteca de clases de Razor, tendrá una entrega binaria a la que pueden hacer referencia los proyectos de Blazor, y los componentes que contiene se pueden usar en esos proyectos.

En una unidad anterior, creó una biblioteca de clases de Razor con un componente modal que proporciona una ventana de diálogo modal para aplicaciones Blazor. Si queremos compartir ese componente para usarlo en otras aplicaciones, es necesario empaquetarlo y colocarlo en un repositorio o en una carpeta donde otros desarrolladores puedan adquirirlo.

En esta unidad, vamos a actualizar ese proyecto y a generar un paquete de NuGet. Por último, implementaremos ese paquete de NuGet en nuestra aplicación de servidor de Blazor.

Adición de propiedades de paquete a FirstClassLibrary

En primer lugar, actualizaremos el proyecto FirstClassLibrary con propiedades que permitirán empaquetarlo para su implementación como un paquete de NuGet.

  1. Abra el archivo del proyecto MyClassLibrary haciendo doble clic en el proyecto en el Explorador de soluciones de Visual Studio o abriendo el archivo MyClassLibrary.csproj en Visual Studio Code.

  2. Cerca de la parte superior del archivo con la etiqueta <PropertyGroup>, agregue el siguiente contenido antes de la etiqueta de cierre </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>

    Este código define nuestra biblioteca de clases de Razor con "My.FirstClassLibrary" como valor de <PackageId> y 0.1.0 como valor de <Version>. Escriba su propio nombre y el nombre de empresa en esos dos campos.

Empaquetado de la biblioteca para reutilizarla

A continuación, vamos a ejecutar el comando de .NET en la línea de comandos para empaquetar la biblioteca de clases de Razor para que otras aplicaciones fuera de nuestra solución puedan hacer referencia a ella.

Puede ejecutar estos mismos pasos en el proceso de integración continua para empaquetar una biblioteca e implementarla en NuGet.org, un repositorio de GitHub u otra ubicación para que la organización la comparta.

En la misma carpeta que el archivo MyClassLibrary.csproj, ejecute el siguiente comando:

dotnet pack

Este comando escribe un archivo denominado My.FirstClassLibrary.0.1.0.nupkg en la carpeta bin/Debug.

Adición de una referencia al paquete NuGet en la aplicación MyBlazorServer

Ya ha hecho referencia al proyecto FirstClassLibrary en la aplicación MyBlazorServer, ya que se encontraba en la misma estructura de carpetas que la aplicación web.

Vamos a deshacer esa referencia de proyecto y a agregar una referencia al paquete de NuGet que hemos creado.

Estos pasos no son una configuración típica. Los proyectos de biblioteca que residen en las mismas carpetas o soluciones que las aplicaciones que quieren hacer referencia a ellos pueden hacer referencia al proyecto directamente como vimos en el ejercicio anterior.

  1. Abra el archivo MyBlazorServer.csproj. Para ello, haga doble clic en el nombre del proyecto MyBlazorServer en Visual Studio o abra ese archivo en Visual Studio Code.

  2. En el archivo MyBlazorServer.csproj, quite la línea siguiente:

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

  3. En la misma carpeta que MyBlazorServer.csproj, ejecute el comando siguiente:

    dotnet add package My.FirstClassLibrary -s ..\FirstClassLibrary\bin\Debug

    Este comando toma el paquete NuGet que creó anteriormente, instala una copia en la caché de paquetes NuGet local y agrega una referencia a ese paquete en el archivo MyBlazorServer.csproj.

Comprobar el trabajo

¿Se ha instalado correctamente el nuevo paquete? ¿Podemos iniciar la aplicación FirstServer y ver una ventana modal cuando se inicia la aplicación?

Lo averiguará ahora:

  1. Inicie la aplicación MyBlazorServer. Para ello, seleccione F5 en Visual Studio o ejecute el comando siguiente en la carpeta MyBlazorServer:

    dotnet run

  2. En el explorador, vaya a la página principal de la aplicación MyBlazorServer: https://localhost:5000.

    ¿Se muestra el cuadro de diálogo Mi primer cuadro de diálogo modal? Si es así, enhorabuena. Ha empaquetado e implementado correctamente el proyecto FirstClassLibrary. Todas las aplicaciones ya pueden usar el componente de ventana modal haciendo referencia al nuevo paquete de NuGet.