fregante / browser-extension-template

📕 Barebones boilerplate with Parcel 2, options handler and auto-publishing
788 stars 76 forks source link

Replace webpack with Parcel #44

Closed fregante closed 3 years ago

fregante commented 3 years ago

Closes #34

Based on https://github.com/fregante/GhostText/pull/187, https://github.com/npmhub/npmhub/pull/119, https://github.com/tanmayrajani/notifications-preview-github/pull/113

But this PR introduces some cool changes like the preservation of webextension-polyfill without any bundling whatsoever, so it can be imported globally and once instead of once per bundle.

Wishlist/todo

Current output

❯ nr build
✨ Built in 2.39s

distribution/manifest.json                                                        565 B     92ms
distribution/icon.png                                                           1.14 KB     75ms
distribution/__/node_modules/webextension-polyfill/dist/browser-polyfill.js    36.61 KB    196ms
distribution/background.js                                                     33.61 KB    199ms
distribution/options.html                                                       1.05 KB    686ms
distribution/options.ed4d9118.css                                                 906 B    688ms
distribution/options.a7e143c4.js                                               34.95 KB    689ms
fregante commented 3 years ago

Another Parcel issue I found is that --no-content-hash doesn't seem to work because options.[hash].js changes hash depending on content.

This isn't an immediate issue here but it's an issue for Safari extensions because (sigh) Xcode configuration files include a static list of files to include.

mischnic commented 3 years ago

Yeah, I've noticed that as well: https://github.com/parcel-bundler/parcel/issues/5894

fregante commented 3 years ago

Thank you, excellent!

fregante commented 3 years ago

Since https://github.com/parcel-bundler/parcel/discussions/5858 isn't currently possible, I temporarily avoided that issue altogether with the commit above. This requires the user to manually load the polyfill in every file in order to use the browser API, but at least people can already start using Parcel without us having to wait for a fix.