Install Kendo UI Professional package using JSPM

[Jacob]

 I'm trying to set up a Kendo UI application environment based on JSPM using the instructions in this article:

    http://developer.telerik.com/featured/choose-es6-modules-today/

 The only place I deviate from that article is that I want to install Kendo UI Pro, not the free version. There is documentation about install Kendo UI Pro using Bowser. See here and here:

   http://docs.telerik.com/kendo-ui/install/bower​

   http://www.telerik.com/forums/install-kendo-ui-professional-bower-package​

 So I went ahead and ran these commands:

   sudo npm install jspm-bower-endpoint

   sudo jspm registry create bower jspm-bower-endpoint

   sudo jspm install kendo-ui=bower:https://bower.telerik.com/bower-kendo-ui.git

 The commands seemed to complete successfully. But then when I run my "serveit" Browsersync page, I get this error in the Chrome browser:

   XMLHttpRequest cannot load bower:https://bower.telerik.com/[e-mail]. Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https, chrome-extension-resource.

 How do i get this to work? Thanks.

[Jacob]

I ended up getting it to work by creating my own repo of Pro on github and installing it using the syntax:

sudo jspm install kendo-ui=bower:<user>/<package>

It doesn't seem to work using a url. I think it's a bug with the jspm-bower-endpoint plugin. I also had to explicitly install jquery rather than rely on it loading as a bower dependency.

 

[Petyo]

Hello Jacob,

from what I see, the jspm bower endpoint considers the URL provided as a ready to use http link (which is not the case), and tries to load it directly without maintaining a local copy. This does not seem right (like you have noticed). I re-ran the steps on my side, and ended up with this:

System.config({
  baseURL: "/",
  defaultJSExtensions: true,
  transpiler: "babel",
  babelOptions: {
    "optional": [
      "runtime",
      "optimisation.modules.system"
    ]
  },
  paths: {
    "bower:*": "jspm_packages/bower/*",
    "github:*": "jspm_packages/github/*",
    "npm:*": "jspm_packages/npm/*"
  },

  map: {
    "babel": "npm:babel-core@5.8.23",
    "babel-runtime": "npm:babel-runtime@5.8.20",
    "core-js": "npm:core-js@1.1.4",
    "kendoui": "bower:https://bower.telerik.com/bower-kendo-ui.git@2015.2.813",
    "name": "bower:https://bower.telerik.com/bower-kendo-ui.git@2015.2.813",
    "skeleton": "bower:skeleton@2.0.4",
    "bower:https://bower.telerik.com/bower-kendo-ui.git@2015.2.813": {
      "jquery": "bower:jquery@2.1.1"
    },
    "bower:skeleton@2.0.4": {
      "css": "github:systemjs/plugin-css@0.1.16"
    },
    "github:jspm/nodelibs-process@0.1.1": {
      "process": "npm:process@0.10.1"
    },
    "npm:babel-runtime@5.8.20": {
      "process": "github:jspm/nodelibs-process@0.1.1"
    },
    "npm:core-js@1.1.4": {
      "fs": "github:jspm/nodelibs-fs@0.1.2",
      "process": "github:jspm/nodelibs-process@0.1.1",
      "systemjs-json": "github:systemjs/plugin-json@0.1.0"
    }
  }
});

Obviously, this won't work if it is processed in the browser, since it can't load password protected git repos.

Given the rise of JSPM popularity, we are currently investigating means to provide official support for it. 

Regards,
Petyo
Telerik

 

 

[Jacob]

Thank your Petyo.

[Robert]

Is there any updates to Kendo UI Professional bower packages to support JSPM?

Is there also any chance Kendo UI Professional loaded to npm (because JSPM natively works with npm)?

[Stefan]

Hello Robert,

For now, there are no specific updates for Kendo UI Professional bower packages to support JSPM:

http://docs.telerik.com/kendo-ui/intro/installation/bower-install

As for using Kendo UI Professional with NPM, I can suggest checking the article in our documentation for the NPM packages:

http://docs.telerik.com/kendo-ui/intro/installation/npm

Regards,
Stefan
Telerik by Progress