I am trying to run a new blank blazor server web app (created by visual studio 2022) with dotnet 8 inside a docker container. While the app runs perfectly but the styles are total mess. Seems like the scoped generated css are not working.Here is my docker file:
# Use .NET 8 SDK image for developmentFROM mcr.microsoft.com/dotnet/sdk:8.0 AS dev# Set working directory inside the containerWORKDIR /app# Copy only the project file(s) to leverage Docker cacheCOPY *.csproj ./RUN dotnet restore# Copy the rest of the application filesCOPY . ./# Install dependencies for watch modeRUN dotnet dev-certs https --trust# Expose the Blazor Server portEXPOSE 5000EXPOSE 5001# Set the entrypoint to run in watch modeENTRYPOINT ["dotnet", "watch", "run", "--no-hot-reload", "--urls", "http://0.0.0.0:5000;https://0.0.0.0:5001"]I run this command then the app works perfectly on port 5000
docker run -it --rm -p 5000:5000 -p 5001:5001
Here is my App.razor's head section:
<head><meta charset="utf-8" /><meta name="viewport" content="width=device-width, initial-scale=1.0" /><base href="/" /><link rel="stylesheet" href="bootstrap/bootstrap.min.css" /><link rel="stylesheet" href="app.css" /><link rel="stylesheet" href="BlazorDemo.styles.css" /><link rel="icon" type="image/png" href="favicon.png" /><HeadOutlet />Here styles of app.css files are picked by the browser though, something is wrong with the generated BlazorDemo.styles.css styles.
I can only see two errors in the console saying "websocket connection failed (on two ports)"
Here is the output I see :