Setting up Laravel 5.1 and Bootstrap 3 Sass
I want to use Bootstrap 3 Sass with Laravel 5.1, but I had some questions:
- In 5.1, in the package.json file for Laravel, out of the box there is a dependency for "bootstrap-sass": "^ 3.0.0". Is there an easy way to then configure bootstrap sass with Laravel 5.1?
- Do I need to embed the original bootstrap file or do I just need to link to the CDN or put the files in my public folder?
- Is there a reason to use the Bootstrap source code rather than putting it in a public folder?
- Am I correct in assuming that I will need to install bootstrap via Bower, move the contents of the fonts folder to a shared folder, then configure Elixir to mix all the Sass files together?
I'm just a little confused about integrating a third party service like Bootstrap into Laravel. I'm new to Laravel and Bootstrap, so any information or advice would be appreciated.
Note. I've done a lot of research on the web, but the tutorials for Laravel and Bootstrap are dated and the comments show they don't work correctly.
Thank you for your time.
source to share
First to install node packages, just run npm install
inside the folder.
After that, if you go to resources/assets/sass/app.scss
, you will see that the first commented line imports the entire bootblock from the node modules installed viapackage.json
After you uncomment the line you see by default in gulpfile.js
, you already have the elixir command to compile the application sass file.
With all settings, just run gulp
and elixir will compile a sass file that imports the boot file and you will see output in public/css/app.css
which you can link in your application.
And finally, to copy fonts or any other asset, you can use the command copy
and you will have the fonts copied to the shared folder.
elixir(function(mix) {
mix.copy('node_modules/bootstrap-sass/assets/fonts/', 'public/fonts');
mix.sass('app.scss');
}
source to share