Now with laravel-mix v6
you could run Vue 3 code in Laravel App:
1. Installation :
npm i -D laravel-mix@next vue@next @vue/compiler-sfc vue-loader@next
npm i
before doing that try to remove the following dependencies from package.json
which some of them are added by php artisan ui vue
:
vue
vue-template-compiler
laravel-mix
2. Config:
in the package.json
change the scripts to the following ones:
"scripts": {
"development": "mix",
"watch": "mix watch",
"watch-poll": "mix watch -- --watch-options-poll=1000",
"hot": "mix watch --hot",
"production": "mix --production"
}
webpack.mix.js
should contain :
const mix = require('laravel-mix');
mix.js('resources/js/app.js', 'public/js').vue();
The minimum content of resources/js/app.js
import { createApp } from 'vue';
import App from './components/App.vue'
createApp(App).mount("#app")
In order to avoid this confusing steps clone this REPOSITORY and start coding.
if this article helped you please don't to forget to upvote my answer here
Top comments (3)
Hello. I am trying to run your example with a command 'npn run watch-poll'. The console throws an error prntscr.com/x4mqd0. I took the code from the github. Commands 'composer install' and 'npm install' completed. What could be the reason? Thank you in advance.
Hi Sergiy,
It looks like you need to upgrade your Node version.
github.com/nuxt/nuxt.js/issues/5652
phoenixnap.com/kb/update-node-js-v...
Great post, many thanks :) I have made a Laravel Sail version of this too using your help: dev.to/stuartcreed/laravel-v8-with...