Laravel 5.4 include bootstrap glyphicons

Question

How can I include Bootstrap glyphicons in Laravel 5.4?

network tool in Chrome show a 404 error to the following broken links: http://localhost/fonts/glyphicons-halflings-regular.woff2?448c34a56d699c29117adc64c43affeb http://localhost/fonts/glyphicons-halflings-regular.woff?fa2772327f55d8198301fdb8bcfc8158 http://localhost/fonts/glyphicons-halflings-regular.ttf?e18bbf611f2a2e43afc071aa2f4e1512

the path should be http://localhost/myapp/public/font/glyphicons-halflings-regular...

Should I fix these links in order to have bootstrap glyphicons? if yes, how and where?

Posts about this concern talk about previous version of Laravel that uses a gulpfile.js which doesn't exit in a laravel 5.4 project.

The path seems correct. Your public root should be the public folder of your app. It seams to me that your vhost is the problem, not the glyphicons. I guess your other assets will be broken as well (or you are using the wrong path for them) — Pevara
– Pevara, Commented Feb 13, 2017 at 23:14
does it mean that I should my url localhost pointing to c:\wamp64\myapp\public\ ? This line {{ asset('fonts') }}, returns http://localhost/myapp/public/fonts so my other links are working properly. — Warrio
– Warrio, Commented Feb 15, 2017 at 14:20

ankit patel · Accepted Answer · 2017-02-27 23:13:13Z

@Warrio, Yeah you are right that Laravel 5.4 not use gulp, instead of gulp it uses webpack mix to load all dependencies.

I had same issue and solved by update package.json to

 { "private": true, "scripts": { "dev": "node node_modules/cross-env/bin/cross-env.js NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js", "watch": "node node_modules/cross-env/bin/cross-env.js NODE_ENV=development node_modules/webpack/bin/webpack.js --watch --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js", "watch-poll": "node node_modules/cross-env/bin/cross-env.js NODE_ENV=development node_modules/webpack/bin/webpack.js --watch --watch-poll --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js", "hot": "node node_modules/cross-env/bin/cross-env.js NODE_ENV=development node_modules/webpack-dev-server/bin/webpack-dev-server.js --inline --hot --config=node_modules/laravel-mix/setup/webpack.config.js", "production": "node node_modules/cross-env/bin/cross-env.js NODE_ENV=production node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js" }, "devDependencies": { "axios": "^0.15.3", "bootstrap-sass": "^3.3.7", "jquery": "^3.1.1", "laravel-mix": "^0.8.1", "lodash": "^4.17.4", "vue": "^2.1.10" } }

After update your package.json file, run "npm install" and it will solve your problem.

It would not helpful just to reveal your final shape of the file. people definitely has different contents. What is very helpful is the actual update you introduced to solve the problem.

Collectives™ on Stack Overflow

Laravel 5.4 include bootstrap glyphicons

1 Answer 1

2 Comments

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Related