airbnb / lottie-web

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

Publish standard JS module distribution #1664

Open justinfagnani opened 5 years ago

justinfagnani commented 5 years ago

I see that lottie.js is a UMD module, and there doesn't appear to be a standard JS module published to npm at least. This makes it difficult to use lottie in other modules.

Since all current browsers support modules natively, it'd be great to publish a module so that other module can use lottie as a dependency.

justinfagnani commented 5 years ago

For others looking for this too, there is a workaround where we trick the UMD loader into think we're in a CommonJS environment:

With these two helpers:

lottie-umd-setup.js:

window.module = {exports: {}};

lottie-import.js:

import './lottie-umd-setup.js';
import 'lottie-web';

const lottieModule = window.module.exports;
delete window.module;
export default lottieModule;

We can now import lottie:

import lottie from './lottie-import.js'

lottie.loadAnimation(...);

This only works because lottie-web has no dependencies itself. If it ever added any, if would break the trick.

(it would be nicer to have named imports, but we'd have to manually re-export everything in lottie.js)

vlaraort commented 3 years ago

Totally agree on this. There is a plan to export it as a module in the roadmap?