How to install vue js in laravel 8, Install Vue + laravel 8
By Ved Prakash N |
Jun 10, 2022 |
Laravel
How to install vue js in laravel 8.
Install Vue + laravel 8 and how to setup laravel + vuejs application.
Step 1: Create new laravel application
$ composer create-project --prefer-dist laravel/laravel laravelvue "8.*"
once successfully laravel installed, nagivate to its path
Step 2: Install the "laravel/ui" Package
$ composer require laravel/ui
Step 3: Setup the Vue Scaffolding
Install Vue
$ php artisan ui vue
Install Vue with Auth Scaffolding
$ php artisan ui vue --auth
if you run with above command with vue --auth, you will notice that some files and folder has been generated automatically in resources/views folder.
Step 4: Compile the files
$ npm install
$ npm install vue vue-template-compiler vue-loader --save-dev --legacy-peer-deps
Step 5: Include "/js/app.js" in your view
Add this script & link tag in your view.
<link href="{{ asset('css/app.css') }}" rel="stylesheet"/>
<script src="{{ asset('js/app.js') }}"></script>
If you are using scss, or anyother javascript then we require to mix, so at that time use the below tag:
<script src="{{ mix('/js/app.js') }}"></script>
Step 6: Lets serve the application
$ npm run dev
$ php artisan serve
$ npm run watch
You have set vuejs in your laravel application.
If you want to use Vuex, Vue Router, Axios Vue-Axios in your application. Do the following command:
$ npm install vue-router vuex axios vue-axios --save-dev --legacy-peer-deps
Thanks for reading.