Closed matiasbenedetto closed 12 months ago
I'm a little confused why you would add the browser library to your bundle when it's already a standard JS library that you can load with a <script>
tag your html (template)? You can access any out-of-bundle global via the universal globalThis
keyword (which in the browser maps to window
and in Node maps to global
).
I think the idea here is to avoid polluting the global window
with the API for this library. Any variable added like that globally becomes defecto an API for third-party developers of our app that we may not want to expose (for backwards compatibility reasons)
Then don't use lib-font.browser.js
, use the normal module with externals (fs, zlib, etc) shims for in your webpack.config.js, or even better, don't bundle it in. Instead, generate an ESM bundle with ./lib-font-browser.js
as an external so that webpack leaves that statement in your code as-is, and then when the browser loads in your bundle, normal in-browser ESM module loading will load that code in.
I'll add a section to the README on how to do this, although at this point I'm not sure it makes sense to even still use webpack, it's kind of a terrible bundler that we all used because as bad as it was, it was better than browserify. Ever since esbuild
got released, webpack's been a legacy bundler.
(Having said that: other people using undocumented globals is their problem, not yours. If someone doesn't stick to your API docs, that's on them)
Hi :wave: I'm trying to use the browser bundle in a large project where the dependencies are managed using NPM and the project is built using webpack. I have a few questions about that:
It seems like I can not import
lib-font.browser.js
using the npm installed package. Can I?If I
import { Font } from "lib-font"
I get errors aboutfs
andzlib
missing dependencies. I could avoid that failure by adding the following config to the webapck config file. But due to characteristics of this project I can't modify the webpack config file.Apart I tried copying the entire
lib-font.browser.js
file into my project's source code I get errors when building the app with webapck:If I delete the references to fs and zlib from
lib-font.browser.js
it works as expected but I would like to avoid forking the package. So I return to my original question: Is there any way to include the lib-font browser bundle in a npm + webpack project without errors about missing dependencies?Thanks for the great work!