我将Gatsby与Netlify CMS结合使用,需要修改使用Gatsby的useStaticQuery
钩子接收到的数据。
例如,在Netlify CMS中,我允许用户定义要用于不同字体样式(例如h1至h6,按钮,正文等)的Google字体。然后,我需要将字体导入到<head>
中,然后执行一个比较昂贵的函数,该函数将所有字体系列和权重组合为|。分隔的字符串数组(例如"Open+Sans:400,500|Roboto:300|Montserrat:500,600,700"
)。这很昂贵,因为我需要结合所有字体系列和粗细同时确保没有重复。
我还有其他一些用例。例如,我正在使用Material UI,并且需要将theme
对象传递给<ThemeProvider theme={theme}>
组件。为此,我需要修改从useStaticQuery
接收到的数据以创建theme
对象。
这实际上只需要在构建时发生,因为它在运行时不会改变。另外,目前您无法在useStaticQuery
中使用wrapRootElement
,因此此功能将在每次加载页面时运行。
在盖茨比的构建期间,是否有任何方法可以运行此功能,以便返回值可以用作道具?