如何根据入口文件的名称命名Webpack输出文件

Question

我正在尝试根据入口文件的名称动态命名Webpack输出的文件。例如，我的条目名为accessCodeEditor.js，我希望输出文件名为accessCodeEditor.min.js。我原以为output.filename: "[name].min.js"会根据这些文档完成任务，但它将其命名为main.min.js：https://webpack.js.org/configuration/output/#outputfilename

这是我的webpack.config.js文件：

const path = require("path");
const TerserPlugin = require("terser-webpack-plugin");
module.exports = {
entry: "./web/js/pages/accessCodeEditor.js",
optimization: {
minimize: true,
minimizer: [new TerserPlugin({
test: /.js(?.*)?$/i
})]
},
output: {
filename: "[name].min.js",
path: path.resolve(__dirname, "dist")
}
};

Answer 1

但是，当通过多个入口点、代码拆分或各种插件创建多个捆绑包时，您应该使用以下替换之一为每个捆绑包提供唯一的名称。。。

嗨，这个[name].min.js是为了上面提到的另一个目的。

---

你试过下面的方法吗？

const path = require("path");
const TerserPlugin = require("terser-webpack-plugin");
const myAmazingFileName = 'accessCodeEditor';
module.exports = {
entry: `./web/js/pages/${myAmazingFileName}.js`,
optimization: {
minimize: true,
minimizer: [new TerserPlugin({
test: /.js(?.*)?$/i
})]
},
output: {
filename: `${myAmazingFileName}.min.js`,
path: path.resolve(__dirname, "dist")
}
};