Haul: Stop transpiling `import` to `require`

[grabbou]

Unlike packager, webpack has now native support for import and leaving it that way will not only simplify HMR setup but also enable possible code optimisations.

[grabbou]

We need to figure out how to make babel-preset-react-native updatable and configurable w/o forking for it to make sense long term.

[satya164]

https://github.com/babel/babel/blob/master/packages/babel-preset-es2015/src/index.js#L42

[grabbou]

Going to work on this one

[simonbuchan]

Looks like RN doesn't do this any more? https://github.com/facebook/react-native/commit/7f3090e4530cc87c73ae7b3cdbdd6b28c8172ed7

That said, babel-preset-env with targets: { ios: ? } (not sure what version used in Android) would probably be closer in terms of not transpiling JavaScriptCore supported syntax, supports latest standard (not proposals) for ECMAScript and has support for polyfilling on-demand. In theory, could replace a lot of what Haul and RN does....

[satya164]

Looks like RN doesn't do this any more

That just removes hardcoded dynamic import transform. It's not related to this.

[hedgepigdaniel]

This would be awesome - another advantage of this would be that webpack can warn when you import symbols from a file that are not exported. This saves lots of unecessary headache.

Related issue: https://github.com/react-community/react-native-maps/issues/1970 (there is an example repo there with a possible way of setting it up now, but it relies on manually setting up .babelrc with various plugins and quite possibly does things that are unecessary for react-native).

[hedgepigdaniel]

I made a PR to react-native here to allow that. Not sure when/if they will merge it or reimplement it, but in the meantime, Perhaps haul could use this: https://github.com/hedgepigdaniel/babel-preset-react-native?

Its just a fork of babel-preset-react-native which adds a "modules" option much like babel-preset-env etc. That way you can just add that option to the react-native preset options in .babelrc.

[hedgepigdaniel]

Adding module.strictExportPresence: true to the default webpack config would also generate errors when importing non existent exports. Saves a huge amount of time.

[zamotany]

Implemented in @haul-bundler/babel-preset-react-native