title: Webpack's removes classnames when minifying/uglifying ES6 code with inheritance
body: <p>Webpack's removes <em>classnames</em> when minifying/uglifying ES6 code with inheritance:</p>
  
  <p>There's <a href="https://stackoverflow.com/help/mcve">MVCE</a> code which we try to minify/uglify:</p>
  
  <p><strong>Class Child</strong>:</p>
  
  <pre><code>const ParentClass = require('parent');
  
  class Child extends ParentClass{
      constructor(){
          super();
      }
  }
  
  module.exports = Child;
  </code></pre>
  
  <p><strong>index.js</strong> which invokes <code>Child</code> class:</p>
  
  <pre><code>const Child = require('./classes_so/child');
  
  let child = new Child();
  
  console.log(child.constructor.name);
  </code></pre>
  
  <p><strong>Module Parent</strong> inside <code>node_modules</code>:</p>
  
  <pre><code>class Parent {
      constructor() {
          if (this.constructor.name === 'Parent'){
              throw new TypeError("Parent class is abstract - cant be instance");
          }
      }
  
  }
  
  module.exports = Parent;
  </code></pre>
  
  <p>The whole output I'll post to the end of the question, here I want to post only relevant lines which I think cause a wrong behavior (lines 33-37 from original output):</p>
  
  <pre><code>n.exports = class extends r {
          constructor() {
              super();
          }
      };
  </code></pre>
  
  <hr>
  
  <p>Why a <em>classname</em> is missing here: <code>class extends r</code>? I expect that value will be mangled but will exist, can I consider it as a bug? I tried to use <code>keep_classnames</code> flag but it keeps original class names which unacceptable.</p>
  
  <p><strong>We're using</strong>:</p>
  
  <ul>
  <li>Webpack: 3.11.0 (tried with 4, same behavior)</li>
  <li>uglifyjs-webpack-plugin: 1.2.4 (tried with different plugins)</li>
  <li>NodeJS: v6.9.1 and v8.9.1 (same output)</li>
  <li>Complete project which demonstrate the issue: <a href="https://github.com/anatoly314/webpack-uglify-inheritence" rel="noreferrer">webpack-uglify-inheritence</a></li>
  </ul>
  
  <p><strong>Update 1</strong>:</p>
  
  <ul>
  <li>Open an issue at <a href="https://github.com/webpack-contrib/uglifyjs-webpack-plugin/issues/269" rel="noreferrer">uglifyjs-webpack-plugin repository</a> </li>
  </ul>
  
  <p>Our <code>webpack.config.js</code>:</p>
  
  <pre><code>const webpack = require('webpack');
  const UglifyJsPlugin = require('uglifyjs-webpack-plugin');
  const path = require('path');
  const fs = require('fs');
  
  const nodeModules = {};
  const localDependencies = ['.bin'];
  fs.readdirSync('node_modules')
      .filter(function (x) {
          return localDependencies.indexOf(x) === -1;
      })
      .forEach(function (mod) {
          nodeModules[mod] = 'commonjs ' + mod;
      });
  
  try {
  
  
      module.exports = {
          target: 'node',
          node: {
              console: false,
              global: false,
              process: false,
              Buffer: false,
              __filename: true,
              __dirname: true
          },
  
          entry: './index_so.js',
  
          output: {
              path: path.join(__dirname, 'build'),
              filename: 'index.js'
          },
  
          externals: nodeModules,
          plugins: [
              new webpack.IgnorePlugin(/\.(css|less)$/),
              new webpack.BannerPlugin({
                  banner: 'require("source-map-support").install();',
                  raw: true,
                  entryOnly: false
              })
          ],
          devtool: 'sourcemap',
  
          module: {
              loaders: [
                  {test: /\.json$/, loader: "json-loader"}
              ]
          },
  
          plugins: [
              new UglifyJsPlugin({
                  uglifyOptions: {
                      compress: {
                          warnings: false
                      },
                      keep_classnames: false,
                      mangle: true,
                      output: {
                          beautify: true
                      }
                  }
              })
          ]
      };
  }
  catch (e) {
      console.error(e);
  }
  </code></pre>
  
  <p>The whole minified/uglified code from the example above:</p>
  
  <pre><code>!function(n) {
      var t = {};
      function e(r) {
          if (t[r]) return t[r].exports;
          var o = t[r] = {
              i: r,
              l: !1,
              exports: {}
          };
          return n[r].call(o.exports, o, o.exports, e), o.l = !0, o.exports;
      }
      e.m = n, e.c = t, e.d = function(n, t, r) {
          e.o(n, t) || Object.defineProperty(n, t, {
              configurable: !1,
              enumerable: !0,
              get: r
          });
      }, e.n = function(n) {
          var t = n &amp;&amp; n.__esModule ? function() {
              return n.default;
          } : function() {
              return n;
          };
          return e.d(t, "a", t), t;
      }, e.o = function(n, t) {
          return Object.prototype.hasOwnProperty.call(n, t);
      }, e.p = "", e(e.s = 0);
  }([ function(n, t, e) {
      let r = new (e(1))();
      console.log(r.constructor.name);
  }, function(n, t, e) {
      const r = e(2);
      n.exports = class extends r {
          constructor() {
              super();
          }
      };
  }, function(n, t) {
      n.exports = require("parent");
  } ]);
  </code></pre>