laravel / framework

The Laravel Framework.
https://laravel.com
MIT License
32.42k stars 10.99k forks source link

@vite directive wrong hot file path #42994

Closed localesp closed 2 years ago

localesp commented 2 years ago

For some reason, the Laravel Vite hot file is generated inside the path that we provide to publicDirectory, however, the Laravel's @vite directive only looks for vite dev server path inside the public directory. Shouldn't it respect or look inside directory where the hot file is actually generated?

Example: Given this config, the hot file is generated inside the public/site-assets.

export default defineConfig({
    plugins: [
        laravel({
            input: [
                'resources/css/site/main.css',
            ],
            publicDirectory: 'public/site-assets'
        }),
    ],
})

However, @vite directory is only looking for hot file inside the public directory.

Here's the current code:

        if (is_file(public_path('/hot'))) {
            $url = rtrim(file_get_contents(public_path('/hot')));

            return new HtmlString(
                $entrypoints
                    ->map(fn ($entrypoint) => $this->makeTag("{$url}/{$entrypoint}"))
                    ->prepend($this->makeScriptTag("{$url}/@vite/client"))
                    ->join('')
            );
        }

The problem with this is that the Laravel Vite development server doesn't work because it can't find the hot file inside public directory, and generates the assets URLs based on APP_URL. However, our Vite dev server is running on different address.

Fixing this will also solve problem when we have multiple Laravel Vite configs running on different server addresses.

jessarcher commented 2 years ago

Hi @localesp,

You should only configure publicDirectory if you have configured Laravel to also use a different public directory.

If you need to configure a different build directory inside your public directory (like site-assets), then you should configure buildDirectory in the plugin instead, and also pass that as the second parameter to the @vite directive.

In terms of running multiple Vite hot servers at the same time in the same project, we don't currently support this (and neither did Mix as far as I know). We may consider supporting this at some stage if we can come up with a good solution (see https://github.com/laravel/vite-plugin/issues/24). Otherwise, if you can, I would try to have a single Vite config with multiple entry points.

localesp commented 2 years ago

@jessarcher You are right! buildDirectory did the job, and everything is working by default.

Regarding multiple servers thing, I don't know if its a good thing or not, but I used two different configurations for different set of assets in Laravel mix. Its just enough to get the job done.

For example, this is how my current configurations looks like when using multiple config in Laravel Vite.

        "board": "vite --config vite-board.config.js",
        "board:build": "vite build --config vite-board.config.js",
        "site": "vite --config vite-site.config.js",
        "site:build": "vite build --config vite-site.config.js",
        "build": "npm run board:build && npm run site:build",

Also, thanks a lot for your time!