title: How to name Webpack output file based on name of entry file?
body: <p>I am trying to dynamically name the file outputted by Webpack, based on the name of the entry file. For example, my entry is named accessCodeEditor.js - and I would like the output file to be named accessCodeEditor.min.js. I thought <code>output.filename: &quot;[name].min.js&quot;</code> would do the trick according to these docs, but it named it <code>main.min.js</code> instead:
  <a href="https://webpack.js.org/configuration/output/#outputfilename" rel="nofollow noreferrer">https://webpack.js.org/configuration/output/#outputfilename</a></p>
  <p>Here is my webpack.config.js file:</p>
  <pre><code>const path = require(&quot;path&quot;);
  const TerserPlugin = require(&quot;terser-webpack-plugin&quot;);
  
  module.exports = {
      entry: &quot;./web/js/pages/accessCodeEditor.js&quot;,
      optimization: {
          minimize: true,
          minimizer: [new TerserPlugin({
              test: /\.js(\?.*)?$/i
          })]
      },
      output: {
          filename: &quot;[name].min.js&quot;,
          path: path.resolve(__dirname, &quot;dist&quot;)
      }
  };
  </code></pre>