Docker Compose配置求助：Vue编译产物共享文件夹无法正常工作

核心问题分析 #

你的Docker Compose配置中，Vue服务同时挂载了本地目录./frontend/adm到容器/app，以及命名卷dist到/app/dist。如果本地./frontend/adm目录下已经存在dist文件夹，Docker会优先使用本地的这个目录，覆盖掉命名卷的挂载，导致编译产物实际存入了本地目录，而非共享卷中。

解决方案（无需修改Dockerfile） #

方案1：移除本地dist目录 #

• 停止所有容器：docker-compose down
• 删除本地./frontend/adm/dist目录：rm -rf ./frontend/adm/dist
• 重新启动服务：docker-compose up --build
  此时容器内的/app/dist会正确绑定到命名卷dist，编译产物将存入共享卷，Nginx也能正常读取。

方案2：调整挂载顺序（保留本地dist时可选） #

修改Vue服务的volumes配置，将命名卷挂载放在本地目录挂载之前：

vue:
  image: node:14-alpine
  volumes:
    - dist:/app/dist
    - ./frontend/adm:/app
  working_dir: /app
  command: npm install && npm run build

Docker挂载按顺序生效，后挂载的路径会覆盖前一个同路径内容。把卷挂载前置后，若本地无dist目录，会保留卷的挂载；若本地有dist，仍会被覆盖，因此优先推荐方案1。

验证方法 #

执行完成后，查看共享卷内容确认：
docker run --rm -v dist:/dist alpine ls -l /dist
若能看到index.html、js/css等编译文件，说明配置生效，Nginx可正常访问产物。

内容的提问来源于stack exchange，提问作者Rafa Ferri Torró