search

airbnb / lottie-web

Render After Effects animations natively on Web, Android and iOS, and React Native. http://airbnb.io/lottie/
MIT License
29.85k stars 2.85k forks source link

Distribute ESM in the package, add an exports map #2962

Open dzearing opened 1 year ago

dzearing commented 1 year ago

Modern tooling can leverage exports maps in the package.json to allow consumers to only import what you want to expose as a contract. They can also help define how to resolve those files based on different environments.

Bundlers also require ESM to be distributed in order to support tree shaking. i see consumers in our apps using this package, but tree shaking bails out due to CJS only. If you addd ESM, you can leverage exports to map out where things are located and what can/should be imported.

Example:

        "exports": {
          ".": {
            "types": "./index.d.ts",
            "require": "./build/player/lottie.cjs",
            "import": "./esm/build/player/lottie.mjs",
          },
          "./build/player/lottie_light": {
            "require": "./build/player/lottie_light.cjs"
            "import": "./esm/build/player/lottie_light.mjs"
          }
        }