title: How to use both module.exports and exports.default
body: <p>Is it possible that a module can be imported both like this,</p>
  
  <pre class="lang-js prettyprint-override"><code>import foo from 'foo';
  </code></pre>
  
  <p>and like this?</p>
  
  <pre class="lang-js prettyprint-override"><code>const foo = require('foo');
  </code></pre>
  
  <p>If so, the syntax of the export could look something like that:</p>
  
  <pre class="lang-js prettyprint-override"><code>const foo = 'a string to export';
  exports.default = foo;
  module.exports = foo;
  </code></pre>
  
  <p>But according to <a href="https://stackoverflow.com/a/54900077/9515617">this answer</a>, it's an incorrect syntax.</p>
  
  <p>I ask this question because I came across a module that use this syntax and is bugged (<code>import foo from 'foo'</code> makes <code>foo</code> be <code>undefined</code> but <code>const foo = require('foo')</code> is fine).
  But in the other hand, the <a href="https://www.npmjs.com/package/babel-plugin-add-module-exports" rel="nofollow noreferrer">add-module-exports plugin</a> adds this syntax deliberately, so I'm a bit lost.</p>
  
  <hr>
  
  <p>EDIT:</p>
  
  <p>I found a way, but it's a bit hacky and it induces a circular reference, so I wouldn't say that it's the answer:</p>
  
  <pre class="lang-js prettyprint-override"><code>module.exports = foo;
  module.exports.default = foo;
  </code></pre>