ThreeJS module is not transpiled by Babel

Im using Three.js as a module, transpiling a code using Babel, packing with WebPack. The problem is that even all the other code is properly transpiled, the three.js module is not and still contains ES6 syntax. Which causes problems in IE11.

.babelrc

{
    "presets": [
        [
        "@babel/preset-env" , {
        "targets": {
            "ie": "11"
        }
    }]
    ],
    "plugins": [
        "@babel/plugin-proposal-class-properties",
        "@babel/plugin-transform-classes"
    ]
}

webpack.config

 module: {
    rules: [
      {
        test: /\.js$/,
        //exclude: /node_modules/,
        loaders: ['babel-loader']
      },
...

Here I commented out to exclude the node_module folder, but even with that the problem still persists

Any idea what is wrong and how I could get transpiled Threejs module? Thanks a lot

Upvotes: 1

Views: 1073

Answers (1)

vector3
vector3

Reputation: 21

This worked for me:

In the webpack config, set the exclude property like this:
exclude: /node_modules\/(?!(three)\/).*/,.

This forces babel to transpile three no matter what.
Reference: stackoverflow

Cheers

Upvotes: 2

Related Questions