Our powerful JS Calendar component


Post by palmer2 »

We are importing both @bryntum/calendar and @bryntum/calendar-vue-3 NPM packages into our library of Vue components, where we create a wrapper component around the calendar component.

Our calendar wrapper - alongside our other components - is bundled using Vite, published as an NPM package, and then imported into a Nuxt 3 application.

The calendar works as expected in the consuming application, however when mounting any components that import from our library in a test environment (using Vitest), we get:

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

We have tried to optimise the bundled dependencies (as suggested here: viewtopic.php?p=109678&hilit=vite+bundle#p109678), and we have also tried to make both Bryntum packages peer dependencies of our library, rather than bundling them, neither of which helps.

I am happy to try create a minimal repro example if necessary, and/or provide source code.

Thanks


Post by tasnim »

Hi,

Welcome to Bryntum Forum!

The error sounds like you need to use thin bundles. Please study our guide here https://bryntum.com/products/calendar/docs/guide/Calendar/integration/vue/multiple-products

If you still see the problem after following the guide, please share a runnable test case with us so we can reproduce/debug it locally!

Best regards,
Tasnim

How to ask for help? Please read our Support Policy


Post by palmer2 »

Thanks, I've tried using the thin bundles as per the instructions, but still have the same problem.

I've created 2 repositories for replicating the issue.

https://github.com/palmer-rm/bryntum-test-issue-lib
https://github.com/palmer-rm/bryntum-test-issue-app

The first is a minimal reproduction of the library that exports the wrapper around the calendar.

It can be built and packaged locally:

npm run build-lib
npm pack

The second repository is a repro of a nuxt app. Clone this and install using the .tgz from the lib repo:

npm i
npm i ../path-to-lib-repo/bryntum-calendar-lib-0.0.1.tgz

Note that there are no apparent issues with the calendar:

npm run dev

But the error is thrown in a test environment:

npm run test

Many thanks!


Post by tasnim »

Thanks for sharing the test cases. But I'm getting different error while running your application.
Please check the screenshot below

XEaXMxcska.png
XEaXMxcska.png (189.24 KiB) Viewed 107 times

Could you please recheck the steps you shared? If anything is missing? And what node version and OS are you using?

Best regards,
Tasnim

How to ask for help? Please read our Support Policy


Post by palmer2 »

Hi, can I check what node version you are running?

I am on OSX 15.4.1, but there's no reason this shouldn't work on windows.

Please ensure you are on node >= 20.x.x

Can I also check that you are running npm run test in the correct repository (bryntum-test-issue-app)


Post by tasnim »

Hey,

I tried with node version v22.11.0

But I still don't see the error you mentioned, seeing other errors

Attachments
Bryntum-test-issues-app
Bryntum-test-issues-app
Cursor_AzNRVCiuBl.png (185.84 KiB) Viewed 80 times
Bryntum-test-issues-lib
Bryntum-test-issues-lib
Cursor_RgNvb8798V.png (84.51 KiB) Viewed 80 times

Best regards,
Tasnim

How to ask for help? Please read our Support Policy


Post Reply