如何将Ionicons（或其他字体）导入Vue-loader应用程序？

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-year old discussion on Github并尝试了评论中建议的每个加载器，但没有一个能够工作。我是Vue和webpack的新手，所以我不确定我做错了什么。

问题：为了能够在我的应用中使用Ionicons（或者字体真棒或任何其他字体库）我需要做什么？

Answer 1

自己想出来。您只需要为字体添加适当的加载器

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

到您的webpack文件。但是，我还必须将@import语句从scss更改为已编译的css;否则，它将无法工作（不确定为什么）。问题解决了