lit / lit.dev

The Lit website
https://lit.dev
BSD 3-Clause "New" or "Revised" License
111 stars 166 forks source link

Component example code does not compile #1344

Open blackhypothesis opened 6 days ago

blackhypothesis commented 6 days ago

Fedora release 40 (Forty)

$ uname -a Linux perseus.luma 6.9.4-200.fc40.x86_64 #1 SMP PREEMPT_DYNAMIC Wed Jun 12 13:33:34 UTC 2024 x86_64 GNU/Linux

$ tsc --version Version 5.5.2 $ npm --version 10.5.0

$ npm install lit

added 6 packages in 716ms

first-componet.ts is the sourcecode from https://lit.dev/docs/components/overview/

$ tsc first-component.ts

first-component.ts:13:4 - error TS1240: Unable to resolve signature of property decorator when called as an expression. No overload matches this call. Overload 1 of 3, '(target: ClassAccessorDecoratorTarget<SimpleGreeting, string>, context: ClassAccessorDecoratorContext<SimpleGreeting, string>): ClassAccessorDecoratorResult<...>', gave the following error. Argument of type 'ClassFieldDecoratorContext<SimpleGreeting, string> & { name: "name"; private: false; static: false; }' is not assignable to parameter of type 'ClassAccessorDecoratorContext<SimpleGreeting, string>'. Types of property 'kind' are incompatible. Type '"field"' is not assignable to type '"accessor"'. Overload 2 of 3, '(target: (value: string) => void, context: ClassSetterDecoratorContext<SimpleGreeting, string>): (this: SimpleGreeting, value: string) => void', gave the following error. Argument of type 'ClassFieldDecoratorContext<SimpleGreeting, string> & { name: "name"; private: false; static: false; }' is not assignable to parameter of type 'ClassSetterDecoratorContext<SimpleGreeting, string>'. Types of property 'kind' are incompatible. Type '"field"' is not assignable to type '"setter"'. Overload 3 of 3, '(protoOrDescriptor: Object, name: PropertyKey, descriptor?: PropertyDescriptor): any', gave the following error. Argument of type 'ClassFieldDecoratorContext<SimpleGreeting, string> & { name: "name"; private: false; static: false; }' is not assignable to parameter of type 'PropertyKey'.

13 @property()


first-component.ts:13:4 - error TS1270: Decorator function return type 'ClassAccessorDecoratorResult<SimpleGreeting, string>' is not assignable to type 'void | ((this: SimpleGreeting, value: string) => string)'.

13   @property()

node_modules/@lit/reactive-element/reactive-element.d.ts:128:31 - error TS2583: Cannot find name 'Map'. Do you need to change your target library? Try changing the 'lib' compiler option to 'es2015' or later.

128 type PropertyDeclarationMap = Map<PropertyKey, PropertyDeclaration>;


node_modules/@lit/reactive-element/reactive-element.d.ts:140:80 - error TS2583: Cannot find name 'Map'. Do you need to change your target library? Try changing the 'lib' compiler option to 'es2015' or later.

140 export type PropertyValues<T = any> = T extends object ? PropertyValueMap<T> : Map<PropertyKey, unknown>;

node_modules/@lit/reactive-element/reactive-element.d.ts:144:46 - error TS2583: Cannot find name 'Map'. Do you need to change your target library? Try changing the 'lib' compiler option to 'es2015' or later.

144 export interface PropertyValueMap extends Map<PropertyKey, unknown> {


node_modules/@lit/reactive-element/reactive-element.d.ts:170:30 - error TS2583: Cannot find name 'WeakMap'. Do you need to change your target library? Try changing the 'lib' compiler option to 'es2015' or later.

170     var litPropertyMetadata: WeakMap<object, Map<PropertyKey, PropertyDeclaration>>;

node_modules/@lit/reactive-element/reactive-element.d.ts:170:46 - error TS2583: Cannot find name 'Map'. Do you need to change your target library? Try changing the 'lib' compiler option to 'es2015' or later.

170 var litPropertyMetadata: WeakMap<object, Map<PropertyKey, PropertyDeclaration>>;


node_modules/@lit/reactive-element/reactive-element.d.ts:417:12 - error TS1166: A computed property name in a class property declaration must have a simple literal type or a 'unique symbol' type.

417     static [Symbol.metadata]: object & Record<PropertyKey, unknown>;

node_modules/@lit/reactive-element/reactive-element.d.ts:417:13 - error TS2585: 'Symbol' only refers to a type, but is being used as a value here. Do you need to change your target library? Try changing the 'lib' compiler option to es2015 or later.

417 static [Symbol.metadata]: object & Record<PropertyKey, unknown>;


node_modules/lit-html/lit-html.d.ts:359:32 - error TS2583: Cannot find name 'Set'. Do you need to change your target library? Try changing the 'lib' compiler option to 'es2015' or later.

359     _$disconnectableChildren?: Set<Disconnectable>;

node_modules/lit-html/lit-html.d.ts:546:47 - error TS2304: Cannot find name 'Iterable'.

546 _isIterable: (value: unknown) => value is Iterable;



Found 11 errors in 3 files.

Errors  Files
     2  first-component.ts:13
     7  node_modules/@lit/reactive-element/reactive-element.d.ts:128
     2  node_modules/lit-html/lit-html.d.ts:359
justinfagnani commented 3 days ago

What does your tsconfig look like?

These are the type of errors you would see if you don't have the proper libraries configured, or decorators.

See this error in your output above:

Try changing the 'lib' compiler option to 'es2015' or later

These pages on out docs may be helpful: