Babel 6 transform-runtime: $export is not a function

Question

I'm trying to incorporate Babel's transform-runtime to make my code compatible with IE9. But since integrating it, the code won't even run on Chrome. I get the error Uncaught TypeError: $export is not a function on es6.object.define-property.js:3. Without the "transform-runtime" line in my .babelrc, everything runs fine. Any ideas?

Here is my .babelrc:

{
  "plugins": [
    "transform-runtime"
  ],
  "presets": [
    "es2015",
    "react"
  ]
}

And my webpack.config.js:

var webpack = require('webpack');

var commonsPlugin = new webpack.optimize.CommonsChunkPlugin('common.js');

module.exports = {
  entry: {
    EventAdmin: './src/event_admin',
    EventRender: './src/event_render'
  },
  output: {
    path: '../public/js2',
    filename: '[name].js' // Template based on keys in entry above
  },
  externals: {
    // require("jquery") is external and available
    //  on the global var jQuery
    'jquery': 'jQuery'
  },
  plugins: [commonsPlugin],
  devtool: 'source-map',
  module: {
    loaders: [
      { test: /\.css$/, loader: 'style-loader!css-loader' },
      {
        test: /\.js$/,
        loader: 'babel-loader'
      },
    ]
  }
};

I'm getting the same error and already tried the suggestions available on the thread, but unfortunately without any success. The code can be found here - https://github.com/ipfs/js-ipfs-unixfs-engine/pull/35 — David Dias, Apr 30 '16 at 21:27
Ted Avery, could you mark @Pierre Wahlgren's answer as correct. He has the most up votes cause it's a good answer that helps — silverlight513, Feb 03 '17 at 14:59
@silverlight513 It's not the correct answer. Like he said, he has no idea why it works. — Charlie Martin, Jun 19 '17 at 19:30
It *is* the correct answer, even if he didn't know why. The reason why it is is that this way you tell Babel not to apply code transforms to everything in the `node_modules` directory (which usually doesn't make sense and is not required, as it is not your code). — Golo Roden, May 06 '18 at 07:41

score 48 · Answer 1 · answered Apr 04 '16 at 13:59

48

Try adding exclude: /node_modules/ after loader: 'babel-loader'. I had the same problem when trying to run the runtime transformer without excluding node_modules. I am not aware of the underlying problem, though.

answered Apr 04 '16 at 13:59

Pierre Wahlgren

875
7
15

You guys made my day. Thanks a lot. – Natim Jun 08 '16 at 14:24
Same problem. Everything goes right after exclude node_modules. Thanks! – aztack Jul 19 '16 at 05:19
1

I had `exclude: /\/node_modules\//`, changing that to `exclude: /node_modules/` fixed this. – P Varga Sep 01 '17 at 16:34
2

I had `exclude: "/node_modules/"`, fixed by changing to `exclude: /node_modules/` – Nathan Strutz May 07 '18 at 15:48
1

specifically, the `/node_modules/` exclude *must* be a regex expression and not a string. – worc Aug 29 '18 at 00:37
I am still wondering why this could work. How the error happened – hh54188 May 19 '19 at 15:59

score 23 · Answer 2 · answered Sep 15 '16 at 02:37

23

Hello I have the same issue and finally found a solution that works for me. See:

loaders: [
  {
    test: /.js/,
    loader: 'babel',
    query: {
      presets: ['es2015', 'es2017'],
      plugins: [
        ['transform-runtime', {
          helpers: false,
          polyfill: false,
          regenerator: true, }],
        'transform-es2015-destructuring',
        'transform-object-rest-spread',
        'transform-async-to-generator',
        ],
     },
  },
]

See the 'transform-runtime' part. I hope this helps.

answered Sep 15 '16 at 02:37

Carlos Galarza

231
2
3

1

I had both the error from the OP and `TypeError: __webpack_require__(...) is not a function` through experimentation. Here's a [wepack issue](https://github.com/webpack/webpack/issues/4012#issuecomment-280708597) that shows my working `.babelrc` and webpack config. – kross Feb 17 '17 at 17:16
Thanks, this also worked for me, using gulp `["transform-runtime", { "helpers": false, "polyfill": false, "regenerator": true } ],` – blamb Nov 22 '17 at 18:06
This says to do opposite - https://stackoverflow.com/a/33979035/1429097 Issue seems similar – Abhinav Singi Apr 04 '18 at 10:10

André Moraes · Answer 3 · 2016-05-24T17:29:55.903

8

You can try replace "exclude" by "include", following the recomendations from documentation.

Try to prefer "include" when possible...

This worked for me.

{
  "test": /\.js/,
  "loader": "babel",
  "include": [path.resolve(__dirname, './src')]
}

edited May 24 '16 at 17:29

answered May 24 '16 at 17:16

André Moraes

324
3
11

score 4 · Answer 4 · answered May 06 '18 at 12:26

At first you must installed babel-plugin-transform-runtime and then use it like me:

{
  "presets": [
    "es2015",
    "react",
    "stage-0"
  ],
  "plugins": [
    "transform-runtime"
  ]
}

After it you must add exclude key to your babel-loader inside webpack configuration file:

{
    test: /\.(js|jsx)$/,
    exclude: /node_modules/,
    use: [
        {
            loader: 'babel-loader',
        }
    ]
}

Attention: please write /node_modules/ not /(node_modules\/)/ or /node_modules\//, it's weird but this way works.

score 2 · Answer 5 · answered Dec 29 '16 at 07:31

It looks to be a problem with running core-js files through Babel 6 because Babel 6 no longer converts require('something') to require('something').default as Babel 5 did. I even tried running it through this plugin https://www.npmjs.com/package/babel-plugin-add-module-exports but no matter what I did, it wouldn't correct the require statements properly. I ultimately just had to exclude the core-js and various Babel related files from being processed by the babel-loader by setting the exclude property to this:

[ /node_modules\/babel-/m, /node_modules\/core-js\//m, /node_modules\/regenerator-runtime\//m ]

As a side note, I hadn't reinstalled my node_modules since converting to Babel 6 and that caused the same issue but for some other mysterious reason.

score 2 · Answer 6 · answered Jun 12 '17 at 09:57

For those of you who are using webpack, make sure to no include the node_modules folder with the following in your webpack configuration file:

module: {
  rules: [
    {
      test: /\.js$/,
      // With this line, make sure you only include your javascript
      // source files
      include: [ path.resolve(__dirname, './src') ],
      use: {
        loader: 'babel-loader',
        options: {
          presets: ['env'],
          plugins: ['transform-runtime']
        }
      }
    }
  ]
}

score 1 · Answer 7 · answered Mar 30 '16 at 16:21

1

Have you install also the babel-runtime?

I just installed both and added the plugin in the .babelrc and it worked out.

answered Mar 30 '16 at 16:21

RMontes13

2,138
3
16
23

Yes I did, do I need to do anything special to use it? I don't reference it anywhere, I understood that using the "transform-runtime" plugin in.babelrc would use it automatically. – Ted Avery Mar 30 '16 at 22:17

Babel 6 transform-runtime: $export is not a function

7 Answers7

Linked