Nuxt.js：包含字体文件：使用/static 或/assets

Question

我知道 nuxt.js github 存储库中的一些帖子稍微介绍了这一点，但我想知道在 nuxt.js 中使用字体文件的正确方法是什么。

到目前为止，我们将它们放在 /static/fonts 目录中，但其他人使用 assets 来存储字体文件。有什么区别？其中一个选项更好吗？如果是，为什么？

也有不同的方法来包含它们。这样的路径是否正确：

@font-face {
  font-family: 'FontName';
  font-weight: normal;
  src: url('~static/fonts/font.file.eot'); /* IE9 Compat Mode */
  src: url('~static/fonts/font.file.woff') format('woff'),
       url('~static/fonts/font.file.otf') format('otf'),
       url('~static/fonts/font.file.eot') format('eot');
}

感谢您在这里的一些澄清 :D。干杯

J

Answer 1

官方文档上解释的很好：https://nuxtjs.org/guide/assets/

assets\ 保留用于要处理的资产（例如 concat css with webpack）

static\ 用于暴露根目录下的所有静态文件url (static\img\test.jpg => http://example.fr/img/test.jpg)，无需任何处理

Nuxt.js：包含字体文件：使用/static 或/assets

Nuxt.js: Include font files: use /static or /assets

fonts

assets

font-face

vue.js

nuxt.js