Laravel 확장 권장 사항: vite-plugin 패키지는 Vite를 사용하여 핫 리로딩을 구현합니다.

이 글은 Laravel 확장 기능인 vite-plugin 패키지를 공유할 것입니다. Laravel Blade에서 Vite를 사용하여 핫 리로딩을 구현하는 방법을 소개합니다. 이것이 모든 사람에게 도움이 되기를 바랍니다.

Laravel 팀은 블레이드 템플릿/임의의 파일이 변경될 때 전체 페이지 다시 로드를 지원하도록 자사 Laravel vite-plugin 패키지를 업데이트했습니다. 변경된 블레이드 템플릿(또는 구성한 다른 파일)을 편집하면 Vite는 전체 페이지를 다시 로드합니다. 더 이상 개발 중에 수동으로 브라우저를 새로 고칠 필요가 없습니다!

새 Laravel 프로젝트를 설치할 때 vite.config.js 파일의 기본 구성은 다음과 같습니다. 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')

위의 코드 조각은 새로운 Laravel 애플리케이션과 함께 제공됩니다. 새 프로젝트 작업을 위해 핫 리로드를 받기 위해 아무것도 할 필요가 없습니다.

refresh 구성에 유의하세요. true로 설정하면 Laravel Vite 플러그인은 다음 경로의 파일을 업데이트할 때 페이지를 새로 고칩니다.

npm install
npm run dev

이 규칙은 다음과 같습니다. 대부분의 프로젝트에 적용되지만 다른 경로나 파일을 포함하려면 새로 고침 속성을 구성하면 됩니다:

rrreee구성 옵션에 대한 자세한 내용은 공식 문서 블레이드 템플릿 및 라우팅을 사용하세요

.

사용해 보기

핫 리로딩을 시연하기 위해 데모 Laravel 애플리케이션을 설정해 보겠습니다. 먼저 새 데모 프로젝트를 생성해 보겠습니다.

rrreee
프로젝트를 설치한 후 resources/views/ 에 있는 <code>welcome.blade.php 파일에 다음 내용을 추가합니다. ><head/> In: rrreee 다음으로 NPM 종속성을 설치하고 dev 명령을 실행해야 합니다:

rrreee

---

바로 그 것입니다! 블레이드 파일이나 경로를 변경하면 콘솔에 다음과 유사한 내용이 표시됩니다.

모든 변경 사항은 로컬 개발 환경 설정에 따라 즉시 반영되어야 합니다.

이 기사의 모든 번역은 학습 및 의사소통 목적으로만 재인쇄할 때 번역자, 출처, 이 기사에 대한 링크를 표시하시기 바랍니다. 당사의 번역 작업은 CC 계약

을 준수합니다. 당사의 작업이 귀하의 권리를 침해하는 경우 제때에 연락해 주시기 바랍니다.

🎜🎜🎜원본 주소 : 🎜https://laravel-news.com/laravel-blade-h... 🎜🎜🎜번역 주소 : 🎜https://learnku.com/laravel/t/69811🎜🎜🎜

위 내용은 Laravel 확장 권장 사항: vite-plugin 패키지는 Vite를 사용하여 핫 리로딩을 구현합니다.의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!