React Nativeアプリにフォントを追加する


Published on April 24, 2020

React Native(0.60+ version)のプロジェクトにフォントを追加する方法を解説します。


フォントファイルの追加


assets/fontsフォルダを作成し、

フォルダに追加するフォントファイルを配置します。

set-font-file


react-native.config.jsをルートに追加


react-native.config.jsを以下のように作成し、ルートフォルダに配置します。

react-native.config.js
module.exports = {
project: {
    ios: {},
    android: {},
},
assets: ['./assets/fonts']
};


linkを実行


下記コマンドを実行することで、iOSのInfo.plistの更新と、androidフォルダにフォントが自動的に配置されます。

terminal
$ npx react-native link

If you like it, share it!