Laravel 5.7 中引入 font-awesome
laravel 5.7 自带bootstrap4,但bootstrap4不自带Fontawesome,很多好看的图标无法使用了。。如何解决?
Using a Package Manager
Package managers like npm and yarn are probably familiar tools for you and your team. With them, you can easily upgrade to newer versions of Font Awesome when they are released and better manage access to Pro packages.
Installing the Free version of Font Awesome
You can easily install the latest free version of Font Awesome via npm or yarn:
npm install --save-dev @fortawesome/fontawesome-free
or
yarn add --dev @fortawesome/fontawesome-free
Using webpack.mix.js to reference Font Awesome
Edit the resources/sass/app.scss
//font-awesome
@import "~@fortawesome/fontawesome-free/scss/fontawesome";
@import "~@fortawesome/fontawesome-free/scss/brands.scss";
@import "~@fortawesome/fontawesome-free/scss/regular.scss";
@import "~@fortawesome/fontawesome-free/scss/solid.scss";
@import "~@fortawesome/fontawesome-free/scss/v4-shims.scss";
这里引入了5个scss文件,不知道有没有更简单的办法?
Edit the webpack.mix.js
mix.js('resources/js/app.js', 'public/js')
.sass('resources/sass/app.scss', 'public/css')
Go to terminal, run the following command
npm run watch-poll
Reference the public/css/app.css
in the of page which u want to introduce Font Awesome
<link href="{{ asset('css/app.css') }}" rel="stylesheet">
All Done!
References
本作品采用《CC 协议》,转载必须注明作者和本文链接
请问为什么需要import @import "
@fortawesome/fontawesome-free/scss/brands.scss"; @import "@fortawesome/fontawesome-free/scss/regular.scss"; @import "@fortawesome/fontawesome-free/scss/solid.scss"; @import "@fortawesome/fontawesome-free/scss/v4-shims.scss"; 这四个scss文件呢,我一开始只引用了fontawesome,一直不起作用,为了解决这个问题可把我累坏了,看到这篇文章才知道还需要再另外引入四个scss文件,想知道为什么?