<p dir="auto">Here's the code I'm compiling:</p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="'use strict'

async function recurse(n) {
    if (n &gt; 0) {
        console.log(n)
        await recurse(n - 1)
    }
}

recurse(10)"><pre class="notranslate"><code class="notranslate">'use strict'

async function recurse(n) {
    if (n &gt; 0) {
        console.log(n)
        await recurse(n - 1)
    }
}

recurse(10)
</code></pre></div>
<p dir="auto">My package.json is:</p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="{
    &quot;scripts&quot;: {
        &quot;build&quot;: &quot;babel src --out-dir dist&quot;
    },
    &quot;devDependencies&quot;: {
        &quot;babel-cli&quot;: &quot;6.0.15&quot;,
        &quot;babel-plugin-transform-async-to-generator&quot;: &quot;6.0.14&quot;
    },
    &quot;babel&quot;: {
        &quot;plugins&quot;: [&quot;transform-async-to-generator&quot;]
    }
}"><pre class="notranslate"><code class="notranslate">{
    "scripts": {
        "build": "babel src --out-dir dist"
    },
    "devDependencies": {
        "babel-cli": "6.0.15",
        "babel-plugin-transform-async-to-generator": "6.0.14"
    },
    "babel": {
        "plugins": ["transform-async-to-generator"]
    }
}
</code></pre></div>
<p dir="auto">The compiled code is:</p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="'use strict';

let recurse = (function () {
    var ref = _asyncToGenerator(function* recurse(n) {
        if (n &gt; 0) {
            console.log(n);
            yield recurse(n - 1);
        }
    });

    return function recurse(_x) {
        return ref.apply(this, arguments);
    };
})();

function _asyncToGenerator(fn) { return function () { var gen = fn.apply(this, arguments); return new Promise(function (resolve, reject) { var callNext = step.bind(null, &quot;next&quot;); var callThrow = step.bind(null, &quot;throw&quot;); function step(key, arg) { try { var info = gen[key](arg); var value = info.value; } catch (error) { reject(error); return; } if (info.done) { resolve(value); } else { Promise.resolve(value).then(callNext, callThrow); } } callNext(); }); }; }

recurse(10);"><pre class="notranslate"><code class="notranslate">'use strict';

let recurse = (function () {
    var ref = _asyncToGenerator(function* recurse(n) {
        if (n &gt; 0) {
            console.log(n);
            yield recurse(n - 1);
        }
    });

    return function recurse(_x) {
        return ref.apply(this, arguments);
    };
})();

function _asyncToGenerator(fn) { return function () { var gen = fn.apply(this, arguments); return new Promise(function (resolve, reject) { var callNext = step.bind(null, "next"); var callThrow = step.bind(null, "throw"); function step(key, arg) { try { var info = gen[key](arg); var value = info.value; } catch (error) { reject(error); return; } if (info.done) { resolve(value); } else { Promise.resolve(value).then(callNext, callThrow); } } callNext(); }); }; }

recurse(10);
</code></pre></div>
<p dir="auto">Running this just prints '10', because the generated <code class="notranslate">function* recurse</code> function covers up the real function.</p>
<p dir="auto">This code worked with babel 5.x and doesn't with babel 6.x. The expectation is that countdown1 and countdown2 both produce the same results:</p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="'use strict';

function sleep(timeout) {
  return new Promise(function (resolve, reject) {
    setTimeout(function () {
      resolve();
    }, timeout);
  });
}

const countdown1 = async function (count) {
  console.log(count);
  await sleep(1000);
  if (--count) {
    await countdown1(count);
  }
};

async function countdown2(count) {
  console.log(count);
  await sleep(1000);
  if (--count) {
    await countdown2(count);
  }
};

countdown1(5)
  .then(function () {
    console.log('countdown1 done');
    return countdown2(5);
  })
  .then(function () {
    console.log('countdown2 done');
  });"><pre class="notranslate"><code class="notranslate">'use strict';

function sleep(timeout) {
  return new Promise(function (resolve, reject) {
    setTimeout(function () {
      resolve();
    }, timeout);
  });
}

const countdown1 = async function (count) {
  console.log(count);
  await sleep(1000);
  if (--count) {
    await countdown1(count);
  }
};

async function countdown2(count) {
  console.log(count);
  await sleep(1000);
  if (--count) {
    await countdown2(count);
  }
};

countdown1(5)
  .then(function () {
    console.log('countdown1 done');
    return countdown2(5);
  })
  .then(function () {
    console.log('countdown2 done');
  });
</code></pre></div>
<p dir="auto">From the produced code, it looks like the transformed countdown2 is getting shadowed by inner functions using the same name.</p>