<p dir="auto">As described in the gitter.im channel <a href="https://gitter.im/babel/babel?at=55243a3438224c543c15dbc4" rel="nofollow">7. April 2015 16:12 Uhr</a> ...<br>
Summary:<br>
The <a class="user-mention notranslate" data-hovercard-type="organization" data-hovercard-url="/orgs/annotation/hovercard" data-octo-click="hovercard-link-click" data-octo-dimensions="link_type:self" href="https://github.com/annotation">@annotation</a> doesn't receive hygiene treatment such as other vars do on actually pointing to an import ...</p>
<p dir="auto">Consider this test case:</p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="import {Async} from '../';

@Async
export default class App extends React.Component {
}

@Async
class Nested extends React.Component {
}"><pre class="notranslate"><code class="notranslate">import {Async} from '../';

@Async
export default class App extends React.Component {
}

@Async
class Nested extends React.Component {
}
</code></pre></div>
<p dir="auto">which is compiled by <code class="notranslate">./node_modules/.bin/babel --stage 0 ./babel-bug.js</code> into:</p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="'use strict';

var _classCallCheck = ...

var _inherits = ...
Object.defineProperty(exports, '__esModule', {
  value: true
});

var _Async = require('../');

var App = (function (_React$Component) {
  function App() {
    _classCallCheck(this, App);

    if (_React$Component != null) {
      _React$Component.apply(this, arguments);
    }
  }

  _inherits(App, _React$Component);

  exports.App = App = Async(App) || App;
  return App;
})(React.Component);

exports['default'] = App;

var Nested = (function (_React$Component2) {
  function Nested() {
    _classCallCheck(this, Nested);

    if (_React$Component2 != null) {
      _React$Component2.apply(this, arguments);
    }
  }

  _inherits(Nested, _React$Component2);

  Nested = _Async.Async(Nested) || Nested;
  return Nested;
})(React.Component);

module.exports = exports['default'];"><pre class="notranslate"><code class="notranslate">'use strict';

var _classCallCheck = ...

var _inherits = ...
Object.defineProperty(exports, '__esModule', {
  value: true
});

var _Async = require('../');

var App = (function (_React$Component) {
  function App() {
    _classCallCheck(this, App);

    if (_React$Component != null) {
      _React$Component.apply(this, arguments);
    }
  }

  _inherits(App, _React$Component);

  exports.App = App = Async(App) || App;
  return App;
})(React.Component);

exports['default'] = App;

var Nested = (function (_React$Component2) {
  function Nested() {
    _classCallCheck(this, Nested);

    if (_React$Component2 != null) {
      _React$Component2.apply(this, arguments);
    }
  }

  _inherits(Nested, _React$Component2);

  Nested = _Async.Async(Nested) || Nested;
  return Nested;
})(React.Component);

module.exports = exports['default'];
</code></pre></div>
<p dir="auto">Now this fails with:</p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="  exports.App = App = Async(App) || App;
                      ^
ReferenceError: Async is not defined"><pre class="notranslate"><code class="notranslate">  exports.App = App = Async(App) || App;
                      ^
ReferenceError: Async is not defined
</code></pre></div>