Subdirectory Laravel and Vue

I'm working with Laravel and VueJS, the laravel is in a subdirectory (https://ift.tt/39aCysf), I changed the settings of my apache vHost so that accessing that name would be redirected to the 'subdirectory / public' folder, however when I access it vuejs I run into this error:

enter image description here

when I access any sub route of the vue it can connect normal, but the main one gives this problem.

router/index.js

import Router from 'vue-router';
import Login from '@/components/Login';
import ForgotPassword from '@/components/ForgotPassword';
import Index from '@/components/Index';

Vue.use(Router);

export default new Router({
  mode: 'history',
  base: '/subdirectory',
  routes: [
    {
      path: '/',
      name: 'Index',
      component: Index,
      children: [
        {
          path: '',
          name: 'Login',
          component: Login,
        },
        {
          path: 'forgot-password',
          name: 'forgotPassword',
          component: ForgotPassword,
        },
      ],
    },

  ],
});

routes/web.php

<?php
//use Illuminate\Routing\Route;

use App\User;
use Illuminate\Support\Facades\Hash;
use Illuminate\Http\Request;
use Illuminate\Support\Facades\Auth;
use Illuminate\Support\Facades\Route;

Route::get('/{any}', 'FrontendController@app')->where('any', '^(?!api).*$');```

via Chebli Mohamed