0

Estoy tratando de incluir Font Awesome a un Proyecto de Laravel 5.7.

Para ello hice esto :

1) npm install --save-dev @fortawesome/fontawesome-free --chequeo y las carpeta esta en node_modules

2) En Resources/sass/app.scss agrego esto:

$fa-font-path: "../webfonts";

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

3) Ejecuto

 npm run development -- --watch

4) Veo que hay archivos en public/fonts/vendor/@fortawesome/fontawesome-free/

Pero cuando voy a navegador los iconos aparecen como rotos:

image_rota

Que estoy haciendo mal?

gracias!

4
  • Pon el html y css mínimo para reproducirlo porque puede que sea que haya algún elemento que esté tapando el icono Commented el 21 sept. 2018 a las 7:09
  • ¿Por qué no simplemente los importas desde sus servidores? <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.3.1/css/all.css" integrity="sha384-mzrmE5qonljUremFsqc01SB46JvROS7bZs3IO2EmfFsd15uHvIt+Y8vEf7N7fWAU" crossorigin="anonymous"> Commented el 21 sept. 2018 a las 14:13
  • Porque es para un desarrollo de intranet, sí el proveedor de internet se cae, no puedo no tener los iconos.
    – Nico
    Commented el 21 sept. 2018 a las 16:13
  • yo algunas veces lo que he hecho es descargar los archivos y guardarlos directamente en la carpeta public Commented el 28 mar. 2019 a las 14:11

2 respuestas 2

2

puedes cojer y descargar el paquete font-awesome y ponerlo dentro del directorio /public quedandote asi: tu-proyecto/public/font-awesome, luego solo debes agregarlo en tu html base asi

<!-- Font Awesome -->
    <link rel="stylesheet" href="{{asset('font-awesome/css/font-awesome.min.css')}}">

Espero te ayude.

1

primero instalas

npm install font-awesome

importas en el app.scss

@import "~font-awesome/scss/font-awesome";

copiamos el contenido de la carpeta fonts para esto agragas en el archivo webpack.mix.js lo siguiente

.copy('node_modules/font-awesome/fonts', 'public/fonts');

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.