Laravel 拡張機能の推奨: vite-plugin パッケージは Vite を使用してホットリロードを実装します

この記事では、Laravel 拡張機能である vite-plugin パッケージを紹介します。Laravel Blade で Vite を使用してホットリロードを実装する方法を紹介します。皆さんのお役に立てれば幸いです。

Laravel チームは、ブレード テンプレート/任意のファイルが変更されたときのフルページのリロードをサポートするために、ファーストパーティ Laravel vite-plugin パッケージを更新しました。変更されたブレード テンプレート (または設定したその他のファイル) を編集すると、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 アプリケーションでは、新しいプロジェクトで動作するためにホットリロードを行うために何もする必要はありません。

Noterefresh 設定 - 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 に次のコードを追加します。ファイルの :

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

次に、NPM の依存関係をインストールし、dev コマンドを実行する必要があります:

npm install
npm run dev

以上です。 Blade ファイルまたはルートに変更を加えると、コンソールに次のような内容が表示されます。

行った変更は、ローカル環境に応じて、すぐに反映されます。開発環境の設定。

この記事のすべての翻訳は、学習とコミュニケーションのみを目的としています。転載する場合は、必ず翻訳者、出典、およびこの記事へのリンクを明記してください。 当社の翻訳作業は

CC 契約
に準拠しています。当社の翻訳作業がお客様の権利を侵害する場合は、速やかにご連絡ください。

---

元のアドレス:

https://laravel-news.com/laravel-blade-h...

翻訳されたアドレス:

https://learnku.com/laravel/t/69811

以上がLaravel 拡張機能の推奨: vite-plugin パッケージは Vite を使用してホットリロードを実装しますの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。