vuejs3 - laravel-modules api routes don't hit the controller

I am using laravel-modules 11.1.8 and with laravel 11.41.3 for an SPA (vue3).

The problem is the vue components inside the module, when calling the api routes defined in the module, returns the app template (html).

My web.php

Route::get('/{any}', function() {
   return view('app');
})->where('any', '.*');

The app.blade.php (the template)

<!DOCTYPE html>
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}">
   <head>
       <meta charset="utf-8">
       <meta name="viewport" content="width=device-width, initial-scale=1">
       <title>{{ config('app.name') </title>
       @vite(['resources/sass/app.scss', 'resources/js/app/js'])
   </head>
   <body>
      <div id="app"></div>
   </body>
</html>

The route in the Blog module Modules/Blog/routes/api.php

Route::get('/blog', [BlogController::class, 'index']);

In the composer.json (module) I have this:

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

In the main composer.json

...
"extra": {
    "laravel": {
        "dont-discover": []
    },
    "merge-plugin": {
        "include": [
            "Modules/*/composer.json"
        ]
    }
},
"config": {
   ...
   "allow-plugins": {
      "wikimedia/composer-merge-plugin": true
   }
}

The RouteServiceProvider.php fomr module it should load the routes from api.php and register.

public function boot(): void
{
   parent::boot();
}

public function map(): void
{
   $this->mapApiRoutes();
   $this->mapWebRoutes();
}

protected function mapWebRoutes(): void
{
   Route::middleware('web')->group(module_path($this->name, '/Routes/web.php'));
}

protected function mapApiRoutes(): void
{
   Route::middleware('api')->prefix('api')->name('api.')->group(module_path($this->name, '/Routes/api.php'));
}

In the php artisan route:list I cannot see module routes, I only see the routes that are defined in the main api.php.

The application load the vue router /my-app/blog but the component when tries to make the api call from /api/blog (api.php), it return the app template.

What I am doing wrong? Why the module api routes are not registered (to see them in route:list) ?

UPDATE

Forgot to mention that if I copy the content from Modules\Blog\routes\api.php to routes\api.php, it is working.

I am using laravel-modules 11.1.8 and with laravel 11.41.3 for an SPA (vue3).

The problem is the vue components inside the module, when calling the api routes defined in the module, returns the app template (html).

My web.php

Route::get('/{any}', function() {
   return view('app');
})->where('any', '.*');

The app.blade.php (the template)

<!DOCTYPE html>
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}">
   <head>
       <meta charset="utf-8">
       <meta name="viewport" content="width=device-width, initial-scale=1">
       <title>{{ config('app.name') </title>
       @vite(['resources/sass/app.scss', 'resources/js/app/js'])
   </head>
   <body>
      <div id="app"></div>
   </body>
</html>

The route in the Blog module Modules/Blog/routes/api.php

Route::get('/blog', [BlogController::class, 'index']);

In the composer.json (module) I have this:

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

In the main composer.json

...
"extra": {
    "laravel": {
        "dont-discover": []
    },
    "merge-plugin": {
        "include": [
            "Modules/*/composer.json"
        ]
    }
},
"config": {
   ...
   "allow-plugins": {
      "wikimedia/composer-merge-plugin": true
   }
}

The RouteServiceProvider.php fomr module it should load the routes from api.php and register.

public function boot(): void
{
   parent::boot();
}

public function map(): void
{
   $this->mapApiRoutes();
   $this->mapWebRoutes();
}

protected function mapWebRoutes(): void
{
   Route::middleware('web')->group(module_path($this->name, '/Routes/web.php'));
}

protected function mapApiRoutes(): void
{
   Route::middleware('api')->prefix('api')->name('api.')->group(module_path($this->name, '/Routes/api.php'));
}

In the php artisan route:list I cannot see module routes, I only see the routes that are defined in the main api.php.

The application load the vue router /my-app/blog but the component when tries to make the api call from /api/blog (api.php), it return the app template.

What I am doing wrong? Why the module api routes are not registered (to see them in route:list) ?

UPDATE

Forgot to mention that if I copy the content from Modules\Blog\routes\api.php to routes\api.php, it is working.

Share Improve this question edited Feb 7 at 14:27 asked Feb 7 at 14:17 calin24 9814 gold badges24 silver badges49 bronze badges

Curious, since it seems like the default routes/api.php works. What happens if you add Log::info(module_path($this->name, '/Routes/api.php'))); in your mapApiRoutes() function? The result will show up in your Laravel log. – aynber Commented Feb 7 at 14:31
@aynber it doesn't write anything in the log. – calin24 Commented Feb 7 at 15:03

Add a comment |

1 Answer 1

Sorted by: Reset to default 0

In your Web.php Excluse the api routes and it's will work like this

Route::get('/{any}', function () {
    return view('app');
})->where('any', '^(?!api).*$');

科技改变生活-雨落星辰 - 所有的伟大,都源于一个勇敢的开始

vuejs3 - laravel-modules api routes don't hit the controller - Stack Overflow

1 Answer 1

与本文相关的文章

评论列表(0)