<h2 dir="auto">Bug Report</h2>

<ul class="contains-task-list">
<li class="task-list-item"><input type="checkbox" id="" disabled="" class="task-list-item-checkbox"> I would like to work on a fix!</li>
</ul>

<p dir="auto"><strong>Current behavior</strong></p>

<ul dir="auto">
<li><a href="https://babel.dev/repl#?browsers=defaults%2C%20not%20ie%2011%2C%20not%20ie_mob%2011&amp;build=&amp;builtIns=false&amp;spec=false&amp;loose=false&amp;code_lz=MYGwhgzhAEDC0G8BQ1oQC5nQS2KgZtALzQCMKamOeC0wA9gHYT0gCmAdCPQOYAU6ABbYIHfABpoQkWPwBKaAF8KGLLmj5CJAEwqq62g2atO3ftNGbJF2fKV61eTVugBmJIqA&amp;debug=false&amp;forceAllTransforms=false&amp;shippedProposals=false&amp;circleciRepo=&amp;evaluate=false&amp;fileSize=false&amp;timeTravel=false&amp;sourceType=module&amp;lineWrap=true&amp;presets=env%2Creact%2Cstage-2&amp;prettier=false&amp;targets=&amp;version=7.13.9&amp;externalPlugins=%40babel%2Fplugin-proposal-class-properties%407.13.0%2C%40babel%2Fplugin-proposal-class-static-block%407.12.13" rel="nofollow">REPL</a></li>
</ul>
<p dir="auto">According to <a href="https://github.com/tc39/proposal-class-static-block">https://github.com/tc39/proposal-class-static-block</a></p>
<blockquote>
<p dir="auto">A class may have any number of static {} initialization blocks in its class body.<br>
static {} initialization blocks are evaluated in document order interleaved with static field initializers.</p>
</blockquote>
<p dir="auto"><strong>Input Code</strong></p>
<div class="highlight highlight-source-js notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="class C {
  static  f = 1
  static { console.log(this.f, this.ff) }
  static ff = 2
  static { console.log(this.ff, this.fff) }
  static fff = 3
}"><pre class="notranslate"><span class="pl-k">class</span> <span class="pl-v">C</span> <span class="pl-kos">{</span>
  <span class="pl-k">static</span>  <span class="pl-c1">f</span> <span class="pl-c1">=</span> <span class="pl-c1">1</span>
  <span class="pl-c1">static</span> <span class="pl-kos">{</span> <span class="pl-c1">console</span><span class="pl-kos">.</span><span class="pl-c1">log</span><span class="pl-kos">(</span><span class="pl-s1">this</span><span class="pl-kos">.</span><span class="pl-s1">f</span><span class="pl-kos">,</span> <span class="pl-s1">this</span><span class="pl-kos">.</span><span class="pl-s1">ff</span><span class="pl-kos">)</span> <span class="pl-kos">}</span>
  <span class="pl-k">static</span> <span class="pl-c1">ff</span> <span class="pl-c1">=</span> <span class="pl-c1">2</span>
  <span class="pl-c1">static</span> <span class="pl-kos">{</span> <span class="pl-c1">console</span><span class="pl-kos">.</span><span class="pl-c1">log</span><span class="pl-kos">(</span><span class="pl-s1">this</span><span class="pl-kos">.</span><span class="pl-s1">ff</span><span class="pl-kos">,</span> <span class="pl-s1">this</span><span class="pl-kos">.</span><span class="pl-s1">fff</span><span class="pl-kos">)</span> <span class="pl-kos">}</span>
  <span class="pl-k">static</span> <span class="pl-c1">fff</span> <span class="pl-c1">=</span> <span class="pl-c1">3</span>
<span class="pl-kos">}</span></pre></div>
<p dir="auto"><strong>Expected behavior</strong></p>

<p dir="auto">Multiple block works fine. And the evaluate order follow the document order.</p>
<p dir="auto">But currently:</p>
<blockquote>
<p dir="auto">Duplicate static block in the same class (5:2)</p>
</blockquote>
<p dir="auto"><strong>Babel Configuration (babel.config.js, .babelrc, package.json#babel, cli command, .eslintrc)</strong></p>
<ul dir="auto">
<li>Filename: <code class="notranslate">babel.config.js</code></li>
</ul>
<div class="highlight highlight-source-js notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="{
  &quot;your&quot;: { &quot;config&quot;: &quot;here&quot; }
}"><pre class="notranslate"><span class="pl-kos">{</span>
  <span class="pl-s">"your"</span>: <span class="pl-kos">{</span> <span class="pl-s">"config"</span>: <span class="pl-s">"here"</span> <span class="pl-kos">}</span>
<span class="pl-kos">}</span></pre></div>
<p dir="auto"><strong>Environment</strong></p>

<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content=""><pre class="notranslate"><code class="notranslate">
</code></pre></div>
<ul dir="auto">
<li>Babel version(s): [e.g. v7.12.0]</li>
<li>Node/npm version: [e.g. Node 12/npm 7]</li>
<li>OS: [e.g. macOS 10.15.4, Windows 10]</li>
<li>Monorepo: [e.g. yes/no/Lerna]</li>
<li>How you are using Babel: [e.g. <code class="notranslate">webpack</code>, <code class="notranslate">rollup</code>, <code class="notranslate">parcel</code>, <code class="notranslate">babel-register</code>]</li>
</ul>
<p dir="auto"><strong>Possible Solution</strong></p>

<p dir="auto"><strong>Additional context</strong></p>
<p dir="auto"><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/let" rel="nofollow">https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/let</a></p>
<blockquote>
<p dir="auto">Redeclaration of the same variable in the same block scope raises a TypeError.</p>
<div class="highlight highlight-source-js notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="if (x) {
  let foo;
  let foo; // TypeError thrown.
}"><pre class="notranslate"><span class="pl-k">if</span> <span class="pl-kos">(</span><span class="pl-s1">x</span><span class="pl-kos">)</span> <span class="pl-kos">{</span>
  <span class="pl-k">let</span> <span class="pl-s1">foo</span><span class="pl-kos">;</span>
  <span class="pl-k">let</span> <span class="pl-s1">foo</span><span class="pl-kos">;</span> <span class="pl-c">// TypeError thrown.</span>
<span class="pl-kos">}</span></pre></div>
<p dir="auto">However, function bodies do not have this limitation!</p>
<div class="highlight highlight-source-js notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="function do_something() {
  let foo;
  let foo; // This works fine.
}"><pre class="notranslate"><span class="pl-k">function</span> <span class="pl-en">do_something</span><span class="pl-kos">(</span><span class="pl-kos">)</span> <span class="pl-kos">{</span>
  <span class="pl-k">let</span> <span class="pl-s1">foo</span><span class="pl-kos">;</span>
  <span class="pl-k">let</span> <span class="pl-s1">foo</span><span class="pl-kos">;</span> <span class="pl-c">// This works fine.</span>
<span class="pl-kos">}</span></pre></div>
</blockquote>
<p dir="auto"><strong>Babel</strong></p>
<div class="highlight highlight-source-js notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="function do_something() {
  let foo;
  let foo; // Duplicate declaration &quot;foo&quot;
}"><pre class="notranslate"><span class="pl-k">function</span> <span class="pl-en">do_something</span><span class="pl-kos">(</span><span class="pl-kos">)</span> <span class="pl-kos">{</span>
  <span class="pl-k">let</span> <span class="pl-s1">foo</span><span class="pl-kos">;</span>
  <span class="pl-k">let</span> <span class="pl-s1">foo</span><span class="pl-kos">;</span> <span class="pl-c">// Duplicate declaration "foo"</span>
<span class="pl-kos">}</span></pre></div>
<p dir="auto"><a href="https://babeljs.io/repl/#?experimental=true&amp;evaluate=true&amp;loose=true&amp;spec=false&amp;code=function%20do_something%28%29%20%7B%0A%20%20let%20foo%3B%0A%20%20let%20foo%3B%20%2F%2F%20This%20works%20fine.%0A%7D" rel="nofollow">https://babeljs.io/repl/#?experimental=true&amp;evaluate=true&amp;loose=true&amp;spec=false&amp;code=function%20do_something%28%29%20{%0A%20%20let%20foo%3B%0A%20%20let%20foo%3B%20%2F%2F%20This%20works%20fine.%0A}</a></p>