https://github.com/gapitio/htmlgraphics-html-bundler-template
https://github.com/gapitio/htmlgraphics-html-bundler-template
Last synced: 2 months ago
JSON representation
- Host: GitHub
- URL: https://github.com/gapitio/htmlgraphics-html-bundler-template
- Owner: gapitio
- Created: 2021-09-22T09:42:55.000Z (almost 5 years ago)
- Default Branch: main
- Last Pushed: 2023-11-02T13:14:50.000Z (over 2 years ago)
- Last Synced: 2023-11-02T14:30:04.279Z (over 2 years ago)
- Language: JavaScript
- Size: 967 KB
- Stars: 1
- Watchers: 0
- Forks: 0
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Bundler
Bundler to make developing code easier and scalable.
## Table of contents
- [Bundler](#bundler)
- [Table of contents](#table-of-contents)
- [Contains](#contains)
- [Usage](#usage)
- [Dev site](#dev-site)
- [Eslint](#eslint)
## Contains
- [rollup.js](https://rollupjs.org/)
- [Prettier](https://prettier.io/)
- [TypeScript](https://www.typescriptlang.org/)
- [ESLint](https://eslint.org/)
- Local development server to run the code live in the browser.
## Usage
First you have to install the required dependencies
```bash
npm install
```
Then you start the development script
```bash
npm run dev
```
Go to . Change some code in `./src/onInit.ts`, `./src/onRender.ts`, or `./src/design/html.html`, and the website will update.
When the code is ready to be uploaded to Grafana, start the build script
```bash
npm run build
```
Then go to `/dist` and copy the content of `panel-options.json` to the panels `Import/export` option.
## Dev site
`src/devSite` is a folder where most of the configuration for the dev website is.
To add custom series go to `src/devSite/data.ts` and add createSeries() in series.
Window has been used to get global variables like data, customProperties, ETC.
## Eslint
It's recommended to use the current eslint config, but as it's strongly opinionated it might be _easier_ to use a less opinionated config.
Replace the current .eslint.cjs with the below code.
```ts
module.exports = {
env: {
node: true,
browser: true,
},
extends: [
"eslint:recommended",
"plugin:@typescript-eslint/recommended",
"prettier",
],
parser: "@typescript-eslint/parser",
plugins: ["@typescript-eslint"],
root: true,
};
```