Laravel项目Docker环境npm run dev异常及Vite清单缺失求助

1. 统一Docker容器内的工作目录 #

Dockerfile与docker-compose.yml的工作目录不一致会导致路径混乱，先统一路径：

修改Dockerfile #

FROM node:14-alpine as node

# 统一工作目录为/usr/src
WORKDIR /usr/src
COPY . .

RUN npm install --global cross-env
RUN npm install

# 开发环境无需提前执行build，注释此行
# RUN npm run build

EXPOSE 3000

VOLUME /usr/src/node_modules

修改docker-compose.yml #

node:
  build:
    context: .
    target: node
  volumes:
    - .:/usr/src
    - node_modules:/usr/src/node_modules  # 使用命名卷规避本地权限问题
  command: npm run dev
  tty: true
  ports:
    - "3000:3000"  # 暴露Vite开发端口，方便本地访问

2. 修正Vite与Laravel的路径匹配 #

确保vite.config.js的输出路径指向Laravel的public/build目录：

import { defineConfig } from 'vite';
import laravel from 'laravel-vite-plugin';
import vue from '@vitejs/plugin-vue';

export default defineConfig({
    plugins: [
        laravel({
            input: 'resources/js/app.js',
            publicDirectory: 'public',
            buildDirectory: 'build',
        }),
        vue({
            template: {
                transformAssetUrls: {
                    base: null,
                    includeAbsolute: false,
                },
            },
        }),
    ],
});

3. 重新构建并启动服务 #

• 清理旧容器与卷：

docker-compose down -v

• 重新构建镜像并启动：

docker-compose up --build

4. 验证Laravel视图的资源引用 #

确保Blade视图中正确使用Vite指令：

@vite(['resources/js/app.js'])

内容的提问来源于stack exchange，提问作者Ibrahima Koné