zrender
zrender copied to clipboard
Displayable is not exported and causes incompatible type annotation
The type Displayable is not listed in export and would cause some trouble when I want to annotate the callback of group.eachChild
import * as zrender from 'zrender'
// zrender has no exported member 'Displayable', therefore it has to be imported from the src
import Displayable from 'zrender/src/graphic/Displayable'
function test(g: zrender.Group) {
g.eachChild(function (el: Displayable) {})
}
The above code gives an error Type 'Element<ElementProps>' is missing the following properties from type 'Displayable<DisplayableProps>': invisible, z, z2, zlevel, and 33 more
I can fix this with two methods:
- import Group from
zrender/src/graphic/Group
and use Group to annotate g - tweak the export, list Displayable there, and use zrender.Displayable to annotate the callback arg.
I also noticed that for type Group from lib and Group from src, they differ in the declaration for _children as the compiler says Types have separate declarations of a private property '_children'
if I try to assign one to another.
Based on the above description, I have two questions:
- Why the import from src can not be mixed with import from lib? The types in declaration files are generated from the src, so should they be consistent and interchangeable?
- What is the conventional/recommended way of importing stuff, from src or from lib? I noticed in echarts, when using zrender, everything is imported directly from zrender/src. But what if the structure of zrender is changed and the import path is not valid anymore? Then one has to change the client code accordingly. However if imported from lib, then the client code won't be bothered by zrender's own structure adaption. So I guess importing from lib is preferred?
Any guidance is highly appreciated. Thanks.
Typescript: 4.4.2 zrender: 5.2.0