[ANGULAR] Getting console error after enable license version on calender

[stewart_wo]

Hi,

After we enabled the license version of bryntum calender we are getting following error in console..

ERROR Error: Uncaught (in promise): Error: The Bryntum Grid bundle was loaded multiple times by the application.

Common reasons you are getting this error includes:

• Imports point to different types of the bundle (e.g. *.module.js and *.umd.js)
• Imports point to both sources and bundle
• Imports do not use the shortest relative path, JS treats them as different files
• Cache busters differ between imports, JS treats grid.module.js?1 and grid.module.js?2 as different files
• Imports missing file type, verify they all end in .js

See https://bryntum.com/products/grid/docs/guide/Grid/gettingstarted/es6bundle#troubleshooting for more information

Error: The Bryntum Grid bundle was loaded multiple times by the application.

Common reasons you are getting this error includes:

• Imports point to different types of the bundle (e.g. *.module.js and *.umd.js)
• Imports point to both sources and bundle
• Imports do not use the shortest relative path, JS treats them as different files
• Cache busters differ between imports, JS treats grid.module.js?1 and grid.module.js?2 as different files
• Imports missing file type, verify they all end in .js

See https://bryntum.com/products/grid/docs/guide/Grid/gettingstarted/es6bundle#troubleshooting for more information

kindly suggest the fix for this.

console_error.png (129.93 KiB) Viewed 313 times

Thanks

[marcio]

Hey stewart_wo,

Thanks for reaching out and welcome to our forums!

How are you importing the Calendar object into your application? Could you please provide how the imports of your project look like?

Also, please take a look on our guideline to have more info on how to ask for help https://www.bryntum.com/forum/viewtopic.php?f=1&t=772.

[stewart_wo]

Hi marcio,

We are using both the bryntum calendar and bryntum taskboard in our application.

the imports of bryntum calendar looks like

import {
  Calendar,
  CalendarConfig,
  EventStore,
  StringHelper,
} from '@bryntum/calendar';

and for the taskboard we are using the imports like

import {
  BryntumTaskBoardComponent,
  BryntumProjectModelComponent,
} from '@bryntum/taskboard-angular';
import { TaskBoard } from '@bryntum/taskboard';

These things was working fine in trial version but once we upgraded the license package this error coming through now.

Let me know if you need any other information on this.

Thanks

[marcio]

Hey,

I see, thanks for clarifying.

When using multiple products, you need to use thin packages. Please refer to this documentation https://bryntum.com/products/calendar/docs/guide/Calendar/integration/javascript/multiple-products.

And if you need any assistance, please let us know.

[stewart_wo]

Hi,

So if we need both the calender and taskboard product we need to include following packages

{
  "dependencies": {
    "@bryntum/calendar-thin": "6.0.5",
    "@bryntum/core-thin": "6.0.5",
    "@bryntum/engine-thin": "6.0.5",
    "@bryntum/grid-thin": "6.0.5",
    "@bryntum/scheduler-thin": "6.0.5",
    "@bryntum/taskboard-thin": "6.0.5"
  }
}

please confirm.

Thanks

[marcio]

Hey,

It'll depend on what components you're importing, which you can see on the documentation in the Source path section. As an example of the Calendar widget, you'll import it from calendar.thin file.

[stewart_wo]

Hi,

we are getting error in this import

import {
  Calendar,
  CalendarConfig,
  StringHelper,
} from '@bryntum/calendar-thin';

Module '"@bryntum/calendar-thin"' has no exported member 'StringHelper', while this is working

import {
  Calendar,
  CalendarConfig,
  StringHelper,
} from '@bryntum/calendar';

Please suggest

[stewart_wo]

Hi,

How does we use the

@bryntum/calendar-angular

with

@bryntum/calendar-thin

import { BryntumCalendarComponent } from '@bryntum/calendar-angular';
import {
  Calendar,
  CalendarConfig,
} from '@bryntum/calendar-thin';

we getting below errors in build

 Type 'import("../node_modules/@bryntum/calendar-thin/calendar").CalendarListeners' is not assignable to type 'import("../node_modules/@bryntum/calendar/calendar").CalendarListeners'.

  Type 'import("../node_modules/@bryntum/calendar/calendar").Calendar' is not assignable to type 'import("../node_modules/@bryntum/calendar-thin/calendar").Calendar'.

please suggest.

[marcio]

Hey stewart_wo,

You can see on this guide https://bryntum.com/products/calendar/docs/guide/Calendar/integration/angular/multiple-products#thin-packages-list.

So, instead of

@bryntum/calendar-angular

You'll use

@bryntum/calendar-angular-thin

.

[stewart_wo]

Hi Marico,

Is the bryntum thin packages are not stable to use in application. We have purchased the calender product license and we struggling to install and use this product in our application. if you see the the thread above we are getting different errors on different stages. this is very bad experience that on live version of your package we are getting such library related bugs.

after your suggestion in previous reply we change

@bryntum/calendar-angular

to

@bryntum/calendar-angular-thin

but now we are facing another issue while npm install for these packages. see the error we are getting after updating calender-anular-thin package.

npm ERR! code E404
npm ERR! 404 Not Found - GET https://registry.npmjs.org/@bryntum%2fcalendar-angular-thin - Not found
npm ERR! 404
npm ERR! 404 '@bryntum/calendar-angular-thin@6.0.6' is not in this registry.
npm ERR! 404
npm ERR! 404 Note that you can also install from a
npm ERR! 404 tarball, folder, http url, or git url.