<p dir="auto">Duplication of babel helpers is a problem that hasn't yet been fully solved. It's solved from a userland code standpoint, but not solved when you consider node_modules that use babel in a prepublish step.</p>
<h3 dir="auto">Expected Behavior</h3>
<p dir="auto"><strong>Standalone babel helpers package</strong><br>
There should be a <code class="notranslate">babel-helpers-standalone</code> package, with <code class="notranslate">main</code> and <code class="notranslate">module</code> package.json fields that correspond to the babel helpers formatted as a CommonJS file and ES Modules file, respectively. The ES Module format will enable tree-shaking with compatible module bundlers.</p>
<p dir="auto"><strong>Option for <code class="notranslate">babel-plugin-external-helpers</code> to consume an  external package</strong><br>
There should be the ability to consume the standalone <code class="notranslate">babel-external-helpers</code> package when transpiling an application and/or library. So rather than referencing a global, this could be turned into an <code class="notranslate">import</code> (ES Modules, with tree shaking) or <code class="notranslate">require</code> (CommonJS). This could look something like:</p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="{
  &quot;plugins&quot;: [
    [&quot;external-helpers&quot;: {
      &quot;package&quot;: {
        &quot;name&quot;: &quot;babel-external-helpers&quot;,
        &quot;format&quot;: &quot;es&quot;
      }
    }]
  ]
}"><pre class="notranslate"><code class="notranslate">{
  "plugins": [
    ["external-helpers": {
      "package": {
        "name": "babel-external-helpers",
        "format": "es"
      }
    }]
  ]
}
</code></pre></div>
<p dir="auto">This would yield something like:</p>
<div class="highlight highlight-source-js notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="import {classCallCheck as _classCallCheck} from &quot;babel-external-helpers&quot;;

// ..."><pre class="notranslate"><span class="pl-k">import</span> <span class="pl-kos">{</span><span class="pl-s1">classCallCheck</span> <span class="pl-k">as</span> <span class="pl-s1">_classCallCheck</span><span class="pl-kos">}</span> <span class="pl-k">from</span> <span class="pl-s">"babel-external-helpers"</span><span class="pl-kos">;</span>

<span class="pl-c">// ...</span></pre></div>
<p dir="auto">Now anytime a module author publishes transpiled code using this option, they will be de-duplicated. Futhermore, if the application developer consuming these modules also transpiles their code, they can use the same <code class="notranslate">external-helpers</code> configuration and de-duplicate these helpers that are in their application code. In this case, all helpers, whether in node_modules or otherwise, will be de-duplicated (assuming semver compatibility).</p>
<h3 dir="auto">Current Behavior</h3>

<p dir="auto">If I publish a transpiled module, either:</p>
<ol dir="auto">
<li>I inline the babel helpers. This is sub-optimal because these helpers will potentially be duplicated many times in the consumer's browser bundle.</li>
<li>Use <code class="notranslate">babel-plugin-external-helpers</code> and reference a global <code class="notranslate">babelHelpers</code> variable. This is sub-optimal because any consumer of my library will not be able to use my library out of the box.</li>
</ol>
<h3 dir="auto">Context</h3>
<ul dir="auto">
<li>I'm a module author and application developer</li>
<li>As a module author, I publish my modules a Rollup builds in both CommonJS and ES Modules formats (using the <code class="notranslate">main</code> and <code class="notranslate">module</code> fields of the package.json)</li>
<li>The consumers of my modules don't transpile node_modules</li>
<li>The consumers of my modules use a tree-shaking module bundler that supports ES Modules syntax</li>
<li>The consumers of my modules want the babel helpers to be de-duplicated in the resultant bundle (across all node_modules as well as userland code)</li>
</ul>
<p dir="auto">This proposal should be relatively straightforward to implement, I'd be happy to work on a PR. This could be done fully via userland plugins, but the value of this is greater when everyone (particularly module authors) standardizes on the same external dependency.</p>
<p dir="auto">Hi, I just tried to extend Array in your playground, and tested it then again in an traceur playground</p>
<div class="highlight highlight-source-js notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="class FooArray extends Array {
  constructor(a) {
    super(a);
  }
}
var e = new FooArray();
e.push('bar');
console.log(e);"><pre class="notranslate"><span class="pl-k">class</span> <span class="pl-v">FooArray</span> <span class="pl-k">extends</span> <span class="pl-v">Array</span> <span class="pl-kos">{</span>
  <span class="pl-en">constructor</span><span class="pl-kos">(</span><span class="pl-s1">a</span><span class="pl-kos">)</span> <span class="pl-kos">{</span>
    <span class="pl-smi">super</span><span class="pl-kos">(</span><span class="pl-s1">a</span><span class="pl-kos">)</span><span class="pl-kos">;</span>
  <span class="pl-kos">}</span>
<span class="pl-kos">}</span>
<span class="pl-k">var</span> <span class="pl-s1">e</span> <span class="pl-c1">=</span> <span class="pl-k">new</span> <span class="pl-v">FooArray</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">;</span>
<span class="pl-s1">e</span><span class="pl-kos">.</span><span class="pl-en">push</span><span class="pl-kos">(</span><span class="pl-s">'bar'</span><span class="pl-kos">)</span><span class="pl-kos">;</span>
<span class="pl-smi">console</span><span class="pl-kos">.</span><span class="pl-en">log</span><span class="pl-kos">(</span><span class="pl-s1">e</span><span class="pl-kos">)</span><span class="pl-kos">;</span></pre></div>
<p dir="auto">6to5: {"0":"bar","length":1}</p>
<p dir="auto">tracur: ["bar"]</p>