Nativecript Fontawesome 5 iPhone无法正常工作

问题描述

我正在尝试让Font Awesome 5在android上运行，但无法正常工作.使用 https://github.com/NathanWalker/nativescript-ngx-fonticon 包

I'm trying to get Font Awesome 5 to work on android but it's not working. Using the https://github.com/NathanWalker/nativescript-ngx-fonticon package.

我的文件夹结构

- src
-- assets
-- fonts
-- app

assets文件夹包含fontawesome css(font-awesome.css)，我删除了"Font Awesome使用Unicode专用区域(PUA)以确保屏幕上方 读者不会阅读代表图标的随机字符.

The assets folder contains the fontawesome css (font-awesome.css), I've removed everything above the "Font Awesome uses the Unicode Private Use Area (PUA) to ensure screen readers do not read off random characters that represent icons" remark.

fonts文件夹包含我从Font Awesome 5网站(fa-brands/fa-regular/fa-solid)下载的所有字体文件(eot/svg/ttf/woff/woff2)

The fonts folder contains all the fontfiles (eot / svg / ttf / woff / woff2) I've downloaded from Font Awesome 5 website (fa-brands / fa-regular / fa-solid)

在我的主要scss文件中，有一行:

In my main scss file I have a line :

.fa {
    font-family: FontAwesome, fontawesome-webfont;
}

.fas {
    font-family: FontAwesome, fa-solid-900;
}

在我的app.module.ts中:

In my app.module.ts :

import { TNSFontIconModule , TNSFontIconService } from 'nativescript-ngx-fonticon';
TNSFontIconService.debug = true;

并导入:

    TNSFontIconModule.forRoot({
        'fa': './assets/font-awesome.css'
    })

现在在我的HTML中:

Now in my HTML:

<Label  class="fas" [text]="'fa-bars' | fonticon" color="#2c0239"></Label>

我还修改了我的webpack配置，以复制并观看src/assets/文件夹:

I've also modified my webpack config to copy and watch the src/assets/ folder:

    new CopyWebpackPlugin([
        { from: "assets/**"},
        { from: "fonts/**" },
        { from: "**/*.jpg" },
        { from: "**/*.png" },
    ], { ignore: [`${relative(appPath, appResourcesFullPath)}/**`] }),

所以当我在iPhone上运行它时，我会得到[?]

So when I run this on my iPhone I get [?]

推荐答案

最后拥有它:

.fas {
    font-family: "Font Awesome 5 Free", fa-solid-900;
}

iPhone需要第一个("Font Awesome 5 Free")，Android需要fa-solid-900.

The first one ("Font Awesome 5 Free") is needed for iPhone and fa-solid-900 is needed for Android.

这篇关于Nativecript Fontawesome 5 iPhone无法正常工作的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！