glyphicons not showing with sass bootstrap integration

Question

I used this tutorial to integrate bootstrap in my project:

https://laravel-news.com/2015/10/setup-bootstrap-sass-with-laravel-elixir/

This places an app.css

Answer 1

Bootstrap4 doesn't come with icons anymore bootstrap icons

you can use Font Awesome instead for example.

Build your webpack.mix.js configuration.

mix.js('resources/assets/js/app.js', 'public/js')
   .sass('resources/assets/sass/app.scss', 'public/css');

Install Font Awesome.

npm install @fortawesome/fontawesome-free

In /resources/sass/app.scss import one or more styles.

@import '~@fortawesome/fontawesome-free/scss/fontawesome';
@import '~@fortawesome/fontawesome-free/scss/regular';
@import '~@fortawesome/fontawesome-free/scss/solid';
@import '~@fortawesome/fontawesome-free/scss/brands';

now compile.

npm run production
or
npm run dev

Finally, reference your new CSS file in your layout.

<link type="text/css" rel="stylesheet" href="{{ mix('css/app.css') }}">

Answer 2

In Laravel 5.4, just install npm dependencies and run npm in production or dev as needed.

npm install
npm run production

Laravel will do the rest.

Answer 3

In webpack.config.js set:

publicPath: '../'

Instead of Mix.resourceRoot

Answer 4

I had the same problem with fresh install of laravel 5.2. What I did is just inspected the request path in browser which was :

../build/fonts/bootstrap/glyphicons-halflings-regular.woff2

so I just added to gulp.js this :

mix.copy('node_modules/bootstrap-sass/assets/fonts/bootstrap/','public/build/fonts/bootstrap'); 

and afterwards in terminal :

gulp

That did the trick for me!

Answer 5

Laravel 5.3 remove build

mix.copy('node_modules/bootstrap-sass/assets/fonts/bootstrap/', 'public/fonts/bootstrap');

run gulp

Answer 6

I had the same problem using Laravel 5.4 It turns out that I hadn't run npm install and npm run dev.

Once these two commands were run, the fonts (and glyphicons) were copied correctly into the /public directory. There was no need to edit any sass or build files.