打包图片资源

1.打包图片资源

• webpack打包图片资源需要下载两个loader: url-loader file-loader
• url-loader 依赖于file-loader，在配置时只需要引入一个loader即可

const dirs = require('./dirs');

module.exports = {
  module: {
    rules: [
        /** 处理图片资源，需要 url-loader file-loader */
        {
            test: /\.(png|jpe?g|gif|svg)(\?.*)?$/,
            use: [
                {
                    loader: 'url-loader',
                    options: {
                        limit: 5 * 1000,
                        include: dirs.src,
                        // 打包后的图片路径以及命名
                        name: 'images/[path][name].[ext]'
                    }
                }
            ]
        }
    ]
  }
}