Node.js 未捕获[TypeError:无法使用fabric js canvas.loadFromJSON读取null的属性'；clearRect']

我正在使用fabric js，希望用于mp4代

我按照这里的建议做：定制结构并尝试以JSON字符串加载完整的结构js画布

这是我的小提琴链接：

上面的链接适用于前端（角度）

问题是，同样的事情是在node.js中使用editly给出错误

async function func({ width=800, height=800, fabric }) {
  async function onRender(progress, canvas) {
    // var canvas = new fabric.Canvas('c');

    var json = '{"version":"4.2.0","objects":[{"type":"image","version":"4.2.0","originX":"left","originY":"top","left":372.5,"top":329,"width":195,"height":130,"fill":"rgb(0,0,0)","stroke":null,"strokeWidth":0,"strokeDashArray":null,"strokeLineCap":"butt","strokeDashOffset":0,"strokeLineJoin":"miter","strokeMiterLimit":4,"scaleX":1,"scaleY":1,"angle":0,"flipX":false,"flipY":false,"opacity":1,"shadow":null,"visible":true,"backgroundColor":"","fillRule":"nonzero","paintFirst":"fill","globalCompositeOperation":"source-over","skewX":0,"skewY":0,"cropX":0,"cropY":0,"src":"https://images.pexels.com/photos/3975634/pexels-photo-3975634.jpeg?auto=compress&cs=tinysrgb&h=130","crossOrigin":null,"filters":[],"id":590718},{"type":"textbox","version":"4.2.0","originX":"left","originY":"top","left":10,"top":678,"width":920,"height":35.41,"fill":"#ffffff","stroke":"","strokeWidth":1,"strokeDashArray":null,"strokeLineCap":"butt","strokeDashOffset":0,"strokeLineJoin":"miter","strokeMiterLimit":4,"scaleX":1,"scaleY":1,"angle":0,"flipX":false,"flipY":false,"opacity":1,"shadow":null,"visible":true,"backgroundColor":"","fillRule":"nonzero","paintFirst":"fill","globalCompositeOperation":"source-over","skewX":0,"skewY":0,"text":"7. Unproductive screen time22","fontSize":31.333333333333332,"fontWeight":"normal","fontFamily":"Arial","fontStyle":"normal","lineHeight":1.16,"underline":false,"overline":false,"linethrough":false,"textAlign":"left","textBackgroundColor":"rgba(0, 0, 0, 0.5)","charSpacing":0,"minWidth":20,"splitByGrapheme":false,"styles":{},"id":402722}]}';

    canvas.loadFromJSON(json, canvas.renderAll.bind(canvas), function(o, object) {
        fabric.log(o, object);
    });
    // canvas.add(text);
  }

  function onClose() {
    // Cleanup if you initialized anything
  }

  return { onRender, onClose };
}

editly({
    // fast: true,
    outPath: './customFabric.mp4',
    // outPath: './customFabric.mp4',
    clips: [
      { duration: 2, layers: [{ type: 'fabric', func }] },
    ],
  }).catch(console.error);

错误是：

Error: Uncaught [TypeError: Cannot read property 'clearRect' of null]
    at reportException (/Users/**/Documents/development/learning/**/backend/node_modules/jsdom/lib/jsdom/living/helpers/runtime-script-errors.js:62:24)
    at innerInvokeEventListeners (/Users/**/Documents/development/learning/**/backend/node_modules/jsdom/lib/jsdom/living/events/EventTarget-impl.js:332:9)
    at invokeEventListeners (/Users/**/Documents/development/learning/**/backend/node_modules/jsdom/lib/jsdom/living/events/EventTarget-impl.js:267:3)
    at HTMLImageElementImpl._dispatch (/Users/**/Documents/development/learning/**/backend/node_modules/jsdom/lib/jsdom/living/events/EventTarget-impl.js:214:9)
    at fireAnEvent (/Users/**/Documents/development/learning/**/backend/node_modules/jsdom/lib/jsdom/living/helpers/events.js:17:36)
    at Promise.resolve.then (/Users/**/Documents/development/learning/**/backend/node_modules/jsdom/lib/jsdom/browser/resources/per-document-resource-loader.js:57:13)
    at process._tickCallback (internal/process/next_tick.js:68:7) TypeError: Cannot read property 'clearRect' of null
    at klass.clearContext (/Users/**/Documents/development/learning/**/backend/node_modules/fabric/dist/fabric.js:8903:11)
    at klass.clear (/Users/**/Documents/development/learning/**/backend/node_modules/fabric/dist/fabric.js:8931:12)
    at /Users/**/Documents/development/learning/**/backend/node_modules/fabric/dist/fabric.js:13449:13
    at /Users/**/Documents/development/learning/**/backend/node_modules/fabric/dist/fabric.js:13569:19
    at onLoaded (/Users/**/Documents/development/learning/**/backend/node_modules/fabric/dist/fabric.js:1019:23)
    at /Users/**/Documents/development/learning/**/backend/node_modules/fabric/dist/fabric.js:1041:11
    at /Users/**/Documents/development/learning/**/backend/node_modules/fabric/dist/fabric.js:20852:13
    at onLoaded (/Users/**/Documents/development/learning/**/backend/node_modules/fabric/dist/fabric.js:1019:23)
    at /Users/**/Documents/development/learning/**/backend/node_modules/fabric/dist/fabric.js:1034:11
    at Array.forEach (<anonymous>)
    at Object.enlivenObjects (/Users/**/Documents/development/learning/**/backend/node_modules/fabric/dist/fabric.js:1031:15)
    at /Users/**/Documents/development/learning/**/backend/node_modules/fabric/dist/fabric.js:20849:23
    at /Users/**/Documents/development/learning/**/backend/node_modules/fabric/dist/fabric.js:20731:23
    at onLoaded (/Users/**/Documents/development/learning/**/backend/node_modules/fabric/dist/fabric.js:1019:23)
    at /Users/**/Documents/development/learning/**/backend/node_modules/fabric/dist/fabric.js:1034:11
    at Array.forEach (<anonymous>)
Any help is highly appreciated!

错误：未捕获[TypeError:无法读取null的属性'clearRect]
在reportException（/Users/**/Documents/development/learning/**/backend/node_modules/jsdom/lib/jsdom/living/helpers/runtime script errors.js:62:24）
在innerInvokeEventListeners（/Users/**/Documents/development/learning/**/backend/node_modules/jsdom/lib/jsdom/living/events/EventTarget impl.js:332:9）
在invokeEventListeners（/Users/**/Documents/development/learning/**/backend/node_modules/jsdom/lib/jsdom/living/events/EventTarget impl.js:267:3）
在HTMLImageElementImpl._调度（/Users/**/Documents/development/learning/**/backend/node_modules/jsdom/lib/jsdom/living/events/EventTarget impl.js:214:9）
在fireAnEvent（/Users/**/Documents/development/learning/**/backend/node_modules/jsdom/lib/jsdom/living/helpers/events.js:17:36）
在Promise.resolve.then（/Users/**/Documents/development/learning/**/backend/node_modules/jsdom/lib/jsdom/browser/resources/per-document-resource-loader.js:57:13）
在进程中。_tickCallback（internal/process/next_tick.js:68:7）TypeError:无法读取null的属性'clearRect'
在klass.clearContext（/Users/**/Documents/development/learning/**/backend/node_modules/fabric/dist/fabric.js:8903:11）
在klass.clear（/Users/**/Documents/development/learning/**/backend/node_modules/fabric/dist/fabric.js:8931:12）
at/Users/**/Documents/development/learning/**/backend/node_modules/fabric/dist/fabric.js:13449:13
at/Users/**/Documents/development/learning/**/backend/node_modules/fabric/dist/fabric.js:13569:19
加载时（/Users/**/Documents/development/learning/**/backend/node_modules/fabric/dist/fabric.js:1019:23）
at/Users/**/Documents/development/learning/**/backend/node_modules/fabric/dist/fabric.js:1041:11
at/Users/**/Documents/development/learning/**/backend/node_modules/fabric/dist/fabric.js:20852:13
加载时（/Users/**/Documents/development/learning/**/backend/node_modules/fabric/dist/fabric.js:1019:23）
at/Users/**/Documents/development/learning/**/backend/node_modules/fabric/dist/fabric.js:1034:11
在Array.forEach（）处
在Object.enlivenObjects（/Users/**/Documents/development/learning/**/backend/node_modules/fabric/dist/fabric.js:1031:15）
at/Users/**/Documents/development/learning/**/backend/node_modules/fabric/dist/fabric.js:20849:23
at/Users/**/Documents/development/learning/**/backend/node_modules/fabric/dist/fabric.js:20731:23
加载时（/Users/**/Documents/development/learning/**/backend/node_modules/fabric/dist/fabric.js:1019:23）
at/Users/**/Documents/development/learning/**/backend/node_modules/fabric/dist/fabric.js:1034:11
在Array.forEach（）处
非常感谢您的帮助！