如何将Ionicons (或其他字体)导入Vue-加载程序？

Question

在用npm安装ionicons v3.0.0之后，我很难将字体导入到我的应用程序中：

// /src/App.vue
@import '../node_modules/ionicons/dist/scss/ionicons.scss';

似乎指向正确的路径，然而，我得到了大量的错误，例如

Cannot find module "../fonts/ionicons.eot?v=3.0.0-alpha.3

显然，这个问题源于字体文件，例如，上面的文件实际上是ionicons.eot，而不是ionicons.eot?v=3.0.0-alpha.3。

我还找到了一个3岁的吉特布讨论，并尝试了注释中建议的每一个加载程序，但它们都不起作用。我是Vue和webpack的新手，所以我不知道我做错了什么。

问题：我需要做什么才能在我的应用程序中使用Ionicons (或者Font或任何其他字体库)？

Answer 1

我自己想出来的。您只需为字体添加适当的加载程序即可。

{ test: /\.(eot|woff|woff2|svg|ttf)([\?]?.*)$/, loader: "file-loader" }

到您的webpack文件。但是，我还必须将@import语句从scss更改为已编译的css；否则，它将无法工作(不确定原因)。问题解决