In this tutorial, we will see how to install laravel 10 inertia vue 3 with typescript. To use inertia vue 3 with typescript we need laravel breeze.
Step 1: Install Laravel
Run below command to install laravel 10.
composer create-project laravel/laravel inertia-vue-ts
Step 2: Connect Database
Now, you have to connect the laravel app to the database, hence open the .env configuration file and add the database credentials as suggested below.
.env
DB_CONNECTION=mysql
DB_HOST=127.0.0.1
DB_PORT=3306
DB_DATABASE=database_name
DB_USERNAME=database_user_name
DB_PASSWORD=database_password
Step 3: Install Breeze with Inertia + Vue 3+ Typescript
Install laravel breeze via composer
composer require laravel/breeze --dev
Next, run below command
php artisan breeze:install
Give 2 number to start with inertia vue.
Which stack would you like to install?
blade .............................................. 0
react .............................................. 1
vue ................................................ 2
api ................................................ 3
❯ 0
Next, you need to add feature dark mode, and TypeScript support. Write yes to add this feature.
Would you like to install dark mode support? (yes/no) [no]
❯ yes
Would you like TypeScript support? (Experimental): (yes/no) [no]
❯ yes
Would you like to install Inertia SSR support? (yes/no) [no]
❯ yes
Would you prefer Pest tests instead of PHPUnit? (yes/no) [no]
❯ yes
After that you Laravel 10 + Inertia + Vue 3 + Typescript app ready
add laravel 10 + inertia + vue 3 + typescript
Step 4: Laravel Run Server with Vite
Run below command in terminal to serve laravel 10 app.
php artisan serve
Next, you need to open next terminal.
npm run dev
// or
npm run build
