我之前踩过Angular 17新构建器的Docker部署坑，太懂你这种明明跟着步骤走却死活跑不起来的憋屈了！你的问题核心其实是Angular 17用的@angular-devkit/build-angular:application构建器，产物目录结构和旧版完全不一样，导致Nginx加载不到正确的静态资源，所以才显示默认页面。

问题根源分析 #

Angular 17引入的application构建器（就是你配置里的"builder": "@angular-devkit/build-angular:application"），为了支持SSR、SSG等多平台能力，生产构建后的产物目录结构变了：

• 旧版传统构建器：dist/项目名 直接包含所有静态资源
• 新版application构建器：dist/项目名/browser 才是纯静态单页应用的产物目录（如果启用SSR还会有server目录）
  你现在Dockerfile里COPY的是/app/dist/projet-daret，这个目录下并没有直接的index.html，Nginx找不到入口文件，就自动显示默认页面了。

具体修复步骤 #

1. 先本地确认产物目录（可选但推荐）

先在本地跑一次构建命令，验证产物结构：

ng build --configuration=production

打开项目根目录的dist文件夹，你会看到projet-daret目录下还有个browser子目录，里面才是真正的index.html、js、css等静态资源。

2. 修改Dockerfile的产物复制路径

把Dockerfile Stage 2里的COPY命令修改成：

COPY --from=build /app/dist/projet-daret/browser /usr/share/nginx/html

这样Nginx的html目录下就有了正确的Angular静态资源。

3. 优化Nginx配置（解决刷新404问题，可选但重要）

Angular是单页应用，直接用Nginx默认配置的话，刷新页面会出现404。可以在项目根目录新建一个nginx.conf文件，内容如下：

server {
  listen 80;
  server_name localhost;
  root /usr/share/nginx/html;
  index index.html index.htm;

  location / {
    try_files $uri $uri/ /index.html;
  }

  error_page 404 /index.html;
  error_page 500 502 503 504 /50x.html;
  location = /50x.html {
    root /usr/share/nginx/html;
  }
}

然后在Dockerfile的Stage 2里新增一行，用这个配置替换Nginx的默认配置：

COPY nginx.conf /etc/nginx/conf.d/default.conf

4. 完善docker-compose配置

你给出的docker-compose内容不完整，记得加上端口映射，不然本地无法访问容器里的应用：

version: '3.8'
services:
  angular-app:
    build: .
    ports:
      - "80:80"
    restart: unless-stopped # 可选，容器崩溃后自动重启

5. 清理旧镜像并重新构建运行

先清理之前的旧镜像、容器和数据卷，避免缓存干扰：

docker-compose down -v --rmi all

然后重新构建启动：

docker-compose build
docker-compose up

现在访问http://localhost，应该就能看到你的Angular 17应用了！

关于Node.js部署的补充 #

如果你之前尝试用Node.js部署没成功，大概率也是因为产物路径不对。如果你的项目是纯静态单页应用，Nginx是更轻量高效的选择；如果启用了SSR，那需要运行dist/projet-daret/server目录下的服务端入口文件，比如：

# 仅作SSR部署参考，静态应用优先用Nginx
FROM node:20-alpine as build
WORKDIR /app
COPY package*.json ./
RUN npm install
COPY . .
RUN ng build --configuration=production

FROM node:20-alpine
WORKDIR /app
COPY --from=build /app/dist/projet-daret/server ./
COPY --from=build /app/package*.json ./
RUN npm install --only=production
EXPOSE 4000
CMD ["node", "server.mjs"]

不过看你的需求，应该是纯静态应用，所以还是Nginx方案更合适。

备注：内容来源于stack exchange，提问作者Soye Gh