module.exports = {
  context: __dirname + "/app",

  entry: {
    'javascript': "./js/app.js",
    'html': "./index.html",
  },
  output: {
    path: __dirname + "/dist",
    filename: "app.js",
  },
  resolve: {
    extensions: ['.js', '.jsx', '.json']
  },
  module: {
    loaders: [
      {
        test: /\.jsx?$/,
        exclude: /node_modules/,
        loaders: ["babel-loader"]
      },
      {
        test: /\.html$/,
        loader: "file-loader?name=[name].[ext]",
      }
    ]
  }
};

我不是很熟悉你的方法，所以我会告诉你一个共同的方式来帮助你。

首先，在你的output，你指定filename到app.js这是有道理的，我说，输出仍然会app.js。如果你想让它充满活力，那么就使用"filename": "[name].js"。

该[name]部分将文件名动态为您服务。这就是你的entry为对象的目的。每个键将被用作替换[name].js的名称。

其次，你可以使用html-webpack-plugin。你不需要将它作为一个test。

冲突：多资产发出相同的文件名

我是一个菜鸟的WebPack谁想要了解这一切。运行我的WebPack告诉我，当我遇到一个发生了冲突：

ERROR in chunk html [entry] app.js Conflict: Multiple assets emit to the same filename app.js

我应该怎么做，以避免冲突？

这是我的webpack.config.js：

module.exports = {
  context: __dirname + "/app",

  entry: {
    'javascript': "./js/app.js",
    'html': "./index.html",
  },
  output: {
    path: __dirname + "/dist",
    filename: "app.js",
  },
  resolve: {
    extensions: ['.js', '.jsx', '.json']
  },
  module: {
    loaders: [
      {
        test: /\.jsx?$/,
        exclude: /node_modules/,
        loaders: ["babel-loader"]
      },
      {
        test: /\.html$/,
        loader: "file-loader?name=[name].[ext]",
      }
    ]
  }
};