Assist with node polyfilling
We turned off webpack's "automagically polyfill all the node things", because it wasn't intentional and we got real reports of people ending up with surprisingly huge polyfills that they didn't want in their build.
But it seems the general state of NPM authoring standards for browser code is poor, and many apps really do need to polyfill node features. It would help users if we can offer better guidance here.
Since we transpile dependencies by default anyway, it wouldn't be very expensive to add a babel plugin that detects node features and offers a clear message:
Error: you tried to auto-import "some-library", but it depends on node's "path" library and doesn't work in web browsers. You could solve this problem by running the command:
ember auto-import-polyfill path
The command would install any necessary libraries (in this case, path-browserify) and update the auto-import config to use them.
However, the challenge here is that libraries that are actually trying to be portable might only be checking for node features and then happily switch into a browser mode when they don't exist:
try {
require('path');
} catch(err) {
// not running in node, so leave out a few node-only features
}
In these cases it's bad to automatically polyfill because it's unnecessary and you lose out on the library author's own preferred way of running in the browser. And it's bad to warn or error, because it may be legitimate to ignore. In general, we can't tell which things are hard dependencies and which have fallbacks in the library itself.
@jenweber can you remind me again the list of apps you mentioned that hit node polyfilling problems? I'd like to get a sense for which exact features they need. Some are easier than others.
Some anecdata says that global is a pretty common one, and it's one of the safest and cheapest to automatically polyfill.
I created an example application recreating this problem that uses eventsource. I observed this in our application and applied your suggestion in #224 to fix our build.
That library uses http and https.
Webpack 5 disables the automatic polyfills by default. So we don’t need to be the bad guys. Library authors are going to need to get better at this.