How to setup the dev environment

The following steps help you to set up the developing environment for ECharts.

Prerequisites

The advised node version is >=14.0.

If you have any question about the dev environment, please send an email to dev@echarts.apache.org.

1. Clone the ECharts project

If you wish to make pull requests, you should fork the ECharts project first. Otherwise, just clone it locally.

git clone git@github.com:apache/echarts.git

We assume echarts is downloaded at ~/workspace/echarts in the following steps. Its location can be arbitrary.

2. Install dependencies

cd ~/workspace/echarts
npm install

If the installed zrender version doesn't match the latest code of echarts. Please try using zrender-nightly instead.

npm install zrender@npm:zrender-nightly

3. Run and debug

To build the ECharts project and watch source file changes (including ZRender project) to rebuild:

cd ~/workspace/echarts
npm run dev

To check TypeScript

npm run checktype

To build:

npm run release

Then, open the test cases under ~/workspace/echarts/test in the Web browser. You can add breakpoints under src directory. For example, in Chrome Inspect, it looks like:

Next Steps

Please checkout How to make a pull request.

Developing the underlying zrender.

Sometimes, in order to fix an issue within echarts, changes have to be made inside the codebase of zrender. So we need to link zrender to echarts/node_modules/zrender instead of building zrender from npm.

cd ~/workspace
git clone git@github.com:ecomfe/zrender.git # Or your forked zrender repo
cd ~/workspace/echarts
rm node_modules/zrender 
ln -s ~/workspace/zrender node_modules/zrender

You should replace the above path with the path in your environment. Use an absolute path of zrender for the ln instruction.

After that, running ls node_modules/zrender to test if the content of the directory can be printed. If not, you probably have made a mistake with the link.

Using npm link cannot watch the changes in zrender. So please follow the above instructions.

Now, running node build/build.js watches changes both in echarts and zrender source directory.