Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/e111077/vite-lit-element-ts-sass
Vite + Lit + TS + SASS = Super easy!
https://github.com/e111077/vite-lit-element-ts-sass
lit lit-element lit-elements lit-html sass typescript vite
Last synced: about 2 months ago
JSON representation
Vite + Lit + TS + SASS = Super easy!
- Host: GitHub
- URL: https://github.com/e111077/vite-lit-element-ts-sass
- Owner: e111077
- Created: 2021-05-03T07:42:38.000Z (over 3 years ago)
- Default Branch: master
- Last Pushed: 2023-04-19T22:45:53.000Z (over 1 year ago)
- Last Synced: 2024-10-05T07:41:10.673Z (2 months ago)
- Topics: lit, lit-element, lit-elements, lit-html, sass, typescript, vite
- Language: TypeScript
- Homepage:
- Size: 29.3 KB
- Stars: 73
- Watchers: 4
- Forks: 9
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
- awesome-lit - Vite Lit Element TS SASS - Example Vite project using Lit 2, Typescript, and SASS. (Starter Templates)
README
# Vite Lit TS Minified Templates
This is an example [Vite](https://vitejs.dev/) project using [Lit 2](https://lit.dev), Typescript, and Sass imports.
## Changes from Vite's TS Lit template
* `npm i -D sass`
* Moved styles from `src/my-element.ts` to `src/my-element.scss` and imported them with `import styles from './my-element.scss?inline';`
* Added typings for Sass files in [`typings/`](https://github.com/e111077/vite-lit-element-ts-sass/blob/master/typings/scss.d.ts)
* Updated `tsconfig.json` to include `typings/` directory
* Updated `vite.config.ts`
* Changed library build to follow [WC best practices](https://justinfagnani.com/2019/11/01/how-to-publish-web-components-to-npm/)
* Added a commented-out build for applications**N.B.** Since Vite does does not yet handle Lit HMR, Vite triggers a full reload for Lit files, but SASS files currently only trigger a hot module reload which will not update Lit without manually triggering a reload. Follow this [issue](https://github.com/vitejs/vite/issues/3243) for more details or wait until [Lit HMR](https://github.com/lit/lit-element/pull/802) is released.