webpack学习笔记（八）—— webpack中url-loader的使用

默认情况下，webpack无法处理css文件中的url地址，不管是图片还是字体库，只要是url地址，都处理不了

cnpm i url-loader file-loader 

/*
    当引用图片的字节大小 大于 1636(byte)的时候，会base64进行编码
    当引用图片的字节大小 等于或小于 1636(byte)的时候，不会base64进行编码，而会改路径为hash值，为了文件不重名
    为了使文件和项目中文件的名称一样可以加第二个参数 name=[name].[text]
    配置name=[name].[text]之后，不同文件夹下相同的图片名称会出现问题，需要name=[hash:8]-[name].[ext] ，加hash值是为了文件不重名
*/


modules:{
   rules:[
    {test:/\.(jpg|png|gif|bmp|jpeg)$/, use:'url-loader?limit=1636&name=[hash:8]-[name].[ext]'}, //file-loader是内部依赖
    {test:/\.(ttf|eot|svg|woff|woff2)$/, use:'url-loader'},
   ]
}

.json文件中不可以写注释