html加载器设置错误的路径或忽略index.html中的图像

Question

我的webpack中有问题，当我在我的html-loader中设置attrs: [':data-src']时，我在index.html中有这样的好路径：<img src="img/logo.png" width="180" height="96">，但当我使用npm run build时我避开来自dist文件夹中此索引的图像。当我有默认attrs=img:src时，我有图片，但我的路径如下：<img src="../img/../img/logo.png" width="180" height="96">。我尝试使用attrs: ['data:src', 'img:src']，但它无法正常工作。

我的配置：

var webpack = require('webpack');
var path = require('path');
var HtmlWebpackPlugin = require('html-webpack-plugin');

module.exports = {
  context: path.join(__dirname, "src"),
  entry: "./js/index.js",
  output: {
    path: __dirname + "/dist/js",
    filename: "bundle.min.js"
  },
  module: {
    loaders: [{
        test: /\.js?$/,
        exclude: /(node_modules)/,
        loader: 'babel-loader',
        query: {
          presets: ['es2015'],
        }
      },
      {
        test: /\.css$/,
        use: ['style-loader', 'css-loader']
      },
      {
        test: /\.(html)$/,
        use: [{
          loader: 'html-loader',
          options: {
            attrs: ['data:src', 'img:src']
          }
        }]
      },
      {
        test: /\.(jpe?g|png|gif|svg)$/i,
        use: [{
          loader: 'file-loader',
          options: {
            name: '[name].[ext]',
            outputPath: '../img/',
            publicPath: '../img/'
          }
        }]
      },
    ]
  },
  plugins: [
    new webpack.optimize.UglifyJsPlugin({
      mangle: false,
      sourcemap: false
    }),
    new HtmlWebpackPlugin({
      filename: '../index.html',
      template: './index.html'
    }),

  ],
};