Webpack 對圖片進行壓縮

在 vue 項目中除了可以在 webpack.base.conf.js 中 url-loader 中設置 limit 大小來對圖片處理，對小於 limit 的圖片轉化為 base64 格式，其余的不做操作。所以對有些較大的圖片資源，在請求資源的時候，加載會很慢，我們可以用 image-webpack-loader來壓縮圖片：

（1）首先，安裝 image-webpack-loader  ：

npm install image-webpack-loader --save-dev

（2）然后，在 webpack.base.conf.js  中進行配置：

{  test: /\.(png|jpe?g|gif|svg)(\?.*)?$/,  use:[    {    loader: 'url-loader',    options: {      limit: 10000,      name: utils.assetsPath('img/[name].[hash:7].[ext]')      }    },    {      loader: 'image-webpack-loader',      options: {        bypassOnDebug: true,      }    }  ]}