冲突：多个资产发出相同的文件名 [英] Conflict: Multiple assets emit to the same filename

问题描述

我是一名想要了解它的网络新手。
运行我的webpack时遇到冲突告诉我：

I'm a webpack rookie who wants to learn all about it. I came across a conflict when running my webpack telling me:

块html中的错误[entry]
app。 js
冲突：多个资产发出相同的文件名app.js

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

What should I do to avoid the conflict?

这是我的webpack.config.js：

This is my 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]",
      }
    ]
  }
};

推荐答案

<我对你的方法不太熟悉，所以我会告诉你一个常用的方法来帮助你。

i'm not quite familiar with your approach so I'll show you a common way to help you out.

首先，你的输出，你指定文件名到 app.js 这对于我输出仍然是 app.js 。如果你想让它变得动态，那么只需使用filename：[name] .js。

First of all, on your output, you are specifying the filename to app.js which makes sense for me that the output will still be app.js. If you want to make it dynamic, then just use "filename": "[name].js".

[name] 部分将使您的文件名动态化。这是条目作为对象的目的。每个密钥将用作替换 [name] .js 的名称。

The [name] part will make the filename dynamic for you. That's the purpose of your entry as an object. Each key will be used as a name in replacement of the [name].js.

其次，你可以使用 html-webpack-plugin 。您不需要将其包含在 test 中。

And second, you can use the html-webpack-plugin. You don't need to include it as a test.

这篇关于冲突：多个资产发出相同的文件名的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！