url-loader与file-loader

一开始用url-loader的时候，想着为什么npm run build的时候，不能将图片打包到build images的目录下，原来，没有自己看这样的说明：

loader 后面 limit 字段代表图片打包限制，这个限制并不是说超过了就不能打包，而是指当图片大小小于限制时会自动转成 base64 码引用，

limit参数，代表如果小于大约8k则会自动帮你压缩成base64编码的图片,否则拷贝文件到生产目录，
 
这样在小于8K的图片将直接以base64的形式内联在代码中，可以减少一次http请求。
 
忽略了这样的说明。
理解了这些就知道，url-loader是通过limit这样的一个值的大小，来判断，小于其值的转base64，大于其值的打包到相应的生产目录下；
而file-loader是直接将图片打包到生产目录下。

            {
                test: /\.(png|jpg)$/,
                loader: 'url-loader?limit=8192&name=assets/images/[hash:8].[name].[ext]'
                //limit参数，代表如果小于大约4k则会自动帮你压缩成base64编码的图片,否则拷贝文件到生产目录
                //name后面是打包后的路径；
                //loader 后面 limit 字段代表图片打包限制，这个限制并不是说超过了就不能打包，而是指当图片大小小于限制时会自动转成 base64 码引用
                //上例中大于8192字节的图片正常打包，小于8192字节的图片以 base64 的方式引用。
            }