Skip to content
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

Re-export lit-html directives from LitElement #1069

Closed
DanielKehoe opened this issue Aug 22, 2020 · 2 comments
Closed

Re-export lit-html directives from LitElement #1069

DanielKehoe opened this issue Aug 22, 2020 · 2 comments

Comments

@DanielKehoe
Copy link

To import all the modules I need for development, I’d like to be able to do this:

import { LitElement, html, until, unsafeHTML } from 'https://jspm.dev/lit-element';

instead of this:

import { LitElement, html } from 'https://jspm.dev/lit-element';
import { until } from 'https://jspm.dev/lit-html/directives/until.js';
import { unsafeHTML } from 'https://jspm.dev/lit-html/directives/unsafe-html.js';

Importing all the modules in one expression would eliminate the source of errors I encountered inadvertently loading multiple versions of lit-html.

Loading the directives from different sources allows the possibility of version clashes. Clashes could be avoided with import maps but until browsers support import maps, perhaps this improvement could eliminate potential clashes.

I was able to resolve issues I encountered with version clashes by improving my code but the suggested change would reduce the likelihood of error. Here is the issue I resolved:
Code displays in browser after lit-html is loaded twice

And here's a troubleshooting article I wrote to discuss the problems I encountered:
Troubleshooting Lit-Html: Code Displaying in the Browser

@justinfagnani
Copy link
Contributor

We very intentionally don't export the the directives from a single module, so that you only import what you use.

If we did this we would bloat bundle sizes and be reliant on "tree shaking" to reduce them again. Instead we take advantage of the browser's built-in tree shaking which is that it only loads the modules you import.

The solution to double loading is to either install the packages locally, where both your code and lit-element can share the same package installation on disk, or for CDNs to have smarter resolution logic so that a project can ensure that transitive dependents load the same versions of shared packages. Supporting Import Maps is probably the best way to do that.

@DanielKehoe
Copy link
Author

Very good. Thanks for explaining the design decision clearly. I'll close the issue.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants