Some changes to configuration and example element

This commit is contained in:
Justin Fagnani
2019-12-12 14:33:23 -08:00
parent 387a753d1f
commit 3f1e3a1d2d
10 changed files with 902 additions and 813 deletions

View File

@@ -1,48 +1,43 @@
# LitElement TypeScript starter
This directory includes a sample component project using LitElement with TypeScript
This sample uses the TypeScript compiler (tsc) to produce JavaScript that runs in modern browsers.
This sample uses [ES dev server](https://github.com/open-wc/open-wc/tree/master/packages/es-dev-server)
for previewing the project without a build step. ES dev server handles resolving Node-style
import specifiers, which aren't supported in browsers. It also automatically transpiles code
and adds polyfills to support older browsers.
This project includes a sample component using LitElement with TypeScript.
## Setup
Install dependencies:
```bash
npm -i
npm i
```
## Build
To build JavaScript version of your component:
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 window:
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.
## Preview
## Dev Server
Run the dev server and open the project in a new browser tab:
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 start
npm run serve
```
## More information
See [Get started](https://lit-element.polymer-project.org/guide/start) on the LitElement site for
more information.
See [Get started](https://lit-element.polymer-project.org/guide/start) on the LitElement site for more information.