问题描述
我尝试使用Laravel Mix安装Font Awesome,但是在执行run npm dev
时,出现以下消息:
I've tried to install Font Awesome using Laravel Mix but when executing run npm dev
I get the following message:
我删除了文件中的注释,并尝试更改字体路径,但是并不能解决问题.
I removed the comments in the file and tried to change font paths, but it did not solve the problem.
webpack.mix.js
mix.js('resources/assets/js/app.js', 'public/js')
.sass('resources/assets/sass/app.scss', 'public/css')
.copy('node_modules/font-awesome/fonts/', 'public/fonts')
.sass('node_modules/font-awesome/scss/font-awesome.scss', 'public/css')
.version();
fontawesome.scss
@import "variables";
@import "mixins";
@import "path";
@import "core";
@import "larger";
@import "fixed-width";
@import "list";
@import "bordered-pulled";
@import "animated";
@import "rotated-flipped";
@import "stacked";
@import "icons";
@import "screen-reader";
_variable.scss
// Variables
// --------------------------
$fa-font-path: "../fonts" !default;
$fa-font-size-base: 14px !default;
$fa-line-height-base: 1 !default;
// $fa-font-path: "//netdna.bootstrapcdn.com/font-awesome/4.7.0/fonts" !default; // for referencing Bootstrap CDN font files directly
$fa-css-prefix: fa !default;
$fa-version: "4.7.0" !default;
$fa-border-color: #eee !default;
$fa-inverse: #fff !default;
$fa-li-width: (30em / 14) !default;
// Continue...
推荐答案
要安装真棒字体,您首先应使用npm进行安装.因此,在您的项目根目录中,输入:
To install font-awesome you first should install it with npm. So in your project root directory type:
npm install font-awesome --save
(当然,我假设您已经安装了node.js和npm.并且您已经在项目的根目录中完成了npm install
)
然后编辑resources/assets/sass/app.scss
文件,并在此行的顶部添加:
Then edit the resources/assets/sass/app.scss
file and add at the top this line:
@import "node_modules/font-awesome/scss/font-awesome.scss";
现在您可以执行以下操作:
Now you can do for example:
npm run dev
这将在正确的文件夹中构建资源的最小化版本.如果要缩小它们,可以改为运行:
This builds unminified versions of the resources in the correct folders. If you wanted to minify them, you would instead run:
npm run production
然后您可以使用字体.
这篇关于如何在Laravel Mix中安装真棒字体的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!