When I include Kendo UI for Vue in my vue project, webpack fails with an error

Progress® Kendo® UI for Vue Feedback Portal

Create an account Log In

Back to Feed

Request a Feature Report a Bug

Completed

Last Updated: 24 Sep 2020 08:08 by ADMIN

Jacob

Created on: 17 May 2019 11:58

Category: Kendo UI® for Vue

Type: Bug Report

When I include Kendo UI for Vue in my vue project, webpack fails with an error

Steps to reproduce:

(latest version of vue, vue CLI, node etc. installed globally)

vue create test-project
cd test-project
npm install --save @progress/kendo-ui
npm install --save @progress/kendo-theme-default
npm install --save @progress/kendo-dateinputs-vue-wrapper
added Calendar component to App.vue (see https://www.telerik.com/kendo-vue-ui/getting-started/)
changed the name "kendo-calendar" in HTML template to "Calendar", otherwise I get build errors
npm run serve --> browse to localhost:8080 --> error in console:

Uncaught ReferenceError: $ is not defined
at eval (webpack-internal:///./node_modules/@progress/kendo-ui/js/pdf-viewer/pager.js:85)
at Object.eval (webpack-internal:///./node_modules/@progress/kendo-ui/js/pdf-viewer/pager.js:292)
at eval (webpack-internal:///./node_modules/@progress/kendo-ui/js/pdf-viewer/pager.js:74)
at Object.1472 (webpack-internal:///./node_modules/@progress/kendo-ui/js/pdf-viewer/pager.js:75)
at __webpack_require__ (webpack-internal:///./node_modules/@progress/kendo-ui/js/pdf-viewer/pager.js:21)
at Object.0 (webpack-internal:///./node_modules/@progress/kendo-ui/js/pdf-viewer/pager.js:49)
at __webpack_require__ (webpack-internal:///./node_modules/@progress/kendo-ui/js/pdf-viewer/pager.js:21)
at eval (webpack-internal:///./node_modules/@progress/kendo-ui/js/pdf-viewer/pager.js:41)
at eval (webpack-internal:///./node_modules/@progress/kendo-ui/js/pdf-viewer/pager.js:44)
at Object../node_modules/@progress/kendo-ui/js/pdf-viewer/pager.js (app.js:3624)

I could reproduce the error using different Kendo UI for vue components like Buttons etc. (following the getting-started page for the button component). The default vue project template uses Babel and Webpack. Is there a configuration missing for Kendo UI?

I already checked:

Attached Files:

test-project.zip

3 comments

ADMIN

Joana

Posted on: 23 May 2019 11:38

Hi,

I confirm that the described error is encountered with 2019.2.514 version of the Vue wrappers. The issue is related to the loading of kendo scripts through webpack. The issue has been immediately resolved and a fix will be available in the next Latest Internal Build and the upcoming service pack.

In the meantime, a possible workaround would be to globally assign $ to jQuery in your projects:

import * as $ from 'jquery';

window.$ = $;

I apologize for the caused inconvenience.

Regards,
Joana
Progress Telerik

Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items

Martin

Posted on: 22 May 2019 17:45

Same issue, I get the following error in Chrome console:

It worked with previous release

Hernando

Posted on: 21 May 2019 15:36

I am having the same problem in KENDO UI Angular

vendor.js:484619 Uncaught ReferenceError: $ is not defined
at vendor.js:484619
at Object.<anonymous> (vendor.js:484826)
at vendor.js:484608
at Object.1472 (vendor.js:484609)
at __webpack_require__ (vendor.js:484555)
at Object.0 (vendor.js:484583)
at __webpack_require__ (vendor.js:484555)
at vendor.js:484575
at Object../node_modules/@progress/kendo-ui/js/pdf-viewer/pager.js (vendor.js:484578)
at __webpack_require__ (runtime.js:79)

my project was working fine and since yesterday I am getting this error ... any ideas ?