54 lines
1.6 KiB
Markdown
54 lines
1.6 KiB
Markdown
# LitElement TypeScript starter
|
|
|
|
This project includes a sample component using LitElement with TypeScript.
|
|
|
|
## Setup
|
|
|
|
Install dependencies:
|
|
|
|
```bash
|
|
npm i
|
|
```
|
|
|
|
## Build
|
|
|
|
This sample uses the TypeScript compiler to produce JavaScript that runs in modern browsers, and [lit-analyzer](https://www.npmjs.com/package/lit-analyzer), a program that type-checks and lints lit-html templates.
|
|
|
|
To build the JavaScript version of your component:
|
|
|
|
```bash
|
|
npm run build
|
|
```
|
|
|
|
To watch files and rebuild when the files are modified, run the following command in a separate shell:
|
|
|
|
```bash
|
|
npm run build:watch
|
|
```
|
|
|
|
Both the TypeScript compiler and lit-analyzer are configured to be very strict. You may want to change `tsconfig.json` to make them less strict.
|
|
|
|
## Testing
|
|
|
|
This sample uses Karma, Chai, Mocha, and the open-wc test helpers for testing. See the [open-wc testing documentation](https://open-wc.org/testing/testing.html) for more information.
|
|
|
|
Tests can be run with the `test` script:
|
|
|
|
```bash
|
|
npm test
|
|
```
|
|
|
|
## Dev Server
|
|
|
|
This sample uses [ES dev server](https://github.com/open-wc/open-wc/tree/master/packages/es-dev-server) for previewing the project without additional build steps. ES dev server handles resolving Node-style "bare" import specifiers, which aren't supported in browsers. It also automatically transpiles JavaScript and adds polyfills to support older browsers.
|
|
|
|
To run the dev server and open the project in a new browser tab:
|
|
|
|
```bash
|
|
npm run serve
|
|
```
|
|
|
|
## More information
|
|
|
|
See [Get started](https://lit-element.polymer-project.org/guide/start) on the LitElement site for more information.
|