英文:
Unable to vite build for production in Laravel
问题
我有一个 Laravel + Livewire 应用程序，我正试图构建它以供生产使用。
我可以成功运行 ./vendor/bin/sail npm run build：
./vendor/bin/sail npm run build
> build
> vite build
vite v3.2.7 正在为生产环境构建...
正在转换 (19) node_modules/axios/lib/helpers/buildURL.js
🌼 daisyUI 组件 2.52.0 https://daisyui.com
✔︎ 包括：base、组件、2 个主题、工具
❤︎ 支持 daisyUI：https://opencollective.com/daisyui
✓ 转换了 60 个模块。
public/build/manifest.json 0.25 KiB
public/build/assets/app.bf5ec64f.css 80.27 KiB / gzip: 12.73 KiB
public/build/assets/app.8c40d1a4.js 143.69 KiB / gzip: 51.52 KiB
这些资产在 Blade 布局中使用 @vite 指令加载：
...
{{-- Scripts --}}
@vite(['resources/css/app.css', 'resources/js/app.js'])
...
然而，当我查看页面源代码时，我可以看到它仍然引用端口 5173（这将是 vite 开发服务器）：
<script type="module" src="http://localhost:5173/@vite/client"></script><link rel="stylesheet" href="http://localhost:5173/resources/css/app.css" /><script type="module" src="http://localhost:5173/resources/js/app.js"></script>
我希望看到对 public/build/assets/... 的引用。
我的 vite.config.js 相当简单：
import { defineConfig } from 'vite';
import laravel from 'laravel-vite-plugin';
export default defineConfig({
plugins: [
laravel({
input: [
'resources/css/app.css',
'resources/js/app.js',
],
refresh: true,
}),
],
server: {
hmr: {
host: 'localhost',
},
}
});
文档 (https://laravel.com/docs/10.x/vite#loading-your-scripts-and-styles) 中说：
"在构建模式下，该指令将加载您的已编译和版本化的资产，包括任何导入的 CSS。"
...但似乎并没有这样做。
我该如何停止 @vite 指令 / vite 尝试使用 vite 开发服务器，而是使用编译后的资产？（显然，vite 服务器不会在生产环境中运行）。
我尝试过在我的 .env 中设置 APP_DEBUG=false 和 APP_ENV=prod，以及运行 ./vendor/bin/sail artisan view:clear，但都没有任何效果。
依赖项已经更新到： "laravel/framework": "^10.0"，"vite": "^3.2.7"（当前版本为 4.4.2）。
英文:
I have a Laravel + Livewire app, that I'm trying to build for production.
I can successfully run ./vendor/bin/sail npm run build:
./vendor/bin/sail npm run build
> build
> vite build
vite v3.2.7 building for production...
transforming (19) node_modules/axios/lib/helpers/buildURL.js
🌼 daisyUI components 2.52.0 https://daisyui.com
✔︎ Including: base, components, 2 themes, utilities
❤︎ Support daisyUI: https://opencollective.com/daisyui
✓ 60 modules transformed.
public/build/manifest.json 0.25 KiB
public/build/assets/app.bf5ec64f.css 80.27 KiB / gzip: 12.73 KiB
public/build/assets/app.8c40d1a4.js 143.69 KiB / gzip: 51.52 KiB
The assets are loaded in a blade layout using the @vite directive:
...
{{-- Scripts --}}
@vite(['resources/css/app.css', 'resources/js/app.js'])
...
However when I view the page source, I can see it still references port 5173 (which would be the vite dev server):
<script type="module" src="http://localhost:5173/@vite/client"></script><link rel="stylesheet" href="http://localhost:5173/resources/css/app.css" /><script type="module" src="http://localhost:5173/resources/js/app.js"></script>
I was expecting to see a reference to public/build/assets/...
My vite.config.js is fairly simple:
import { defineConfig } from 'vite';
import laravel from 'laravel-vite-plugin';
export default defineConfig({
plugins: [
laravel({
input: [
'resources/css/app.css',
'resources/js/app.js',
],
refresh: true,
}),
],
server: {
hmr: {
host: 'localhost',
},
}
});
The documents (https://laravel.com/docs/10.x/vite#loading-your-scripts-and-styles) says that:
"In build mode, the directive will load your compiled and versioned assets, including any imported CSS."
...but it does not appear to be doing that.
How do I stop the @vite directive / vite from trying to use the vite dev server, and use the compiled assets? (As obviously, the vite server won't be running in prod).
I've tried APP_DEBUG=false and APP_ENV=prod in my .env, and ./vendor/bin/sail artisan view:clear which makes no difference.
Deps are up to date: "laravel/framework": "^10.0", and "vite": "^3.2.7" (currently 4.4.2).
答案1
得分: 0
如果在./public/hot中存在'hotfile'，则vite blade指令（参见：vendor/laravel/framework/src/Illuminate/Foundation/Vite.php）将尝试查找vite服务器并执行热重载。
只需移除./public/hot，一切都会正常工作！
英文:
Turns out that if the 'hotfile' exists in ./public/hot then the vite blade directive (see: vendor/laravel/framework/src/Illuminate/Foundation/Vite.php) will try to look for the vite server and perform hot reloading.
Simply remove ./public/hot and it all works fine!
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库，让每个人都能够通过互相帮助和分享经验来进步。
评论