webpack图片压缩image-webpack-loader

image-webpack-loader，img-loader

原文连接https://blog.csdn.net/lsvtogergo/article/details/81348934, 记录一下

{
     
    test: /\.(png|gif|jpe?g|svg)$/i,
    exclude:[path.resolve(process.cwd(), 'src/assets/css')],
    use: [
        {
     
            loader: 'url-loader',
            options: {
     
                limit: 1024,
                name: '[hash:8].[ext]',
                useRelativePath: false,
                outputPath: function(fileName){
     
                    return 'assets/images/'+fileName
                }
            }
        },
        {
     
            loader:'image-webpack-loader'
        }
    ]
}

具体操作

1、若安装过 image-webpack-loader 先卸载

yarn remove image-webpack-loader // npm uninstall image-webpack-loader
1
2、使用 cnpm , 这一步意思就是安装 cnpm 然后将全局的 registry 设置成阿里的镜像，国内阿里比较快

npm install cnpm -g --registry=https://registry.npm.taobao.org
1
3、使用 cnpm 安装 image-webpack-loader 会发现很快就安装好了，【手动滑稽】

cnpm install --save-dev image-webpack-loader
1
注：如果先前尝试使用 yarn 或 npm 安装过，一定要先卸载掉用 cnpm 安装