https://github.com/maxwroc/lovelace-card-boilerplate
Startup setup for new lovelace (Home Assistant) card development
https://github.com/maxwroc/lovelace-card-boilerplate
Last synced: about 1 year ago
JSON representation
Startup setup for new lovelace (Home Assistant) card development
- Host: GitHub
- URL: https://github.com/maxwroc/lovelace-card-boilerplate
- Owner: maxwroc
- License: mit
- Created: 2020-10-08T23:04:05.000Z (over 5 years ago)
- Default Branch: master
- Last Pushed: 2021-12-22T16:55:40.000Z (over 4 years ago)
- Last Synced: 2024-10-14T08:48:09.545Z (over 1 year ago)
- Language: TypeScript
- Size: 78.1 KB
- Stars: 6
- Watchers: 3
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# lovelace-card-boilerplate
Startup setup for new lovelace (Home Assistant) card development
## What is here?
* Card code written in TypeScript
* Bundling all the files to single output
* Map file generated, poiting to repo url (with version etc), this way debugging is possible without having source code locally
* CSS code minimized, converted to TS and included in output bundle
* Two bundle types: debug and crunched one
* Teststing with Electron headless browser
## How to use it?
1. Get the template code
* Click on the "Use this template" button at the top of this page. Your private repo will be created for you.
* Clone your repo to your box
OR
* Clone this repo to your box
`git clone https://github.com/maxwroc/lovelace-card-boilerplate.git your-card-name`
* Create empty repo on your git server and copy it's url
* Change the remote url
`git remote set-url origin [your target repo url]`
2. Change the card class name and the custom element name in index.ts, update package.json
3. Push the code and you are ready to go
`git push origin master`
4. Build
Run `npm install` once before first build.
* `npm run build` produces debug version of the code (just bundled but no crunched)
* `npm run release` produces crunched bundle
The output files are located in `dist` directory.
Note: The style.ts file is auto-generated
5. Testing
