-
-
Notifications
You must be signed in to change notification settings - Fork 1.2k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Add named exports for individual players #421
Comments
@seaneking This is an interesting suggestion, but I'm trying to see why would someone do import { Vimeo } from 'react-player' and include the whole library into their bundle, when they can already import a single player: import Vimeo from 'react-player/lib/players/Vimeo' which includes only the code for that player. |
Because (using any modern bundler) that doesn't import the whole library, just the module you've specified. Same thing as importing the file directly, just a nicer syntax that takes advantage of modules and tree shaking. A lot of libraries use this pattern. |
The issue is that Is tree-shaking good enough these days to not import all the players when doing it like this? |
Yep AFAIK, because you're only importing that named module (and its direct/used deps). Could include your whole library into one file, consuming just one function should tree shake the rest out. Rollup (and pretty sure Webpack 2+) can tree shake out unused functions and consts from within a module, so wouldn't have any probs here. |
That said it's hardly a big deal either way, just some light syntax sugar, so 🤷♂️ |
Yeah I like the idea, and it's easy enough to add. I think I've just been doing something wrong when experimenting with tree-shaking.. |
@seaneking Would this still work considering the source code would get compiled into something like: var _YouTube = require('./players/YouTube');
Object.defineProperty(exports, 'YouTube', {
enumerable: true,
get: function get() {
return _interopRequireDefault(_YouTube)['default'];
}
});
var _SoundCloud = require('./players/SoundCloud');
Object.defineProperty(exports, 'SoundCloud', {
enumerable: true,
get: function get() {
return _interopRequireDefault(_SoundCloud)['default'];
}
}); as opposed to |
Minor thing, but it'd be nice to add named exports for each individual player to the main entrypoint, so you could consume them through ES6 destructuring rather than explicitly importing the source file
Would be an easy and non-breaking change to add, along the lines of tacking this onto
ReactPlayer.js
The text was updated successfully, but these errors were encountered: