Vue wrapper components

[HUR]

Hi all,
I would like to try Kendo Vue SpreadSheet wrapper component.

Because there is no native Vue SpreadSheet component at the moment.

I have tried somethings but I cannot run my example programs.

I have installed kendo-ui and spreadsheet wrapper (or any other wrappers).

When I run the program with npm run dev I got error below.
(I tried it on Windows 10 and Linux Ubuntu 22)

EDIT: I found this https://github.com/telerik/kendo-ui-core/issues/7238, but there is no solution addressed.

=========================================================================

VITE v4.2.1  ready in 391 ms

    Local:   http://localhost:5173/
    Network: use --host to expose
    press h to show help
✘ [ERROR] Unterminated string literal

    node_modules/@progress/kendo-ui/umd/kendo.all.min.js.map:1:6045463:
      1 │ ...x3e8);}return _0x135b10[_0x3505('0x4')]=_0x31765a,_0x135b10[_0x3505('0x28')]=_0x4b9d63,Object[_0x3505('0x4d')](_0x135b10,_0x3505('0x4f'),{'value':!![]}),_0x135b10;}({});
        ╵                                                                                                                                                                             ^

  The source map "node_modules/@progress/kendo-ui/umd/kendo.all.min.js.map" was referenced by the
  file "node_modules/@progress/kendo-ui/umd/kendo.all.min.js" here:

    node_modules/@progress/kendo-ui/umd/kendo.all.min.js:3:21:

[Plamen]

Hi,

In the issue that you linked there is a workaround:

Workaround
use the following import
import '@progress/kendo-ui/esm/kendo.all.js'

Please give it a try it and let us know it worked correctly for you.

Regards,
Plamen
Progress Telerik

[HUR]

Hi, Plamen.

I think that it works when I have import kendo-ui as you said. 
I have attached simple app that works.

Another issue. When I use only native compoent on the page, program is very fast.
But when I add wrapper component on the same page (as I attached), loadin of the program slows.
Is it possible to prevent this issue?

Thanks a lot.

Hur AKDULGER

[Plamen]

Yes, Indeed! Adding Kendo UI for Vue Wrappers is bringing larger potion of Javascript that is making the page a bid slower. That is why a few years ago we started the initiative with Kendo UI for Vue to try to provide the greatest experience possible for the Vue ecosystem. We are doing our best to add as fast as possible new native components (have more than 100 already ) yet if you still need some of the wrappers you could try to avoid adding kendo.all.js but rather just the needed part of the scripts. Incase with the calendar it is:

 import '@progress/kendo-ui/esm/kendo.calendar.js'

For spreadsheet it is:

 import '@progress/kendo-ui/esm/kendo.spreadsheet.js'

You can check in the Node_modules/@progress/kendo-ui/ directory and find the files that are listed for each component.

Hope this will explain the issue. If you have further questions please let me know.

[HUR]

Hi, Plamen.
It works! Great...

Thank you for your support.

Regards.