How To Install Vue 3 On Fresh Laravel Installation

Installing Vue 3 on a fresh Laravel installation seems to be a bit of a hustle. In this guide, I'm going to walk you through step by step how to set up vue3 on a fresh Laravel installation.

Upgrade laravel mix

Laravel ships with laravel mix 5 which seems to have problems with Vue 3 so follow the upgrade guide on offical documentation of laravel mix.

Install extra dependencies

After upgrading laravel mix to v6 you need to upgrade or install extra dependencies.

``sh npm i vue-loader@16 vue-template-compiler sass sass-loader --save-dev

## Upgrade webpack
The next thing you need to do is to upgrade webpack

```bash
npm i -D webpack@5.* webpack-cli@next 

Install vue 3

Finally, install vue 3

npm i vue@next --save-dev --save-dev

Now build your assets by running the usual

npm run dev

If the build fails, try running

npm i @vue/compiler-sfc --save-dev

Now build again and you should be on Vue 3. Happy coding.