Reputation: 174
Quite new to Laravel and I made sure I did looked into the documentations of Laravel 9 before diving but incase I missed one, I have this issue wher app.css and app.js on the the link served by artisan are not found. Boostrap scaffolds are now in the views folder but it seems like the (quite unsure about this) the app.js & app.css are still inaccessible so bootstrap doesnt work. I made sure to run npm install and npm run dev after the bootstrap and boostrap --auth installation from artisan. As of now the project is totally fresh so it works except the boostrap won't load because of the 404 error. Here are some snapshots of the projects including the running terminal sessions.
Commands used in sequence:
composer require laravel/ui --dev
php artisan ui bootstrap
php artisan ui boostrap --auth
npm install
npm run dev
All of the threads I've looked here in SO are stating they're not running npm dev which I am running already but I still haven't manage to find a working solution.
Upvotes: 3
Views: 9606
Reputation: 71
You can follow below steps:
create project with laravel
composer create-project laravel/laravel "project name"
install laravel UI for bootstrap 5
composer require laravel/ui
Generate login / registration scaffolding with bootstrap 5
php artisan ui bootstrap --auth
import bootstrap 5 path in vite.config.js
import path from 'path';
resolve:{
alias:{
'~bootstrap': path.resolve(__dirname, 'node_modules/bootstrap'),
}
}
import bootstrap 5 scss in js folder
import '../sass/app.scss';
import * as bootstrap from 'bootstrap';
use @vite blade directive in your template
@vite(['resources/js/app.js'])
finally build your asset file.
npm run build
and then run project using artisan command.
php artisan serve
Upvotes: 3