konvajs / konva

Konva.js is an HTML5 Canvas JavaScript framework that extends the 2d context by enabling canvas interactivity for desktop and mobile applications.
http://konvajs.org/
Other
11.07k stars 896 forks source link

Warning regarding CommonJS or AMD dependencies can cause optimization bailouts #1778

Closed pixobe closed 4 weeks ago

pixobe commented 4 weeks ago

Dear Team, I am trying to using konva in Angular project, am getting the following error. However app works fine am able to render the components and also I do not noticed any optimization issues as such, however this warning is little concerning.

▲ [WARNING] Module 'konva' used by 'src/app/app.component.ts' is not ESM

  CommonJS or AMD dependencies can cause optimization bailouts.
  For more information see: https://angular.dev/tools/cli/build#configuring-commonjs-dependencies

This is how am importing ,

import Konva from 'konva';

Usage in app,

const stage = new Konva.Stage({
      container: 'container',
      width: window.innerWidth,
      height: window.innerHeight,
    });

Any idea if am importing it wrongly or trying not to do recommended way?

Thank you in advance.

lavrton commented 4 weeks ago

Just mark konva as ok to be loaded via cmj, something like this (see linked angular docs):

"build": {
  "builder": "@angular-devkit/build-angular:browser",
  "options": {
     "allowedCommonJsDependencies": [
        "konva"
     ]
     …
   }
   …
},