Is it possible to import components on demand?

[jevin98]

Hi author.

I originally wanted to submit a pull request to support on-demand component imports (the scenario here is that components currently can only be used through Vue's global registration method). I thought supporting `import {Arc, Layer} from 'vue-konva`` imports would improve tree-shaking.

Currently, vue-konva uses `import {Arc, Layer} from 'vue-konva``, which seems to have very poor tree-shaking performance.

However, if I directly import a specific node file in vue-konva

import {Arc} from 'konva/lib/shapes/Arc.js
import {Arrow} from 'konva/lib/shapes/Arrow.js

Directly importing specific nodes seems to cause some issues. I haven't looked closely at the konva source code, but I noticed that the entry file performs some merging logic link. So this can't be done?

[jevin98]

@lavrton
hi.
If the konva nodes share underlying code, then tree-shaking the konva code might not be possible.
Then my PR might only provide functionality for vola and dynamically importing components.

[lavrton]

Default Konva will import all nodes. They are designed to be not tree-shakable for support of JSON import.
The solution is to make a "minimal" module is to NOT import full konva, but instead import only core.
That was done in react-konva, docs: https://github.com/konvajs/react-konva?tab=readme-ov-file#minimal-bundle