README

由 Inertia.JS 驱动的全栈页面组件

注意：此包处于早期 alpha 阶段，因此请预期可能出现潜在的错误和 API 破坏性更改！

// Welcome.inertia.vue

<?php

use function InertiaVolt\Laravel\{render};

render('welcome/{name}', fn(string $name) => [
    'name' => $name,
]);

?>

<script setup lang="ts">
defineProps<{ name: string }();
</script>

<template>
    <h1>Hello, {{ name }}!</h1>
</template>

入门

安装

在你的 composer.json 文件中，通过更改以下行将最低稳定性设置为 dev

"minimum-stability": "dev"

安装 Laravel 插件。服务提供者和默认配置将自动注册

composer require inertia-volt/laravel-plugin

接下来，安装 Vite 插件

npm add @inertia-volt/vite
// or pnpm
pnpm add @inertia-volt/vite
// or bun
bun add @inertia-volt/vite

在你的 vite.config.js 文件中，导入 inertiaVolt 插件并将其添加到 plugin 部分。

// vite.config.js

import inertiaVolt from '@inertia-volt/vite'

export default defineConfig({
    plugins: [
        laravel(...),
        inertiaVolt({
            path: 'resources/js/Pages',
            extension: 'vue' // or tsx/jsx/svelte
        }),
        vue(...),
    ],
});

基础知识

配置

API 参考

可以通过以下方式发布 Inertia Volt 的特定配置

php artisan vendor:publish --tag=inertia-volt

这将把默认配置复制到你的应用程序文件夹中，以便进一步自定义。

要更改文件扩展名，你可以设置 INERTIA_VOLT_EXTENSION 环境变量

// .env

INERTIA_VOLT_EXTENSION=tsx

页面组件

如果以下条件成立，则组件被认为是页面组件：

它位于配置的路径下（默认：resources/js/Pages）。
它有 .inertia.{vue,svelte,jsx,tsx} 后缀，具体取决于使用的框架。
在组件中调用 InertiaVolt\Laravel\render 函数。这作为渲染页面的主要 GET 路由。

用法

注册页面组件

可以在 web.php 路由文件中注册页面组件。例如，如果你有一个位于 resources/js/Pages/Chirps/Index.inertia.vue 的组件，你可以这样注册它

InertiaVolt::page('Chirps/Index');

由于 InertiaVolt::page 实质上是 Laravel 路由组，因此你可以为它应用前缀、名称或中间件

InertiaVolt::page('Chirps/Index')->prefix('chirps')->name('chirps.')->middleware(['auth', 'verified']);

你还可以将其包装在另一个路由组中

Route::middleware('auth')->group(function () {
    InertiaVolt::page('Chirps/Index');
});

在底层，InertiaVolt::page 创建一个包含 render 处理程序和其他可能操作的路由组。你可以将其视为控制器。

页面操作

除了 render 操作外，Inertia Volt 还提供了 post、put 和 delete 操作来简化页面资源操作。

这些操作函数返回一个 Route 对象，这意味着你可以为它们应用前缀、名称、中间件，甚至模型绑定

post('', function (ChirpStoreRequest $request) {
    ...
});

put('{chirp}', function (ChirpStoreRequest $request, Chirp $chirp) {
    ...
})->name('update'); // with model binding and route name

你还可以指定一个可调用的类作为操作处理程序

post('', CreateChirp::class);

inertia-volt / laravel-plugin

维护者

详细信息