https://github.com/gapitio/htmlgraphics-sheetjs-example
https://github.com/gapitio/htmlgraphics-sheetjs-example
Last synced: 11 months ago
JSON representation
- Host: GitHub
- URL: https://github.com/gapitio/htmlgraphics-sheetjs-example
- Owner: gapitio
- Created: 2022-08-04T11:38:11.000Z (almost 4 years ago)
- Default Branch: main
- Last Pushed: 2022-08-04T11:54:02.000Z (almost 4 years ago)
- Last Synced: 2025-03-08T11:59:57.935Z (over 1 year ago)
- Language: TypeScript
- Size: 292 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
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,
};
```