lit.dev

New site, new repo.

Packages

This is a Lerna monorepo.

lit-dev-content: Main content of lit.dev
lit-dev-server: Production web server for lit.dev
lit-dev-tools: Eleventy plugins and other internal tools

Developing

Install dependencies

npm i && npm run bootstrap

Build all

npm run build

Develop site content

npm run dev

Serves at http://localhost:8000 (port may be incremented if not available, see console output).

You may also prefer to run each dev script in its own terminal:

cd packages/lit-dev-content

npm run build:ts:watch       # TypeScript
npm run dev:build:site:watch # Eleventy
npm run dev:serve            # @web/dev-server

Dev mode is different to production in these ways:

Browser auto-reload.
CSS is not inlined or minified. CSS changes are reflected immediately.
JS is not inlined, bundled, bare-module transformed, or minified. JS changes are reflected immediately after tsc compile.
HTML is not minified.

If needed, you can check for dev mode from an Eleventy template using the env.DEV global:

{% if env.DEV %}
  <p>Dev mode</p>
{% else %}
  <p>Prod mode</p>
{% endif %}

Update generated API docs

First run npm run dev as shown above, and then in another terminal:

cd packages/lit-dev-api
npm run build:watch

You can now edit the comments in any .ts file in the lit directory, and after the automatic rebuild, the dev site will refresh.

code packages/lit-dev-api/lit/

The lit directory is a regular cloned git repo, so you can make changes directly here, and push PRs from it as normal. It's configured to track the main branch, but is pinned to a particular commit via the lit.sha file. To update the current commit, run:

cd packages/lit-dev-tools
npm run monorepo:update

Serve production mode

npm run build
npm start

Watch production mode

npm start # production server

cd packages/lit-dev-content
npm run build:ts:watch     # TypeScript
npm run build:rollup:watch # Rollup
npm run build:site:watch   # Eleventy

Serves at http://localhost:8080

Start production Docker environment locally

docker build -t litdev . --build-arg PLAYGROUND_SANDBOX=http://localhost:8081/
docker run --rm --name litdev -p 8080:8080 -e PORT=8080 -e MODE=main litdev
docker run --rm --name litdev-playground -p 8081:8081 -e PORT=8081 -e MODE=playground litdev

suyouwanggang/lit.dev