IE11 is not supported in ESM bundle

[malykhinvi]

Environment details

1. react-google-maps-api - it uses js-api-loader as a dependency
2. Windows 10, IE11
3. 1.11.4

Steps to reproduce

1. Using webpack, build the app with react-google-maps-api useJsApiLoader hook. Underhood, it will import js-api-loader using module: dist/index.esm.js.
2. Open the app in IE11, there will be an error related to unsupported syntax.

The reason is that esm file contains arrow functions, which are not supported in IE11.
I noticed, that in .babelrc IE11 is mentioned in the list of supported browsers. So, probably it worth compiling code to ES5 target to support IE11.

For reference, I found this doc in the rollup repo, that suggests compiling everything except for import/export.

[jpoehnelt]

It is impossible for a library author to know what target to transpile against and is thus up to application developers to set the proper babel configuration when using the module file. The .babelrc file here is only for the benefit of users that may load the cdn version directly in the browser. Even if it was reasonable as a library author to determine browser targets, I likely wouldn't include IE11 going forward.

Please ensure that you are using the babel-loader correctly in Webpack.

[malykhinvi]

I think it is common to transpile to ES5 so the library would be compatible with pretty much every environment. As I understand, the module support in package.json is not something official, instead, it is more like an agreement between different bundlers. According to that agreement both rollup and webpack mention:

The module property should point to a script that utilizes ES2015 module syntax but no other syntax features that aren't yet supported by browsers or node.

Of course, most ES6 features are already supported in browsers and node, and it is time to say farewell to IE11 :) I'm just curious what can potentially cause bundler to use main instead of a module, that would lead to a somewhat unexpected result. Maybe it worth mentioning this subtlety in the README?

Please ensure that you are using the babel-loader correctly in Webpack.

Currently, babel-loader is used for everything except for node_modules. Do you suggest using babel-loader to transpile sources of js-api-loader?

[jpoehnelt]

You might want to check the following:

https://stackoverflow.com/a/56428646/3145360
webpack/webpack#2031
https://stackoverflow.com/a/60395448/3145360

[malykhinvi]

Thanks, just wanted to clarify what you mean.

So, as IE 11 is not supported, what do you think about mentioning it in the README? Other than that, feel free to close the issue.