BUG: “export ‘default’ (imported as ‘selection_enter’) was not found in ‘./enter’

Do you want to request a feature or report a bug?
BUG

What is the current behavior?
Currently if you try to use d3.js library, webpack will generate warning:
“export ‘default’ (imported as ‘selection_enter’) was not found in ‘./enter’

That is not so big problem, but when you run javascript generated by webpack it will fail with error:
SyntaxError: function statement requires a name

Problem is using ES2015 import default and export default which is not working.

If the current behavior is a bug, please provide the steps to reproduce.
https://github.com/kukjevov/webpack-error-sample

What is the expected behavior?
It should work

If this is a feature request, what is motivation or use case for changing the behavior?

Please mention other relevant information such as the browser version, Node.js version, webpack version and Operating System.
nodejs: 7.10, webpack 2.5.0, Windows 10

Author: Fantashit

13 thoughts on “BUG: “export ‘default’ (imported as ‘selection_enter’) was not found in ‘./enter’

  1. As i wrote down it compiles with warnings. But these warnings ends up in browser with syntax error as mentioned above:
    SyntaxError: function statement requires a name

    Thanks 🙂

  2. Well i have temporarily solved it by using import {} from ‘d3’ as whole library. There is no problem, but with partial ‘d3-shape’ etc it is not working. But it was working in older versions of Webpack. So this is not critical for me, but i was thinking maybe it is good to look at that if it can cause problems.

    Thanks 🙂

  3. Have the same issue.
    Node 7.10 Webpack 2.5.1
    With “d3-shape”

    4:9-18 "export 'default' (imported as 'ascending') was not found in './ascending'
    

    maybe it is because of the unamed function

    # d3-shape/src/constant.js
    export default function(x) {
      return function constant() {
        return x;
      };
    }

    will pack to

    /******/ ([
    /* 0 */
    /***/ (function(module, __webpack_exports__, __webpack_require__) {
    "use strict";
    function(x) {
      return function constant() {
        return x;
      };
    }
    /***/ }),
    /* 1 */
    

    the export default is missing.
    when i named it, it works well.

  4. I just stumbled upon the same error at work with react:

    WARNING in ./components/Button/index.js
    56:2-7 "export 'default' (imported as 'React') was not found in '../../..'

    Haven’t managed to narrow it down to a small test case yet, though.

    EDIT: Found the issue!!

    In my case the issue was caused by the src/ folder which is react/ in our case (not my project). Something like this:

    /myproject
      /react
        Foo.js
        index.js
    

    In this case when importing react import React from "react" the path was resolved to my weirdly named src folder which obviously is not a valid js module.

  5. Got the same problem!
    export 'compose' was not found in 'redux'
    The issue was that one of my folders in project was named redux.

  6. this might be of use for someone. had a similar issue when i was updating an old create-react-app application. had to change all occurrences of

    module.exports = Blabla;

    to

    export default Blabla;
  7. In case anyone stumbles across this thread… you’ll also see the error reported here if you try to process the babel-runtime itself through babel-plugin-transform-runtime (i.e., by not excluding it from the babel-loader in webpack).

  8. In case anyone stumbles across this thread… you’ll also see the error reported here if you try to process the babel-runtime itself through babel-plugin-transform-runtime (i.e., by not excluding it from the babel-loader in webpack).

    @zebulonj You are the best. Only your solution worked for me !! Thank you very much !!

  9. So I’ve been working on this vue-cli project for days that uses webpack. I had a simple config file that was module.exports = {stuff} and now today for some reason webpack started up with this problem and I had to switch it over to export default {stuff} … I have no idea why for days the old style export was fine and all of a sudden when I run the dev environment today it was not. That’s pretty odd!?

  10. In our Node project, we use a CommonJS module that is included on both server-side and client-side. Everything worked fine until we added @babel/plugin-transform-runtime. It started showing compilation warning mentioned here. And in the browser it just fails with Uncaught TypeError: Cannot assign to read-only property 'exports' of object '#<Object>'.

    I’ve discovered that it can be fixed by adding @babel/plugin-transform-modules-commonjs.

  11. In my case, this occurred while updating to Babel 7. The key was adding modules: 'commonjs' to the presets in our babel.config.js file.

    presets: [
            '@babel/preset-react',
            ['@babel/preset-env', {
              modules: 'commonjs',
              ...
    
  12. I’ve discovered that it can be fixed by adding @babel/plugin-transform-modules-commonjs.

    The key was adding modules: 'commonjs' to the presets in our babel.config.js file.

    Both these options made my warnings/errors go away and also made my bundle size explode from 472 KiB (without using @babel/plugin-transform-runtime) to 865 KiB.

    Quoting the docs:

    A plugin that enables the re-use of Babel’s injected helper code to save on codesize.

    When you tell Babel to transform ES modules to CommonJS, you’re disabling Webpack’s tree shaking, which is enabled by default in production builds. Although the bundle size saving provided by @babel/plugin-transform-runtime is not insignificant, it pales in comparison to Webpack’s tree shaking.

    The real fix here is to simply not use @babel/plugin-transform-runtime until this issue is fixed or someone shows us how to use the tools properly.

Comments are closed.