Laravel - Passport/SPA 401 Unauthorized

I've registered the Vue components as mentioned in the Laravel Passport documentation, and they also do show up in my app:

<passport-clients></passport-clients>
<passport-authorized-clients></passport-authorized-clients>
<passport-personal-access-tokens></passport-personal-access-tokens>

However, they don't show any tokens/clients, and I am not able to create any either, due to my application says I am "unauthorized":

GET http://spa.test/oauth/personal-access-tokens 401 
GET http://spa.test/oauth/clients 401 (Unauthorized)
GET http://spa.test/oauth/tokens 401 (Unauthorized)
GET http://spa.test/oauth/scopes 401 (Unauthorized)

This is my AuthServiceProvider.php

public function boot()
{
     $this->registerPolicies();

     Passport::routes();
}

I've also included the trait to my app/User.php:

use HasApiTokens, Notifiable;

Remember, I am using Laravel as a backend and Vue.js as a frontend, which gives me a SPA.

This is my routes/api.php:

Route::middleware('auth:api')->group(function () {
    Route::get('/user', function (Request $request) {
        return $request->user();
    });
});

This is my routes.js:

const routes = [
    {
        path: '/api/*',
    },

    /**
     * Handle Authentication
     */
    {
        path: '/',
        alias: '/login',
        name: 'login',
        component: Login,
        beforeEnter: ifNotAuthenticated,
    }
    /**
     * Handle logged in pages
     */
    {
        path: '/dashboard',
        name: 'layout',
        component: MasterLayout,
        beforeEnter: ifAuthenticated,
        children: [{
            path: '/dashboard',
            name: 'dashboard',
            component: Dashboard
        }, {
            path: '/home',
            name: 'home',
            component: Home
        }]
    },
];

Update 1: I see that the problem is that I am authenticated using Passport (auth:api) All of passport routes use web Middleware to make sure you are authenticated, which is a session based authentication:

Any idea on how I can still use Vue as a frontend, Laravel as a backend and still use Laravel Passport to handle tokens for 3rd party applications?

from Laravel - Passport/SPA 401 Unauthorized