dotnet / dotnet/aspnetcore

Publishing to Azure Container App messes up styles

Open
#60,244 15 comments 0 reactions 0 assignees View on GitHub
area-blazor External
Dominant language
C#
Stars
38.4k
Forks
10.9k
Avg merge
2d 5h
Merged PRs (30d)
276

Description

### Is there an existing issue for this?

- [x] I have searched the existing issues

### Describe the bug

I have a Blazor Web Assembly App that works fine when deployed to Azure App Service or when running locally. But when i containerize it and publish using it using Visual Studio 2022. i see some discrepancy with the scoped style sheet. My apps header & navigation menu losses the styles.

This is it looks when deployed to Azure web App(Not containerized or dockerized version).

![Image](https://github.com/user-attachments/assets/05e5f3a7-b1a4-4879-8559-fe7dce41170b)

This is how the dockerzied version when published looks. the header and navigation menu are not showing style.

![Image](https://github.com/user-attachments/assets/23614776-11c5-45f6-a11d-d337e23c614b)

I was able to narrow down the issue but not sure how to fix it. the issue seems to with scoped styles sheets.

The top row is referring to scoped style as shown in the picture.

![Image](https://github.com/user-attachments/assets/cc6863b5-9cc4-4168-a0d8-d4c00c3f8698)

but the style sheet has different value. i don't understand why they are out of sync.

![Image](https://github.com/user-attachments/assets/175862f1-71fa-4829-a07b-10c433794b3c)

Here is the docker file that i use to perform build. Not sure if i need to write some extra command for Blazor web assembly project

`See https://aka.ms/customizecontainer to learn how to customize your debug container and how Visual Studio uses this Dockerfile to build your images for faster debugging.

FROM mcr.microsoft.com/dotnet/aspnet:9.0 AS base
USER $APP_UID
WORKDIR /app
EXPOSE 8080
EXPOSE 8081

FROM mcr.microsoft.com/dotnet/sdk:9.0 AS build
ARG BUILD_CONFIGURATION=Release
WORKDIR /src
COPY ["Server/GetinLine.Server.csproj", "Server/"]
COPY ["Client/GetinLine.Client.csproj", "Client/"]
COPY ["Shared/GetinLine.Shared.csproj", "Shared/"]`

RUN dotnet restore "./Server/GetinLine.Server.csproj"
COPY . .
WORKDIR "/src/Server"
RUN dotnet build "./GetinLine.Server.csproj" -c $BUILD_CONFIGURATION -o /app/build

FROM build AS publish
ARG BUILD_CONFIGURATION=Release

RUN dotnet publish "./GetinLine.Server.csproj" -c $BUILD_CONFIGURATION -o /app/publish /p:ScopedCssBundlingEnabled=true,UseAppHost=false

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

### Expected Behavior

There should be no issue with style sheets.

### Steps To Reproduce

_No response_

### Exceptions (if any)

_No response_

### .NET Version

9.0.102

### Anything else?

_No response_

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.