如何将Laravel Inertia项目中的Vite容器化？解决启动报错问题

问题根源 #

你在docker-compose.yaml中把本地./src目录挂载到了Vite容器的/app目录，这会完全覆盖容器构建阶段在/app下安装的node_modules文件夹。Vite作为项目的本地依赖，是安装在node_modules/.bin里的，挂载后这个路径被本地目录替换，导致容器找不到Vite命令。

解决方案 #

1. 调整挂载规则，保留容器内的node_modules #

修改docker-compose.yaml中vite服务的volumes配置，添加一个匿名卷来排除node_modules：

vite:
    build:
        context: ./src
        dockerfile: Dockerfile
    container_name: vite
    volumes:
        - ./src:/app
        - /app/node_modules  # 新增：保留容器内的node_modules，不被本地挂载覆盖
    ports:
        - "5173:5173"
    networks:
        - default

2. 重新构建并启动Vite容器 #

先清理旧的容器和卷，再重新构建：

# 停止并删除容器，同时删除关联的卷
docker-compose down -v
# 重新构建Vite服务
docker-compose build vite
# 启动Vite容器
docker-compose up vite

3. （可选）确保Vite可以被外部访问 #

容器内运行的Vite默认只绑定127.0.0.1，本地无法直接访问。修改src/package.json中的dev命令，添加--host参数：

"scripts": {
    "dev": "vite --host 0.0.0.0"
}

这样本地就可以通过http://localhost:5173访问Vite的开发服务了。

验证 #

启动后如果看到类似以下日志，说明Vite服务正常运行：

vite   |   VITE v5.0.0  ready in 300 ms
vite   |
vite   |   ➜  Local:   http://localhost:5173/
vite   |   ➜  Network: http://172.18.0.4:5173/

内容的提问来源于stack exchange，提问作者Brayan Gonzalez