這篇文章跟大家分享一個Laravel擴充：vite-plugin 包，介紹如何在 Laravel Blade 中使用 Vite 來實現熱重載，希望對大家有所幫助！
Laravel 團隊更新了第一方 Laravel vite-plugin 包， 以支援blade 範本/任一檔案變更時的全頁重新載入。當你編輯更改的 blade 模板（或你配置的任何其他檔案）時，Vite 將重新載入整個頁面。開發過程中不再需要手動刷新瀏覽器！
安裝新的Laravel 專案時，你的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,
}),
],
});上面的程式碼片段是一個全新的Laravel 應用程式附帶的；你不需要做任何事情來讓熱重載在一個新專案上工作。
注意refresh 設定－當設定為true 時，Laravel Vite 外掛程式會在你更新以下路徑中的檔案時刷新頁面：
routes/** resources/views/**
該約定可能適用於大多數項目，但如果你想包含其他路徑或文件，你可以配置刷新屬性：
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: [
'resources/routes/**',
'routes/**',
'resources/views/**',
],
}),
],
});有關配置選項的更多詳細信息，請參閱官方文檔中的使用Blade 模板和路由。
讓我們設定一個示範 Laravel 應用程式來示範熱重載。首先，讓我們建立一個新的示範專案：
laravel new blade-hot-reload --git cd blade-hot-reload
安裝專案後，將以下內容新增至resources/views/ 中的welcome.blade.php檔案的<head/> 中：
@vite('resources/js/app.js')接下來，你需要安裝NPM 依賴項並執行dev 指令：
npm install npm run dev
就是這樣！如果你對Blade 檔案或路由進行更改，你將在控制台中看到類似以下內容：
#你所做的任何更改都應立即反映，這取決於你的本機開發環境設定。
本文中的所有譯本僅用於學習和交流目的，轉載請務必註明文章譯者、出處、和本文連結
我們的翻譯中遵循 CC 協定時，如果我們的工作侵犯於您的權益，請及時聯絡我們。
以上是Laravel擴充推薦：vite-plugin套件利用 Vite 實現熱重載的詳細內容。更多資訊請關注PHP中文網其他相關文章！
