字体家族不适用于react

Question

我对字体使用CSS排版。

typography.js

import Typography from 'typography';

const typography = new Typography({
    googleFonts: [
        {
            name: 'Nunito',
            styles: ['400', '700']
        },
        {
            name: 'Open Sans',
            styles: ['400', '600']
        },
        {
            name: 'Oswald',
            styles: ['400', '600']
        }
    ],
    headerFontFamily: ['Oswald'],
    bodyFontFamily: ['Oswald'],
    includeNormalize: false
})

export default typography.toString()

而且是AppContainer

AppContainer.js

import typography from '../../typography';
...
const baseStyles = () => injectGlobal`
...
${typography};
a{
    text-decoration:none!important;
}
body{
  margin: 0;
  pading: 0;
}
`;

所以我可以检查它是否在CSS的浏览器开发人员模式中应用。

margin-left: 0;
margin-right: 0;
margin-top: 0;
padding-bottom: 0;
padding-left: 0;
padding-right: 0;
padding-top: 0;
margin-bottom: 1.45rem;
color: inherit;
font-family: 'Oswald';
font-weight: bold;
text-rendering: optimizeLegibility;
font-size: 1.51572rem;
line-height: 1.1;

但是，实际上，这是适用的，并且不会在浏览器的用户屏幕上呈现。

我想知道原因和解决方法。