![](/img/trans.png)
[英]How to fix “Conflict: Multiple assets emit to the same filename” error in Webpack?
[英]Webpack, optimization chunking gives “Conflict: Multiple chunks emit assets to the same filename” error
信息
我正在嘗試生成自己的 webpack 配置並且在使其正常工作時遇到了一些問題。
問題
當嘗試使用優化將文件拆分為塊時,我收到如下錯誤
錯誤:沖突:多個塊將資產發送到相同的文件名 static/js/bundle.js(塊 main 和 vendor-node_modules_react-hot-loader_patch_js-node_modules_react_jsx-dev-runtime_js-node_mod-4610d2)
如果我刪除優化部分,它可以工作但沒有分塊。 我查看了創建反應應用程序webpack.config.js以在生成此內容時獲得一些參考。
正如您所看到的,他們的優化部分在開發和生產中都使用了分塊。 為什么我在使用時會出現沖突錯誤?
代碼
我的配置的縮小/簡化版本(runtimeChunk 已禁用,因為它也給出了相同的沖突錯誤)
webpack.config.js
module.exports = () => {
process.env.NODE_ENV = "development";
process.env.BABEL_ENV = "development";
return {
mode: "development",
entry: ["react-hot-loader/patch", "./src"],
output: {
path: undefined,
publicPath: "/",
filename: "static/js/bundle.js",
chunkFilename: "static/js/[name].chunk.js",
},
optimization: {
minimize: false,
splitChunks: {
chunks: "all",
name: false
},
// runtimeChunk: {
// name: (entrypoint) => `runtime-${entrypoint.name}`,
// },
},
resolve: {
modules: [path.join(__dirname, "src"), "node_modules"],
alias: {
"react-dom": "@hot-loader/react-dom",
},
},
module: {
rules: [
{
test: /\.(js|mjs|jsx|ts|tsx)$/,
include: path.resolve(__dirname, "./src"),
exclude: /node_modules/,
use: ["babel-loader"],
},
],
},
plugins: [
new HtmlWebpackPlugin({
inject: true,
template: path.resolve(__dirname, "./public/index.html"),
}),
new webpack.HotModuleReplacementPlugin(),
],
devServer: {
compress: true,
hot: true,
contentBase: "./build",
historyApiFallback: true,
},
devtool: "inline-source-map",
};
};
.babelrc
{"presets": [["react-app", {"runtime": "automatic"}]]}
讓它工作必須將filename: "static/js/bundle.js"
更改為filename: "static/js/[name].js"
output: {
path: undefined,
publicPath: "/",
filename: "static/js/[name].js",
chunkFilename: "static/js/[name].chunk.js",
}
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.