search

lit / lit-element

LEGACY REPO. This repository is for maintenance of the legacy LitElement library. The LitElement base class is now part of the Lit library, which is developed in the lit monorepo.
https://lit-element.polymer-project.org
BSD 3-Clause "New" or "Revised" License
4.49k stars 319 forks source link

Unnecessary breaking change in Lit 2 when using TypeScript #1164

Closed Artur- closed 3 years ago

Artur- commented 3 years ago

Description

With LitElement 2.4 you can do

import { customElement, html, property, query } from 'lit-element';

With Lit 2, this results in an error

Module '"../node_modules/lit-element/lit-element"' has no exported member 'customElement'

Is it intentional that the decorators are not re-exported? Would ease migration if they were

bennypowers commented 3 years ago

The purpose of this change is so that vanilla users aren't taxed with extra decorators code in their bundles

fix:

import { html } from 'lit-element';
import { customElement, property, query } from 'lit-element/lib/decorators';
Artur- commented 3 years ago

How does not re-exporting them make the bundle smaller?

Isn't the point also that you should import from lit instead of lit-element and lit-element is mostly around for backwards compatibility?

web-padawan commented 3 years ago

The default entrypoint for lit does not export decorators either so there is lit/decorators.js

Artur- commented 3 years ago

That is completely fine as lit is for new users. This is only a question for migration

sorvell commented 3 years ago

The intention is that when you import 'lit-element', it is as backwards compatible as possible. We've changed some of the imports in the lit package only.

justinfagnani commented 3 years ago

https://github.com/Polymer/lit-html/pull/1649 fixes the problem here. We made lit-element backwards compatible with a new index.js file, but the typings still point to lit-element.js which doesn't export the decorators.

kevinpschaaf commented 3 years ago

Fixed in https://github.com/Polymer/lit-html/pull/1649.

nsanzimfura-eric commented 1 month ago

The purpose of this change is so that vanilla users aren't taxed with extra decorators code in their bundles

fix:

import { html } from 'lit-element';
import { customElement, property, query } from 'lit-element/lib/decorators';

Actually, this is the one works for Lit V3:

import { html } from 'lit-element';
import { customElement, property, query } from 'lit-element/decorators';

Note: there is no lib folder.