docs: update readme

This commit is contained in:
Krist Wongsuphasawat 2019-09-19 00:14:47 -07:00 committed by Yongjie Zhao
parent 39be9ad6f0
commit 168a88acf6
2 changed files with 13 additions and 93 deletions

View File

@ -54,90 +54,13 @@ yarn install
yarn build yarn build
``` ```
### Activating plugins for local development
1. Enable `npm link` for the package.
```sh
cd superset-ui
cd packages/superset-ui-chart
npm link
```
2. Link the local package to `incubator-superset`.
```sh
cd incubator-superset
cd superset/assets
npm link @superset-ui/chart \# use package name in package.json, not directory name
```
3) After npm link complete, update the import statements in Superset.
Instead of
```js
import { xxx } from '@superset-ui/plugin-chart-horizon';
```
which will point to the transpiled code.
do refer to `src`
```js
import { xxx } from '@superset-ui/plugin-chart-horizon/src'
```
4. After that you can run `dev-server` as usual.
```sh
npm run dev-server
```
Now when you change the code in `@superset-ui`, it will update the app immediately similar to code inside `incubator-superset`.
### Deactivating plugins for local development
1. Change the `import` statements back.
2. Unlink the package from `incubator-superset`.
```cd incubator-superset
cd superset/assets
npm unlink @superset-ui/chart
```
Note: Quite often, `npm link` mess up your `node_modules` and the `unlink` command above does not work correctly, making webpack build fails or other unexpected behaviors. If that happens, just delete your `node_modules` and `npm install` from scratch.
3. Clean up global link.
```sh
cd superset-ui
cd packages/superset-ui-chart
npm unlink
```
### Builds, linting, and testing ### Builds, linting, and testing
Each package defines its own build config, linting, and testing. You can have lerna run commands Each package defines its own build config, linting, and testing. You can have lerna run commands
across all packages using the syntax `yarn run test` (or `yarn run test:watch` for watch mode) from the root `@superset-ui` directory. across all packages using the syntax `yarn run test` (or `yarn run test:watch` for watch mode) from the root `@superset-ui-plugins-deckgl` directory.
#### Storybook * [Using Storybook](https://github.com/apache-superset/superset-ui/blob/master/docs/storybook.md) - You can test your components independently from Superset app.
* [Debugging Superset plugins in Superset app](https://github.com/apache-superset/superset-ui/blob/master/docs/debugging.md) - Sometimes something went wrong and you have to do it.
You can demo your changes by running the storybook demo locally with the following commands:
```sh
yarn install
yarn build
cd packages/superset-ui-plugins-deckgl-demo
yarn storybook:run
```
Alternatively, you can demo your changes by using the following command while in `packages/superset-ui-plugins-deckgl-demo`:
```sh
yarn storybook
```
### Committing ### Committing

View File

@ -3,36 +3,33 @@
[![Version](https://img.shields.io/npm/v/@superset-ui/legacy-preset-chart-nvd3.svg?style=flat-square)](https://img.shields.io/npm/v/@superset-ui/legacy-preset-chart-nvd3.svg?style=flat-square) [![Version](https://img.shields.io/npm/v/@superset-ui/legacy-preset-chart-nvd3.svg?style=flat-square)](https://img.shields.io/npm/v/@superset-ui/legacy-preset-chart-nvd3.svg?style=flat-square)
[![David (path)](https://img.shields.io/david/apache-superset/superset-ui-plugins.svg?path=packages%2Fsuperset-ui-legacy-preset-chart-nvd3&style=flat-square)](https://david-dm.org/apache-superset/superset-ui-plugins?path=packages/superset-ui-legacy-preset-chart-nvd3) [![David (path)](https://img.shields.io/david/apache-superset/superset-ui-plugins.svg?path=packages%2Fsuperset-ui-legacy-preset-chart-nvd3&style=flat-square)](https://david-dm.org/apache-superset/superset-ui-plugins?path=packages/superset-ui-legacy-preset-chart-nvd3)
This plugin provides Big Number for Superset. This plugin provides `deck.gl` for Superset.
### Usage ### Usage
Import the preset and register. This will register all the chart plugins under nvd3. Import the preset and register. This will register all the chart plugins under `deck.gl`.
```js ```js
import { NVD3ChartPreset } from '@superset-ui/legacy-preset-chart-nvd3'; import { DeckGLChartPreset } from '@superset-ui/legacy-preset-chart-deckgl';
new NVD3ChartPreset().register(); new DeckGLChartPreset().register();
``` ```
or register charts one by one. Configure `key`, which can be any `string`, and register the plugin. This `key` will be used to lookup this chart throughout the app. or register charts one by one. Configure `key`, which can be any `string`, and register the plugin. This `key` will be used to lookup this chart throughout the app.
```js ```js
import { AreaChartPlugin, LineChartPlugin } from '@superset-ui/legacy-preset-chart-nvd3'; import { ArcChartPlugin } from '@superset-ui/legacy-preset-chart-deckgl';
new AreaChartPlugin() new ArcChartPlugin()
.configure({ key: 'area' }) .configure({ key: 'deck_arc' })
.register();
new LineChartPlugin()
.configure({ key: 'line' })
.register(); .register();
``` ```
Then use it via `SuperChart`. See [storybook](https://apache-superset.github.io/superset-ui-plugins/?selectedKind=plugin-chart-nvd3) for more details. Then use it via `SuperChart`. See [storybook](https://apache-superset.github.io/superset-ui-plugins-deckgl) for more details.
```js ```js
<SuperChart <SuperChart
chartType="line" chartType="deck_arc"
width={600} width={600}
height={600} height={600}
formData={...} formData={...}
@ -40,4 +37,4 @@ Then use it via `SuperChart`. See [storybook](https://apache-superset.github.io/
data: {...}, data: {...},
}} }}
/> />
``` ```