我想在Gatsby中使用Material-UI。在用法页面上,它说我必须添加以下响应性元标记:
<meta
name="viewport"
content="minimum-scale=1, initial-scale=1, width=device-width, shrink-to-fit=no"
/>
现在,如果我看一下Gatsby开始使用的meta标签,它们几乎是相同的:
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
因此,基本上,唯一的区别是material-ui
要我添加minimum-scale=1
。
我的问题是如何更新或替换元视口标记以包括此值。我尝试在我的基本布局中使用react-helmelt,如下所示:
<Helmet>
<meta
name='viewport'
content='minimum-scale=1, initial-scale=1, width=device-width, shrink-to-fit=no'
/>
</Helmet>
但是这样做是给了我两个元视口标签-一个是盖茨比开始的标签,另一个是我通过头盔添加的标签:
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name='viewport' content='minimum-scale=1, initial-scale=1, width=device-width, shrink-to-fit=no' />
我想要的只是一个meta视口标签-包含一个minimum-scale=1
。
有关如何执行此操作的任何想法?
谢谢。
如果您确实需要更改视口元,则需要覆盖Gatsby使用的默认html模板。只需复制.cache/default-html.js
到src/html.js
并根据自己的喜好对其进行自定义。
附带说明一下,我真的怀疑将Gatsby的默认视口元与Material-UI一起使用是否会出现问题。
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句