1. 下载免费商用字体

    法棍体：链接:https://pan.baidu.com/s/1M-CDEqsJ06qj-42uRyF0WA 密码:83er

  2. 使用 FontLab 查看字体的 fontFamily

    FontLab 破解版 Mac：

    链接:https://pan.baidu.com/s/1Wb3xgB9mJqF4YGX0xXddMg 密码:1cfb

  3. 将字体放到放在项目根目录：

  4. 在根目录新建 react-naitve.config.js:

    1
    2
    3
    4
    5
    6
    7
    module.exports = {
      project: {
        ios: {},
        android: {},
      },
      assets: ['./fonts'],
    }

  5. 在根目录执行 react-native link 命令

  6. 使用字体：

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    // 全局
    const TextRender = Text.render
    Text.render = (...args) => {
      const originText = TextRender.apply(this, args)
      const { style } = originText.props
      return React.cloneElement(originText, {
        allowFontScaling: false,
        style: [{ fontFamily: 'Baguette' }, style],
      })
    }
    // 局部
    <Text style={{ fontSize: 50, fontFamily: 'Baguette' }}> 法棍体🥖 </Text>

  7. 效果：

    WechatIMG1166.jpeg

附录