Make it easier to add extra babel plugins

[rb1193]

To add a new babel plugin to the configuration, I had to override the entire "module" key in my project's webpack.config.js, which required me to copy all the babel configuration functions from webpack.common.js into my project's config file.

Fortunately for this project I can manage without this particular Babel plugin, so I decided not to bother as it would mean not being able to benefit from future changes to the webpack config in this package.

I'm not exactly sure what the best solution is for this - the mergeWithRules() function in https://github.com/survivejs/webpack-merge might provide a way forward. Alternatively it may be better to allow projects to pass extra configuration parameters to the webpack rules configuration functions (e.g. configureBabelLoader, configureEsLint - these could be exported). That could also get pretty messy though. I don't want to get too deeply into this at the moment but if I have time I will try to revisit.

[hatzipanis]

Good feedback, cheers @rb1193!

[rb1193]

Having spent a bit more time considering this I think it probably isn't realistic. Given that Facebook haven't found a way to do it in https://github.com/facebook/create-react-app haven't found a way to do it, I'd say it's pretty unlikely that we'd succeed where they have failed. They instead provide an "eject" command that simply duplicates all the webpack configs into your project.

Should we provide a similar eject command? Thoughts @judereid @thejoshsmith @hatzipanis ?

[judereid]

@rb1193 Just had a quick play around with this. For the specific issue here (adding babel plugins), it is currently possible to override the babel config by installing the desired plugin directly on the project and placing a .babelrc in the project root. This does appear to do some kind of 'merge', in that both plugins in the .babelrc and webpack config will be applied. I couldn't find any docs on this though so not sure exactly how it works.

An eject could be a worthwhile addition though depending on how much effort it is. It would be fairly trivial to just copy over the configurations and dependencies manually as it it right now.

cc @thejoshsmith

[moacode]

This is an interesting topic and probably warrants a wider discussion. My gut feeling after talking with @rb1193 yesterday is that perhaps we're better off providing an eject method if developers need to deviate from the standard config.

If the goal is to provide a zero config "ready to go" Webpack setup then to me it seems like if you need functionality outside of that, you're better off having a custom config.

Let's do some investigation and have a chat at the next dev meeting perhaps?