首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >Gatsby.js - Typography.js

Gatsby.js - Typography.js
EN

Stack Overflow用户
提问于 2018-07-16 15:14:31
回答 0查看 1.1K关注 0票数 0

自从安装typography.js以来,我得到了这个错误:

代码语言:javascript
复制
error There was an error compiling the html.js component for the development server.

  14 |   // Create family + styles string
  15 |   var fontsStr = '';
> 16 |   if (props.typography.options.googleFonts) {
     | ^
  17 |     var fonts = props.typography.options.googleFonts.map(function (font) {
  18 |       var str = '';
  19 |       str += font.name.split(' ').join('+');

  WebpackError: Cannot read property 'googleFonts' of undefined

  - GoogleFont.js:16 GoogleFont
    ~/react-typography/dist/GoogleFont.js:16:1
...

我不确定这是什么意思,也不知道如何修复它。我正在使用Gatsby.js默认的初学者包

typography.js这样做:

代码语言:javascript
复制
import Typography from "typography";

const typography = new Typography({
  baseFontSize: "18px",
  baseLineHeight: 1.45,
  headerFontFamily: [
    "Avenir Next",
    "Helvetica Neue",
    "Segoe UI",
    "Helvetica",
    "Arial",
    "sans-serif",
  ],
  bodyFontFamily: ["Georgia", "serif"],
});

和gatsby-config.js:

代码语言:javascript
复制
module.exports = {
  siteMetadata: {
    title: `Gatsby Default Starter`
  },
  plugins: [
    `gatsby-plugin-react-helmet`,
    `gatsby-plugin-styled-components`,
    {
      resolve: `gatsby-plugin-typography`, 
      options: {
        pathToConfigModule: 'src/utilities/typography.js'
      },
    },
  ]
};
EN

回答

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/51356419

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档