Please help new user -- errors with LitElement example

17 views
Skip to first unread message

David Arsenault

unread,
Mar 16, 2020, 9:57:48 PM3/16/20
to Polymer
Hello Polymer Community:

New user here having a bit of trouble with lit-element with TS, and not sure why.

I have TS setup and working fine (compiled other TS examples).

Did npm install lit-element per Getting Started page.


Trying the TS example under the section: "Use LitElement TypeScript decorators" and getting all kinds of bad happening.

tsc my-element.ts results in complete fail:

my-element.ts:14:14 - error TS1219: Experimental support for decorators is a feature that is subject to change in a future release. Set the 'experimentalDecorators' option in your 'tsconfig' or 'jsconfig' to remove this warning.


14 export class MyElement extends LitElement {

                ~~~~~~~~~


my-element.ts:20:3 - error TS1219: Experimental support for decorators is a feature that is subject to change in a future release. Set the 'experimentalDecorators' option in your 'tsconfig' or 'jsconfig' to remove this warning.


20   foo = 'foo';

     ~~~


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


102 export declare type PropertyValues = Map<PropertyKey, unknown>;

                                         ~~~


node_modules/lit-html/lib/parts.d.ts:18:63 - error TS2304: Cannot find name 'Iterable'.


18 export declare const isIterable: (value: unknown) => value is Iterable<unknown>;

                                                                 ~~~~~~~~


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


16 export declare const parts: WeakMap<Node, NodePart>;

                               ~~~~~~~


node_modules/lit-html/lib/template-factory.d.ts:56:28 - error TS2583: Cannot find name 'WeakMap'. Do you need to change your target library? Try changing the `lib` compiler option to es2015 or later.


56     readonly stringsArray: WeakMap<TemplateStringsArray, Template>;

                              ~~~~~~~


node_modules/lit-html/lib/template-factory.d.ts:57:25 - error TS2583: Cannot find name 'Map'. Do you need to change your target library? Try changing the `lib` compiler option to es2015 or later.


57     readonly keyString: Map<string, Template>;

                           ~~~


node_modules/lit-html/lib/template-factory.d.ts:59:38 - error TS2583: Cannot find name 'Map'. Do you need to change your target library? Try changing the `lib` compiler option to es2015 or later.


59 export declare const templateCaches: Map<string, templateCache>;

                                        ~~~



Found 8 errors.


I have no idea how to press forward and really want to work with web components and TS for a new project.

My tsconfig.json is:

{
"compilerOptions": {
"target": "es6",
"module": "es6"
}
}

I have also tried with no tsconfig file. Same results.

Please kind people help point me in the right direction.
Thank you.
David

Reply all
Reply to author
Forward
0 new messages