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

Question

在ionicons使用npm 安装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。

我还在Github上进行了3年的讨论，并尝试了评论中建议的每个装载程序，但没有一个起作用。我是Vue和Webpack的新手，所以我不确定自己做错了什么。

问题：为了能够在vue-loader的应用程序中使用Ionicons（或Font Awesome或其他字体库），我需要做什么？

Answer 1

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

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

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