CODEWITHSUNDEEP
angulardocker.net-coredocker-composedockerfile
JasonlPrice
JasonlPrice

Reputation: 307

Angular 6 Application hosted by .Net Core in Docker Container throws Npm exception

I have a created an Angular 6 .Net Core 2.1 application that should run in a Linux Docker container. If I use npm start, without docker, the application works fine. When I use docker compose however, I get the following exception. 

AggregateException: One or more errors occurred. (One or more errors occurred. (Failed to start 'npm'. To resolve this:. [1] Ensure that 'npm' is installed and can be found in one of the PATH directories. Current PATH enviroment variable is: /usr/local/sbin:/usr/local/bin:/usr/sbin:/usr/bin:/sbin:/bin Make sure the executable is in one of those directories, or update your PATH. [2] See the InnerException for further details of the cause.))

    System.Threading.Tasks.Task<TResult>.GetResultCore(bool waitCompletionNotification)
    Microsoft.AspNetCore.SpaServices.Extensions.Util.TaskTimeoutExtensions.WithTimeout<T>(Task<T> task, TimeSpan timeoutDelay, string message)
    Microsoft.AspNetCore.SpaServices.Extensions.Proxy.SpaProxy.PerformProxyRequest(HttpContext context, HttpClient httpClient, Task<Uri> baseUriTask, CancellationToken applicationStoppingToken, bool proxy404s)
    Microsoft.AspNetCore.Builder.SpaProxyingExtensions+<>c__DisplayClass2_0+<<UseProxyToSpaDevelopmentServer>b__0>d.MoveNext()
    Microsoft.AspNetCore.Builder.RouterMiddleware.Invoke(HttpContext httpContext)
    Microsoft.AspNetCore.StaticFiles.StaticFileMiddleware.Invoke(HttpContext context)
    Microsoft.AspNetCore.Diagnostics.DeveloperExceptionPageMiddleware.Invoke(HttpContext context)

My Dockerfile is simple

FROM microsoft/dotnet:2.1-aspnetcore-runtime AS base
WORKDIR /app
EXPOSE 13559

FROM microsoft/dotnet:2.1-sdk AS build


ENV NODE_VERSION 8.11.4
ENV NODE_DOWNLOAD_SHA 0e20787e2eda4cc31336d8327556ebc7417e8ee0a6ba0de96a09b0ec2b841f60
RUN apt-get update && apt-get install curl -y
RUN curl -SL "https://nodejs.org/dist/v${NODE_VERSION}/node-v${NODE_VERSION}-linux-x64.tar.gz" --output nodejs.tar.gz \
    && echo "$NODE_DOWNLOAD_SHA nodejs.tar.gz" | sha256sum -c - \
    && tar -xzf "nodejs.tar.gz" -C /usr/local --strip-components=1 \
    && rm nodejs.tar.gz \
    && ln -s /usr/local/bin/node /usr/local/bin/nodejs

WORKDIR /src
COPY angular6.csproj ./
RUN dotnet restore /angular6.csproj
COPY . .
WORKDIR /src/
RUN dotnet build angular6.csproj -c Release -o /app

FROM build AS publish
RUN dotnet publish angular6.csproj -c Release -o /app

FROM base AS final
WORKDIR /app
COPY --from=publish /app .
ENTRYPOINT ["dotnet", "angular6.dll"]

My docker-compose is

version: '3.4'

services:
  angular6:
    image: angular6
    build:
      context: .
      dockerfile: Dockerfile

My docker-compose.override is version: '3.4'

services:
  angular6:
    environment:
      - ASPNETCORE_ENVIRONMENT=Development
      - ASPNETCORE_URLS=http://+:80
    ports:
      - "13559:80"
    volumes:
      - ${APPDATA}/ASP.NET/Https:/root/.aspnet/https:ro
      - ${APPDATA}/Microsoft/UserSecrets:/root/.microsoft/usersecrets:ro

Startup

public void ConfigureServices(IServiceCollection services)
        {
            services.AddMvc().SetCompatibilityVersion(CompatibilityVersion.Version_2_1);

            // In production, the Angular files will be served from this directory
            services.AddSpaStaticFiles(configuration =>
            {
                configuration.RootPath = "ClientApp/dist";
            });
        }

        // This method gets called by the runtime. Use this method to configure the HTTP request pipeline.
        public void Configure(IApplicationBuilder app, IHostingEnvironment env)
        {
            if (env.IsDevelopment())
            {
                app.UseDeveloperExceptionPage();
            }
            else
            {
                app.UseExceptionHandler("/Error");
                app.UseHsts();
            }

            //app.UseHttpsRedirection();
            app.UseStaticFiles();
            app.UseSpaStaticFiles();

            app.UseMvc(routes =>
            {
                routes.MapRoute(
                    name: "default",
                    template: "{controller}/{action=Index}/{id?}");
            });

            app.UseSpa(spa =>
            {
                // To learn more about options for serving an Angular SPA from ASP.NET Core,
                // see https://go.microsoft.com/fwlink/?linkid=864501

                spa.Options.SourcePath = "ClientApp";

                if (env.IsDevelopment())
                {
                    spa.UseAngularCliServer(npmScript: "start");
                }
            });
        }

I know that npm is installed because I have logged into the container. I haven't changed any of the Angular 6 templated files from dotnet new angular -o angular6. So it seems to be a config issue, but i can't figure out where. Any help would be greatly appreciated.

Upvotes: 2

Views: 3299

Answers (2)

Martin Brandl
Martin Brandl

Reputation: 58961

I made a base image that already has node and npm preinstalled to speed up the build:

FROM microsoft/dotnet:2.2-aspnetcore-runtime AS base
WORKDIR /app
EXPOSE 80
EXPOSE 443

FROM mjibrandl/dotnetcore-angular:latest AS build
WORKDIR /src
COPY ["dotnet-angular-sample.csproj", ""]
RUN dotnet restore "dotnet-angular-sample.csproj"
COPY . .
WORKDIR "/src/"
RUN dotnet build "dotnet-angular-sample.csproj" -c Release -o /app

FROM build AS publish
RUN dotnet publish "dotnet-angular-sample.csproj" -c Release -o /app

FROM base AS final
WORKDIR /app
COPY --from=publish /app .
ENTRYPOINT ["dotnet", "dotnet-angular-sample.dll"]

There is also a documentation available here: Setup Azure DevOps YAML pipeline to publish a .NET Core Angular 7 docker container to Azure Container Registry

Upvotes: 1

JasonlPrice
JasonlPrice

Reputation: 307

I ended up changing my Dockerfile to the following and the error went away.

FROM microsoft/dotnet:2.1-sdk 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
# End setup

WORKDIR /app
EXPOSE 32772

FROM microsoft/dotnet:2.1-sdk AS build
WORKDIR /src
COPY src/Horizon.Client.Dispatcher/Horizon.Client.Dispatcher.csproj src/Horizon.Client.Dispatcher/
RUN dotnet restore src/Horizon.Client.Dispatcher/Horizon.Client.Dispatcher.csproj

COPY . .
WORKDIR /src/src/Horizon.Client.Dispatcher
RUN dotnet build Horizon.Client.Dispatcher.csproj -c Release -o /app

FROM build AS publish
RUN dotnet publish Horizon.Client.Dispatcher.csproj -c Release -o /app

FROM base AS final
WORKDIR /app
COPY --from=publish /app .
ENTRYPOINT ["dotnet", "Horizon.Client.Dispatcher.dll"]

Upvotes: 1

Related Questions