メモです。
参考:
https://www.npmjs.com/package/fontsource-noto-sans-jp
https://mrtry.hatenablog.jp/entry/2018/05/07/193920
#インストール
npm install fontsource-noto-sans-jp
もしくは
yarn add fontsource-noto-sans-jp
でNoto Sans JPをインストールする。
#インポート
gatsby-browser.js
で
import { ThemeProvider } from 'styled-components'
import { MuiThemeProvider } from '@material-ui/core/styles'
import { theme } from './src/utility/theme'
import "fontsource-noto-sans-jp"
import "fontsource-noto-sans-jp/500.css"
import "fontsource-noto-sans-jp/900-normal.css"
などする。
#Material-UIのthemeのfont-familyを上書き指定
import { createMuiTheme } from '@material-ui/core/styles'
// fontFamilyを上書き
export const theme = createMuiTheme({
typography: {
fontFamily: ['Noto Sans JP', 'sans-serif'].join(','),
},
})