DanielSchaffer/webpack-babel-multi-target-plugin

Cannot find module 'webpack-dev-server/client/index'

Closed this issue · 5 comments

gaje commented

Doesnt seem to work if you dont have webpack-dev-server installed. Dies on Cannot find module 'webpack-dev-server/client/index'

Also docs/example feel incomplete. Example code in README shows pluginFactory but that is never referenced. Would it be possible to update this with a full working example config?

Confirm the same bug. I don't use webpack-dev-server so I would make this dependency optional.
The same goes for HtmlWebpackPlugin, I don't use it, and though it's in deps list, example doesn't say that it's mandatory to put in plugins list

@gaje @beshanoe

Hi folks, thanks for the reports. My apologies for the delay - for some reason I had notifications turned off for this repository, so I only just saw it now.

I've got a fix coming shortly for the Cannot find module issue, and I'll also review the docs. The architecture for the plugin changed significantly a couple months ago, and it's entirely likely I missed some bits in there.

@gaje @beshanoe

Should be good to go now - give it a shot with v1.0.0-alpha.4.

The documentation wasn't actually too badly out of date, there was just that one const pluginFactory left over from the old code that wasn't actually doing anything. Basically, the minimum you need to do is add the plugin, add es2015 to your mainFields, and then replace anywhere you use 'babel-loader' with BabelMultiTargetPlugin.loader. There are other caveats for TypeScript, but it's all in the documentation.

I also added documentation for the plugin options if you need to customize it at all. Feel free to open other issues if there are other pieces missing.

gaje commented

@DanielSchaffer Thanks!

One call out I have is that by default, just importing the plugin doesnt work:
const BabelMultiTargetPlugin = require('webpack-babel-multi-target-plugin')

as this will die with BabelMultiTargetPlugin is not a constructor, so you have to import it like:

const BabelMultiTargetPlugin = require('webpack-babel-multi-target-plugin').BabelMultiTargetPlugin;

May want to add this to the docs.

Also - is there any way to target an entry to include babel polyfills? For example, i would like to include the 'regenerator-runtime/runtime' polyfill for the modern bundle (so i can use async/await), and then include the entire babel-polyfill for the legacy bundle. Not sure if this is something that is possible currently, but would be a useful feature if its not!

@gaje Thanks, I'll make sure the examples include the correct import notation.

As far as polyfills - for any of those, my understanding is that with @babel/preset-env and the useBuiltIns: 'usage' setting, you don't need to explicitly include any polyfills - it'll pull them in as needed. Are you missing any of these things in your output?

If you are missing things, you should be able to customize the options to include them - see https://github.com/DanielSchaffer/webpack-babel-multi-target-plugin#options-reference. I believe you'd be looking for adding configuration to babel.presetOptions.include (which corresponds to this: https://babeljs.io/docs/en/babel-preset-env#include)