Question

我在jhipster项目中安装了字体功能

当我以这种方式导入字体时，我的图标不会出现 -

 <link rel="stylesheet" href="bower_components/font-awesome/css/font-awesome.css" />

但是，如果我以这种方式导入字体很棒，那么它们会很好地显示

<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css">

我查看了字体真棒故障排除指南，但没有什么突出

我非常感谢任何帮助，因为我想在本地托管此文件

Answer 1

在带有Angular的 JHipster 5.0.1 中，您应该修改vendor.ts文件。例如，如果要添加faExpandArrowsAlt Fontawesome图标，则应导入它，然后使用library.add(faExpandArrowsAlt);

添加它

更改文件后，运行yarn run webpack:build' tslint:disable。

Answer 2

问题很可能是由于缩小造成的，所以我们必须使用font-awesome.min.css并将其从gulp“build”任务中的缩小中过滤掉。

但是，让我们从一开始就开始。

使用bower安装font-awesome将其保存在bower.json：
中
```
bower install --save font-awesome
```
不要将font-awesome的任何“覆盖”添加到bower.json中，以便gulp-inject不会更新索引中块的内容。 HTML

将以下代码添加到index.html：

<!-- build:css content/css/font-awesome.css -->
<link rel="stylesheet" href="bower_components/font-awesome/css/font-awesome.min.css">
<!-- endbuild -->

由于font-awesome是一种字体，我们应该将其“fonts”文件夹的内容包含在构建的结果中。我们将按照“bootstrap”字体所做的操作，将以下代码添加到gulpfile.js中的“复制”任务中：

gulp.src(config.bower + 'font-awesome/fonts/*.*')
    .pipe(plumber({errorHandler: handleErrors}))
    .pipe(changed(config.dist + 'content/fonts/'))
    .pipe(rev())
    .pipe(gulp.dest(config.dist + 'content/fonts/'))
    .pipe(rev.manifest(config.revManifest, {
        base: config.dist,
        merge: true
    }))
    .pipe(gulp.dest(config.dist + 'content/fonts/')),

就在行前：

gulp.src(config.app + 'content/**/*.{woff,woff2,svg,ttf,eot,otf}')

最后但并非最不重要的是将我们缩小的CSS过滤掉CSS处理。所有CSS文件都在gulp/build.js中缩小并连接。首先，我们将安装gulp-filter包：
```
npm install --save-dev gulp-filter
```
现在我们可以将其加入gulp/build.js：
```
filter = require('gulp-filter')
```
创建自定义过滤器：
```
const faFilter = filter(['*','!font-awesome.css'], {restore: true});
```
最后，使用此自定义过滤器包装现有的cssTask（）：
```
.pipe(faFilter)
.pipe(gulpIf('*.css', cssTask()))
.pipe(faFilter.restore)
```

Answer 3

在带有React的 JHipster V5.1 中，要添加faUsers图标，我刚刚编辑了src/main/webapp/app/config/icon-loader.ts，我只能够在{{1 }}。

Answer 4

看起来我的字体很棒的安装在某种程度上变得腐败了。删除字体真棒目录并从凉亭重新安装已经成功了

Answer 5

那是因为cssnano在使用font-awesome.css时犯了一些错误，而在.min文件中没有。

Answer 6

只需制作一个＆＃39;字体＆＃39;在你的内容目录中的文件夹并在那里添加你的字体文件，Jhipster将通过gulp

加载所有这些文件

Jhipster没有加载字体真棒图标

6 个答案: