echarts Install themes from npm

ibps3vxo  于 2022-11-02  发布在  Echarts
关注(0)|答案(8)|浏览(155)

What problem does this feature solve?

I want to develop a node.js program to generate echarts image file. ( ssr-echarts )
There is a theme npm package in echarts4 ( echarts-themes-js ), but I can't find one for echarts5.
Some default themes are enough.

我想开发一个nodejs程序生成echarts图片( ssr-echarts )。
在echarts4,有一个echarts theme的npm包( echarts-themes-js ),但是echarts5找不到npm主题包。
只要默认主题就可以。

What does the proposed API look like?

https://www.npmjs.com/package/echarts-themes-js

i5desfxk

i5desfxk1#

Hi! We've received your issue and please be patient to get responded. 🎉
The average response time is expected to be within one day for weekdays.

In the meanwhile, please make sure thatyou have posted enough image to demo your request. You may also check out the API and chart option to get the answer.

If you don't get helped for a long time (over a week) or have an urgent question to ask, you may also send an email to dev@echarts.apache.org . Please attach the issue link if it's a technical question.

If you are interested in the project, you may also subscribe our mailing list .

Have a nice day! 🍵

dzjeubhm

dzjeubhm2#

@lz1998 It seems you are not using English, I've helped translate the content automatically. To make your issue understood by more people, we'd like to suggest using English next time. 🤗

TRANSLATED

BODY

What problem does this feature solve?

I want to develop a node.js program to generate echarts image file. ( ssr-echarts )
There is a theme npm package in echarts4 ( echarts-themes-js ), but I can't find one for echarts5.
Some default themes are enough.

I want to develop a nodejs program to generate echarts pictures ( ssr-echarts ).
In echarts4, there is an npm package of echarts theme ( echarts-themes-js ), but echarts5 cannot find the npm theme package.
As long as the default theme is fine.

What does the proposed API look like?

https://www.npmjs.com/package/echarts-themes-js

chy5wohz

chy5wohz3#

I have tries import theme from echarts/theme, but an error occured

/Users/lz1998/WebstormProjects/ssr-echarts/node_modules/echarts/lib/echarts.js:44
export * from './export/core';
^^^^^^

SyntaxError: Unexpected token 'export'
    at wrapSafe (internal/modules/cjs/loader.js:1054:16)
    at Module._compile (internal/modules/cjs/loader.js:1102:27)
    at Module._extensions..js (internal/modules/cjs/loader.js:1158:10)
    at Object.require.extensions.<computed> [as .js] (/Users/lz1998/WebstormProjects/ssr-echarts/node_modules/ts-node/src/index.ts:1045:43)
    at Module.load (internal/modules/cjs/loader.js:986:32)
    at Function.Module._load (internal/modules/cjs/loader.js:879:14)
    at Module.require (internal/modules/cjs/loader.js:1026:19)
    at require (internal/modules/cjs/helpers.js:72:18)
    at /Users/lz1998/WebstormProjects/ssr-echarts/node_modules/echarts/theme/macarons.js:29:26
    at Object.<anonymous> (/Users/lz1998/WebstormProjects/ssr-echarts/node_modules/echarts/theme/macarons.js:34:3)
fcipmucu

fcipmucu4#

I replace factory(exports, require('echarts/lib/echarts')); to factory(exports, require('echarts')); in node_modules/echarts/theme/*, then the problem is fixed。

bvuwiixz

bvuwiixz5#

I'm thinking it might be better to use echarts/lib/echarts if we need tree-shaking.

This issue reminds me of another issue to look into. The current UMD header seems to make tree-shaking invalid.

@pissang There are several questions about this

1) The current UMD header invalidates tree-shaking, which makes the bundled size larger.

This is bundled result with the current UMD header

the module dependency in AMD seems incorrect, it may be also echarts/lib/echarts .

Besides, it would be better to increase the priority of commonjs , just like what rolllup generates.

(function (global, factory) {
  typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('echarts/lib/echarts')) :
  typeof define === 'function' && define.amd ? define(['exports', 'echarts/lib/echarts'], factory) :
  (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory({}, global.echarts));
}(this, (function (exports, echarts) {
    // ...
})));

This is bundled result with the tweaked UMD header

2) For themes / bmap extension or other plugins, should we import echarts/lib/echarts or echarts/core ?

We can see echarts/lib/echarts is importing CanvasRenderer & DatasetComponent , but they are unnecessary if only SVG renderer is needed and no dataset is used. Especially theme files, they only need to import core library.

Perhaps, we should also make the theme or extension installable.

1cklez4t

1cklez4t6#

  1. The current UMD header invalidates tree-shaking, which makes the bundled size larger.

Because echarts/lib/echarts is not an AMD module. So I still use echarts in the AMD branch. Didn't know the bundler will still go into the AMD branch. This change is very neat and helpful.

Perhaps, we should also make the theme or extension installable.

Yes, it will be great. But we may need to provide separate ESM modules for themes that can be installed manually.

m3eecexj

m3eecexj7#

Because echarts/lib/echarts is not an AMD module.

Never notice it before. Thank you for pointing out.

w8biq8rn

w8biq8rn8#

Yes, it will be great. But we may need to provide separate ESM modules for themes that can be installed manually.

When will the themes modules be provided?

相关问题