Preview:
1. First install laravel as usual
2. the cd/enter to your project
3. now run the command [npm i vue@next vue-loader@next] to install vue into your project
4. now install vue plugin run the command [npm i @vitejs/plugin-vue]
5. if it came npm errors the youcan install specified version of vitreplugin by typing
e.g[npm i @vitejs/plugin-vue@3.0.x]
6. now open vite.config.js file and add some code as follows
add this line at headings import vue from "@vitejs/plugin-vue";
7. then put a coma after laravel code and add the following code 
vue({
            template: {
                transformAssetUrls: {
                    base: null,
                    includeAbsolute: false,
                }
            }
        })
8. open the blade main or welcome file and make a div in the body with id 'app'
9. now go to the resources/js folder and make a file named welcome.vue and type the follwing code in it and save 
  <template>
    <h1>welcome page frm vue js</h1>
</template>
10. now open app.js file in resources/js folder and remove the existing code. Then type the following code
import {createApp} from "vue";
import welcome from './welcome.vue';

createApp(welcome).mount('#app');
11. No open welcome.blade file and add the following code in head section
@vite(['resources/js/app.js','resources/css/app.css'])
12. Hurrah!! now enjoy laravel with vue..
downloadDownload PNG downloadDownload JPEG downloadDownload SVG

Tip: You can change the style, width & colours of the snippet with the inspect tool before clicking Download!

Click to optimize width for Twitter