我有一个 sapperjs 应用程序，就像您通过调用获得的应用程序一样npx degit sveltejs/sapper-template my-app。我想添加一种字体。普通人可能会添加这样一行app/template.html:
<link rel="stylesheet" href="//fonts.googleapis.com/css?family=Roboto+Slab">
网络原因使得这不切实际，所以我想在本地托管字体。在 create-react-app 中我会简单地import 'typeface-roboto-slab'在我的 App.jsx 或等效组件的顶部。如何在我的 sapper/svelte 应用程序中实现类似的效果？
我相信最好将其添加到app/template.html因为在其他任何地方，CSS 的范围都将限于单个组件。这似乎是几乎所有应用程序都需要的东西，但我可以找到的文档中没有任何相关内容。
它不像 CRA 那样精简（还！），但您可以通过将字体复制到您的文件中来相当简单地实现这一点。assets文件夹...
npm i typeface-roboto-slab
cp -r node_modules/typeface-roboto-slab assets
...然后添加一个<link>在你的app/template.html:
<link rel="stylesheet" href="typeface-roboto-slab/index.css">
在0.19版本中，Sapper获得了直接导入CSS文件的能力，但它目前不知道如何处理引用的文件，例如url('./files/roboto-slab-latin-100.woff2')。未来版本将支持这一功能，然后您将能够像在 CRA 中一样使用字体。
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
