HomePhabricator
Diffusion Comm 08eb701d6c08

Make react-icomoon work with Webpack 5

Description

Make react-icomoon work with Webpack 5

Summary:
react-icomoon has a quirky CommonJS export with a hack meant to make it work when imported from an ES Modules context. The idea was that would set exports.__esModule to enable the hack, and you would export a prop named default that would be the "default" import for the ESM.

This hack was supported in Webpack 4, but not in Webpack 5. There's a lot of noise about this on GitHub, but the Webpack team points to Node as no longer supported this hack either as justification for pulling it out.

The react-icomoon package uses this hack. I tried upgrading it, but the latest version still had the same problem. To get around it, I just update the code to access .default directly.

Note that this means lib/components/SWMansionIcon.react.js wouldn't work in a React Native context, despite react-icomoon claiming to support React Native. But we don't need it on React Native since we use createIconSetFromIcoMoon from @expo/vector-icons instead.

Depends on D6703

Test Plan:

  1. I tested dev build in web via yarn dev in web + keyserver and then tested the website
  2. I tested prod build by running yarn prod in web and then tested the website by running keyserver with yarn prod-build && yarn-prod

Reviewers: atul, tomek

Reviewed By: atul

Differential Revision: https://phab.comm.dev/D6704

Details

Provenance
ashoatAuthored on Feb 12 2023, 11:18 AM
Reviewer
atul
Differential Revision
D6704: Make react-icomoon work with Webpack 5
Parents
rCOMM3e5d4f44ecf0: [lib][web][landing] Update Wagmi and RainbowKit
Branches
Unknown
Tags
Unknown