webpack打包iconfont.css失败

Question

开发环节webpack+vue,现在遇到的问题是在打包iconfont时不起作用。
配置如下：

{
test:/\.(woff|svg|eot|ttf)\??.*$/,
/*test: /\.(woff2?|eot|ttf|otf)(\?.*)?$/,*/
loader: 'url',
query: {
limit: 10000,
name: utils.assetsPath('fonts/[name].[hash:7].[ext]')
}
}

vue中引用css

<style>
@import './assets/css/sm.css';
@import './assets/css/iconfont.css';
.fade-transition {
  transition: opacity .2s ease;
}
.fade-enter, .fade-leave {
  opacity: 0;
}
</style>

@font-face {font-family: "iconfont";
  src:url('../fonts/iconfont.woff') format('woff'), /* chrome, firefox */
  url('../fonts/iconfont.ttf') format('truetype'), /* chrome, firefox, opera, Safari, Android, iOS 4.2+*/
  url('../fonts/iconfont.svg') format('svg'); /* iOS 4.1- */
}

运行打包后output目录中并没有fonts文件夹产生，感觉字体文件都没有被打包进去。各位同学帮忙分析一下什么问题，谢谢大家啦

Answer 1

你那个font的test表达式能工作么？我怎么觉着有点问题啊，改改试试？

test: /\.(eot|svg|ttf|woff|woff2)\w*/

Answer 2

问题已经解决，原来我把limit的含义理解错了

If the file is greater than the limit the file-loader is used and all query parameters are passed to it.

我设置的limit：10000 也就是说当文件大于10000/1024 时才会使用url-loader 否则会直接打包成Data Url 格式