search

xolvio / storybook-webpack-federation-plugin

Exposes all the components in your Storybook as Webpack 5 federated components.
MIT License
57 stars 5 forks source link

replace all occurrences of - in name with _ #5

Closed TillaTheHun0 closed 4 years ago

TillaTheHun0 commented 4 years ago

The ModuleFederationPlugin causes an error to be thrown at runtime when using a name with a - in it. This is because the new Webpack output, the remoteEntry.js in this case, attempts to create a JS variable with the given name, ergo the first '-' in the name produces a SyntaxError.

This PR replaces all instances of '-' in the name with _. I admit this is a bit esoteric though. Maybe this should be fixed in the ModuleFederationPlugin somehow? Open to thoughts.

lgandecki commented 4 years ago

I think we could show a warning (or even throw) when someone tries to use - in the name.

TillaTheHun0 commented 4 years ago

I think the problem here is that you will define your host as "xolvio-ui" but then when importing things from it you would have to import from xolvio_ui which would be confusing. This definitely have to be fixed in the webpack itself.

@lgandecki I agree with that. The fact that the Module Federation plugin can produce syntactically invalid JavaScript seems to be the issue here.

I think we could show a warning (or even throw) when someone tries to use - in the name.

I think throwing at build time would be better than throwing at runtime, especially for a syntax error. Again, maybe that belongs in Webpack core more than a separate plugin.

edit: additional clarity on which plugin

TillaTheHun0 commented 4 years ago

I think i'll go ahead and close this. i'll try and look at the ModuleFederationPlugin and see if I can grok it and make an improvement there in regards to this issue. Thanks!