Conteneurisation d'applications Angular 6 SPA Template ASP .NET Core 2.1

MISE À JOUR du 24/07/2019 voir à la fin de l'article.

MISE À JOUR du 11/01/2018 {
Merci à l'aide dans les commentaires, ci-dessous est une version plus idéologiquement correcte du fichier docker.

Le modèle de projet de modèle SPA angulaire standard contient une erreur. Développeurs en version net .core 2.1. supprimé de l'image microsoft / dotnet: 2.1-sdk utilisé pour construire nodejs, mais le code qui l'utilise est resté dans le fichier de projet. En savoir plus ici github.com/aspnet/Announcements/issues/298
Vous devez modifier manuellement le fichier de projet * .csproj en supprimant le code suivant


}

Malheureusement, je n'ai trouvé de solution toute faite nulle part. J'ai dû compiler des informations à partir de plusieurs sources. Pour lancer l'application dans le docker Angular 6/7 en tant que projet sur ASP .NET Core.

Si nous activons la prise en charge de docker pour un projet avec une application angulaire à l'aide d'outils standard, le fichier docker créera une image d'application basée sur microsoft / dotnet: image 2.1-aspnetcore-runtime. Aucun serveur node.js n'est inclus dans cette image de base Et le résultat de l'exécution sera une erreur ASP .NET Core

 An unhandled exception occurred while processing the request. The NPM script 'start' exited without indicating that the Angular CLI was listening for requests 

Pour résoudre cette erreur, vous devez mettre à jour le fichier Docker en ajoutant l'installation node.js et angular.
De plus, étant donné que le développement est sous Windows et que tout commence dans un conteneur Docker basé sur Ubunty, si des fichiers de style scss ou sass sont utilisés, ils sont compilés par la CLI angulaire à l'aide de node-sass, et au démarrage, il donne une erreur «Node Sass ne fait pas mais prend en charge votre environnement actuel: Windows 64 bits avec un runtime non pris en charge. " Vous devez exécuter la commande:

 npm rebuild node-sass 

npm téléchargera les scripts nécessaires pour la plateforme actuelle et reconstruira les fichiers css.

Le fichier Docker final pour une application angulaire basée sur un projet ASP .NET Core 2.1 est le suivant

 FROM microsoft/dotnet:2.1-aspnetcore-runtime AS base # Setup NodeJs RUN apt-get update && \ apt-get install -y wget && \ apt-get install -y gnupg2 && \ wget -qO- https://deb.nodesource.com/setup_8.x | bash - && \ apt-get install -y build-essential nodejs RUN npm install @angular/cli -g # End setup WORKDIR /app EXPOSE 80 FROM microsoft/dotnet:2.1-sdk AS build WORKDIR /src COPY ["AngularWebApp/AngularWebApp.csproj", "AngularWebApp/"] RUN dotnet restore "AngularWebApp/AngularWebApp.csproj" COPY . . WORKDIR "/src/AngularWebApp" RUN dotnet build "AngularWebApp.csproj" -c Release -o /app FROM build AS publish RUN dotnet publish "AngularWebApp.csproj" -c Release -o /app FROM base AS final WORKDIR /app COPY --from=publish /app . WORKDIR /app/ClientApp RUN npm install RUN npm rebuild node-sass WORKDIR /app ENTRYPOINT ["dotnet", "AngularWebApp.dll"] 

J'ai utilisé la version stable LTS de Node.js, actuellement 8.x, mais peut être modifiée pour être plus pertinente.

De plus, je note également que Windows pardonne les erreurs associées à un cas différent de caractères, mais Linux ne le pardonne pas. Et le projet qui a fonctionné pendant le développement refusera de compiler dans le conteneur, donnant une erreur

 docker ERROR in error TS1149: File name 'filename.ts' differs from already included file name 'FileNames.ts' only in casing 

Afin d'éviter de telles erreurs même au stade de la compilation, je recommande d'ajouter l'option appropriée "forceConsistentCasingInFileNames": true au fichier tsconfig.json dans la section compilerOptions

 { "compilerOptions": { "forceConsistentCasingInFileNames": true } } } 

MISE À JOUR à partir du 24/07/2019 {
Encore une fois, grâce à l'aide dans les commentaires, la version optimisée du fichier docker est présentée ci-dessous.

}

angulaire, angulaire6 / 7, asp .net core 2.1, docker