如何在Laravel中配置自定义public目录适配Vite热更新？

问题场景 #

目录结构：

/laravel
/public_html

在/laravel/bootstrap/app.php中添加自定义public路径配置：

$app->usePublicPath(realpath(base_path('/../public_html')));

出现的矛盾现象：

• 保留该配置：CSS、JS文件编译正常，但执行npm run dev时热更新功能完全失效
• 移除该配置：文件编译时触发404错误，但npm run dev的热更新功能恢复正常

当前使用的vite.config.js配置：

import { defineConfig } from 'vite';
import laravel from 'laravel-vite-plugin';
 
export default defineConfig({
    plugins: [
        laravel({
            input: ['resources/scss/app.scss', 'resources/js/app.js'],
            refresh: true,
        }),
    ],
    build: {
        outDir: '../public_html/build',
        emptyOutDir: true,
        rollupOptions: {
            output: {
                manifest: true,
            },
        },
    },
});

额外验证：删除/laravel/public目录后，系统无法创建hot文件，证明Vite依然默认指向原public目录，这是问题核心。

解决方案 #

要让Vite完全适配自定义的public_html目录，需要同时调整Vite插件配置和确保Laravel路径配置正确：

1. 修改Vite配置文件 #

在vite.config.js的laravel插件选项中，明确指定自定义public目录和hot文件路径，同时补充开发服务器配置：

import { defineConfig } from 'vite';
import laravel from 'laravel-vite-plugin';
import path from 'path';
 
export default defineConfig({
    plugins: [
        laravel({
            input: ['resources/scss/app.scss', 'resources/js/app.js'],
            refresh: true,
            // 指定自定义的public目录路径
            publicDirectory: path.resolve(__dirname, '../public_html'),
            // 让hot文件生成到自定义public目录下
            hotFile: path.resolve(__dirname, '../public_html/hot'),
        }),
    ],
    build: {
        outDir: '../public_html/build',
        emptyOutDir: true,
        rollupOptions: {
            output: {
                manifest: true,
            },
        },
    },
    // 配置开发服务器，确保资源映射正确
    server: {
        origin: 'http://localhost:5173', // 根据你的本地开发域名调整
        resolve: {
            alias: {
                '@': path.resolve(__dirname, 'resources'),
            },
        },
    },
});

2. 保留Laravel应用的public路径配置 #

继续维持bootstrap/app.php中的配置不变：

$app->usePublicPath(realpath(base_path('/../public_html')));

3. 收尾操作 #

• 如果不需要原/laravel/public目录，可以直接删除
• 执行php artisan cache:clear清除应用缓存，避免路径缓存冲突
• 停止当前运行的npm run dev进程，重新启动开发服务

这样配置后，Vite会将热更新所需的hot文件写入public_html目录，热更新请求能正确识别自定义public路径，同时编译后的资源也会输出到指定位置，彻底解决404和热更新失效的问题。

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