A Blog Of Random Coding Techniques & Experiments Robert Askam

Bootstrap 4 has now been released and its time to try it on your Laravel projects so here is the simple way to upgrade your existing Bootstrap 3 to Bootstrap 4, this can be used on existing and new projects. Just be careful with your old projects as there are a lot of breaking changes.

NPM

npm uninstall --save-dev bootstrap-sass

npm install --save-dev bootstrap@^4.0.0-beta popper.js

Bootstrap.js

Navigate to your resources/assets/js/bootstrap.js file and find the section.

window.$ = window.jQuery = require('jquery');

require('bootstrap-sass');

Replace this with the following.

 window.$ = window.jQuery = require('jquery');

window.Popper = require('popper.js');

require('bootstrap');

app.scss

Navigate to resources/assets/sass/app.scss and change

bootstrap-sass/assets/stylesheets/bootstrap

//to

bootstrap/dist/css/bootstrap

//Now Run

npm run dev

You should now see the upgraded Bootstrap changes in your Laravel project. Here is a YouTube video which may help if your stuck.