解决vue使用element-ui时，报xxx/element-ui/lib/theme-chalk/fonts/element-icons.ttf的问题

之前的项目的登录界面改用element-ui实现时，却发现报了如下错误

报错内容如下

./node_modules/[email protected]@element-ui/lib/theme-chalk/fonts/element-icons.ttf
Module parse failed: Unexpected character '' (1:0)
You may need an appropriate loader to handle this file type.
(Source code omitted for this binary file)
 @ ./node_modules/[email protected]@css-loader!./node_modules/[email protected]@element-ui/lib/theme-chalk/base.css 7:3991-4027
 @ ./node_modules/[email protected]@element-ui/lib/theme-chalk/base.css
 @ ./src/plugins/element.js
 @ ./src/main.js
 @ multi ./node_modules/[email protected]@webpack-dev-server/client?http://localhost:8080 webpack/hot/dev-server ./src/main.js

image.png

原因：缺少匹配规则

解决办法

• 在webpack.config.js文件中的module中增加如下json，然后关闭重新运行。

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

image.png

以上问题是由我的这篇文章的步骤的延续解决vue项目使用element-ui时，样式不生效的问题

如有问题，请批评指正。