README

该包旨在与Laravel-Modules结合使用，以供Vue/InertiaJs使用

Laravel 兼容性

安装

通过composer安装此包。

composer require toanld/modules-inertia

配置文件

要编辑默认配置，您可以执行

php artisan vendor:publish --provider="Dongrim\ModulesInertia\ModulesInertiaServiceProvider"

自动加载

默认情况下，模块类不会自动加载。您可以使用psr-4自动加载您的模块。 例如：

{
  "autoload": {
    "psr-4": {
      "App\\": "app/",
      "Modules\\": "Modules/",
      "Database\\Factories\\": "database/factories/",
      "Database\\Seeders\\": "database/seeders/"
  }

}

提示：不要忘记运行 composer dump-autoload。

路由

模块路由必须在您的App\Http\Kernel中的web中间件组最后一个元素中包含中间件。

'web' => [
    // ...
    \App\Http\Middleware\HandleInertiaRequests::class,
],

使用方法

默认情况下，Vue模块文件创建在模块目录Resources/Pages

您可以在config/modules.php中更改默认目录

 'Pages/Index' => 'Resources/Pages/Index.vue',
 //...
 'source' => 'Resources/Pages',

在控制器中使用

模块中Inertia::render()的默认值已更改为Inertia::module()。

Inertia::render()仍然默认可用。它可以在模块外使用

• module_name - 当前模块的真实名称
• file_name - 文件的真实名称（没有扩展名 .vue）
• directory_name - 如果您有嵌套显示文件夹结构（您可以指定文件路径，以点分隔）

例如

    public function some_method()
    {
        return Inertia::module('module_name::file_name');
        //
        return Inertia::module('module_name::file_name', ['data'=>'some data']);
        //
        return Inertia::module('module_name::directory_name.file_name', ['data'=>'some data']);
    }

如果您使用Vue版本2

import Vue from "vue";
import { createInertiaApp, Link } from "@inertiajs/inertia-vue";

createInertiaApp({
    resolve: (name) => {
        let page = null;

        let isModule = name.split("::");
        if (isModule.length > 1) {
            let moduleName = isModule[0];
            let pathToFile = isModule[1];
            // @modules is an alias of the module folder or just specify the path 
            // from the root directory to the folder modules             
            // for example ../../modules
            page = require(`@modules/${moduleName}/${pathToFile}.vue`);
        } else {
            page = require(`./Pages/${name}`);
        }

        return page.default;
    },
    setup({ el, App, props, plugin }) {
        Vue.use(plugin);
       
        new Vue({
            render: (h) => h(App, props),
        }).$mount(el);
    },
});

如果您使用Vue版本3

import { createApp, h } from "vue";
import { createInertiaApp } from "@inertiajs/inertia-vue3";

createInertiaApp({
    resolve: (name) => {
        let page = null;

        let isModule = name.split("::");
        if (isModule.length > 1) {
            let module = isModule[0];
            let pathTo = isModule[1];
            // @modules is an alias of the module folder or just specify the path 
            // from the root directory to the folder modules             
            // for example ../../modules
            page = require(`@modules/${moduleName}/${pathToFile}.vue`);
        } else {
            page = require(`./Pages/${name}`);
        }
        //...
        return page.default;
    },
    setup({ el, App, props, plugin }) {
        createApp({ render: () => h(App, props) })
            .use(plugin)
            .mount(el);
    },
});

别名

为了方便从根目录指定到模块目录的路径，您可以在webpack.mix.js中添加别名

const path = require('path')

mix.webpackConfig((webpack) => {
  return {
    resolve: {
       alias: {
         "@modules": path.resolve(__dirname + "/modules"),
       },
    },
  };
});

为了方便从根目录指定到模块目录的路径，您可以在vite.config.js中添加别名

const path = require('path')

export default defineConfig({
  resolve:{
    alias:{
      '@modules' : path.resolve(__dirname + '/modules')
    },
  }
})

控制台命令

您可以运行 php artisan module:publish-stubs 来发布存根。

并覆盖默认文件的生成

创建模块后

为了使VueJS能够找到创建的模块，您需要重新构建脚本

npm run dev

文档

您可以在https://docs.laravelmodules.com/找到安装说明和完整文档。

作者

• Nicolas Widart
• Yaroslav Fedan
• 在此处添加您的可点击用户名。它应指向您的GitHub账户。

许可证

MIT许可证（MIT）。有关更多信息，请参阅许可证文件。