1

Laravelモジュールパッケージの操作

Laravel 8では、Inertiajsを使用してコンポーネントをロードできます

これで初期化Inertiaしapp.blade.phpます@inertia

その後、app.jsファイルで、次のように初期化できます。

const app = document.getElementById('app');

new Vue({
    render: (h) =>
        h(InertiaApp, {
            props: {
                initialPage: JSON.parse(app.dataset.page),
                resolveComponent: (name) => require(`./Pages/${name}`).default,
            },
        }),
}).$mount(app);

次に、すべてのコンポーネントがPagesフォルダーからロードされます。

さて、私の質問は次のとおりです。

モジュールでそれを達成するにはどうすればよいですか? Inertiajs を使用して Vuejs コンポーネントをロードしたい。モジュールでは、このResources/assets/js/app.jsファイルは空です。上記のコードを入れて Pages フォルダーを作成すると、エラーが発生します。

import { createApp, h } from 'vue'
import { App, plugin } from '@inertiajs/inertia-vue3'

const el = document.getElementById('app')

createApp({
  render: () => h(App, {
    initialPage: JSON.parse(el.dataset.page),
    resolveComponent: name => require(`./Pages/${name}`).default,
  })
}).use(plugin).mount(el)

In Core (私が作った) モジュールmaster.blade.php

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <title>Module Core</title>
       <link rel="stylesheet" href="{{ mix('css/core.css') }}">

    </head>
    <body>
        @inertia
        <script src="{{ mix('js/core.js') }}"></script>
    </body>
</html>

コアコントローラー:

use Inertia\Inertia;

class CoreController extends Controller
{
    public function index()
    {
        return Inertia::render('Admin/Index');
    }
}

私はページを持っていますassets/js/Pages/Admin/Index.vue

これをロードしたい。しかし、私にエラーを与えます:

[Vue 警告]: 作成されたフックのエラー: "エラー: モジュール './Admin/Index' が見つかりません"

4

2 に答える 2