2022-12-12
2301
#laravel#vue
Abiodun Solomon
145913
Dec 12, 2022 ⋅ 8 min read

Creating a single-page app with Laravel and Vue

Abiodun Solomon I’m a software developer that is curious about modern technologies. I love contributing to the growth of knowledge for the betterment of humanity.

Recent posts:

Nx Adoption Guide: Overview, Examples, And Alternatives

Nx adoption guide: Overview, examples, and alternatives

Let’s explore Nx features, use cases, alternatives, and more to help you assess whether it’s the right tool for your needs.

Andrew Evans
Mar 28, 2024 ⋅ 9 min read
Understanding Security In React Native Applications

Understanding security in React Native applications

Explore the various security threats facing React Native mobile applications and how to mitigate them.

Wisdom Ekpotu
Mar 27, 2024 ⋅ 10 min read
Warp Adoption Guide: Overview, Examples, And Alternatives

warp adoption guide: Overview, examples, and alternatives

The warp web framework for Rust offers many enticing features. Let’s see when and why you should consider using warp in your projects.

Ukeje Goodness
Mar 26, 2024 ⋅ 8 min read
Integrating Next Js And Signalr For Enhanced Real Time Web App Capabilities

Integrating Next.js and SignalR to build real-time web apps

In this tutorial, you’ll learn how to integrate Next.js and SignalR to build an enhanced real-time web application.

Clara Ekekenta
Mar 25, 2024 ⋅ 8 min read
View all posts

10 Replies to "Creating a single-page app with Laravel and Vue"

  1. where shoud this be placed?

    import {createRouter, createWebHistory} from ‘vue-router’;

    const router = createRouter({
    history: createWebHistory(),
    routes: [
    {
    path: ‘/’,
    component: () => import(‘./pages/Login.vue’)
    },
    {
    path: ‘/register’,
    component: () => import(‘./pages/Register.vue’)
    },
    {
    path: ‘/home’,
    component: () => import(‘./pages/Home.vue’)
    }
    ],
    })

  2. I would like to use this Tutorial with XAMPP instead of NGINX. But I dont now how to run ‘npm run dev’ and ‘php artisan serve’ at the same time. is there any config I have to change in XAMPP? Also I dont know where to put the App.vue file in Laravel structure.

    1. It should be in the parent directory, generated by Laravel,

      Here’s it
      “`
      import { defineConfig } from ‘vite’;
      import laravel from ‘laravel-vite-plugin’;
      import vue from ‘@vitejs/plugin-vue’

      export default defineConfig({
      plugins: [
      vue(),
      laravel({
      input: [‘resources/css/app.css’, ‘resources/js/app.js’],
      refresh: true,
      }),
      ],
      });
      “`
      Note: We can’t add all the code in the article 😉. But you can always refer to the source code here https://github.com/iamhabbeboy/laravel-vue-demo

Leave a Reply