javascript - Konva 3.0.0 Minimal Bundle (tree shake) 非 TypeScript 项目

Question

在 Konvajs 2.5 中，我过去能够按照 Readme 中的指示通过定位特定的 src 文件来进行最少的导入。 。示例:

import Konva from 'konva/src/Core'
import 'konva/src/Layer'

在 v3.0.0 中，整个库被重写为 TypeScript。我的应用程序不是 TypeScript，而且可能很长一段时间内都不会。我如何利用 3.0 中的 treeshaking？我被困在旧版本了吗？由于我大量使用图案填充，因此我希望 3.0 的性能得到改进。

Answer 1

konva@3.1.2 支持最小捆绑:

import Konva from 'konva/lib/Core';
// now you have Konva object with Stage, Layer, FastLayer, Group, Shape and some additional utils function.
// Also core currently already have support for drag&drop and animations.
// BUT there are no shapes (rect, circle, etc), no filters.

// but you can simply add anything you need:
import { Rect } from 'konva/lib/shapes/Rect';
// importing a shape will automatically inject it into Konva object

var rect1 = new Rect();
// or:
var shape = new Konva.Rect();

// for filters you can use this:
import { Blur } from 'konva/lib/filters/Blur';