Blazor Web应用Docker构建报错：BuildWebCompiler提示No such file or directory

你遇到的核心问题是BuildWebCompiler NuGet包在Linux容器环境下找不到依赖的可执行文件，导致构建失败；但移除这个包后，CSS预编译步骤缺失，所以样式无法正常工作。下面是两种针对性的解决方案：

方案一：替换为跨平台CSS编译工具（推荐） #

早期版本的BuildWebCompiler对Linux支持有限，它依赖的编译器二进制多为Windows版本，在Linux容器中无法正常运行。我们可以改用Node.js生态下的跨平台工具（比如sass或less）完成CSS编译，步骤如下：

1. 移除BuildWebCompiler包引用
   从项目csproj文件中删除<PackageReference Include="BuildWebCompiler" Version="1.12.405" />这一行。

2. 添加Node.js编译配置
   在Blazor项目根目录（Web/App.Web）下创建package.json文件，示例内容（假设你用Sass编译）：

   {
     "scripts": {
       "build:css": "sass wwwroot/css/src/main.scss wwwroot/css/main.min.css --style compressed"
     },
     "devDependencies": {
       "sass": "^1.69.5"
     }
   }
   

   请根据你实际的预编译文件路径和目标输出路径调整build:css脚本。

3. 修改Dockerfile，添加Node.js环境
   更新构建阶段的镜像，先安装Node.js完成CSS编译，再执行dotnet发布：

   # BUILD
   FROM mcr.microsoft.com/dotnet/sdk:5.0 AS build
   # 安装Node.js和npm
   RUN apt-get update && apt-get install -y nodejs npm
   COPY . .
   # 进入项目目录，安装依赖并编译CSS
   RUN cd Web/App.Web && npm install && npm run build:css
   # 执行dotnet的恢复和发布步骤
   RUN dotnet restore "Web/App.Web/App.Web.csproj"
   RUN dotnet publish "Web/App.Web/App.Web.csproj" -c Release -o /out
   # RUNTIME
   FROM nginx:alpine AS final
   WORKDIR /usr/share/nginx/html
   # 修正原Dockerfile的路径错误，匹配nginx默认静态文件目录
   COPY --from=build /out/wwwroot /usr/share/nginx/html
   COPY nginx.conf /etc/nginx/nginx.conf
   

方案二：升级BuildWebCompiler并补全Linux依赖 #

如果坚持使用BuildWebCompiler，可以尝试以下调整：

• 升级BuildWebCompiler到最新版本（如1.12.446及以上），新版本已优化Linux环境支持
• 在构建镜像中安装必要的系统依赖，比如libgdiplus（部分版本的BuildWebCompiler需要）：
  在Dockerfile的build阶段添加：

  RUN apt-get update && apt-get install -y libgdiplus
  

• 检查项目中的compilerconfig.json配置，确保路径使用Linux风格的斜杠（/）而非Windows的反斜杠（\）

为什么移除包后CSS失效？ #

你的项目依赖BuildWebCompiler编译Less/Sass等预编译CSS文件，移除包后编译步骤不会自动执行，导致wwwroot目录下没有生成浏览器能识别的普通CSS文件，因此样式无法正常加载。

内容的提问来源于stack exchange，提问作者Agustin Cano Alvarez