Question

我正在使用以下样板https://github.com/casufi/NG6-starter 这是app.js的一部分

        import $ from 'jquery';
        import angular from 'angular';
        import 'kendo-ui-core';

http://pastebin.com/raw/tgdp0UMR

但是我收到以下错误消息

错误：Kendo UI指令要求在AngularJS之前使用jQuery。请在文档中包含角度之前的jquery。

Answer 1

这是解决方案

https://github.com/telerik/kendo-ui-core/issues/1932

// ...
module.exports = function makeWebpackConfig () {
    var config = {};

    // ...

    config.plugins = [
        new webpack.ProvidePlugin({
            'window.jQuery': 'jquery'
        })
    ];

    // ...

    return config;
}();

Answer 2

当kendo ui使用它自己的模板系统时，窗口上需要$。如果可以，请使用https://github.com/webpack-contrib/expose-loader 但是如果暴露加载器仍然不起作用，那么你必须创建一个模块将jquery放在window

上

import $ from 'jquery'
window.$ = $

并在导入kendo之前首先加载该模块

Answer 3

似乎当前版本的kendo-ui-core配置为使用小于3.0.0的jquery版本。如果你的项目的其余部分使用的是更高版本，那么kendo-ui-core将被设置为拥有自己的私有版本，因此错误。

解决方案是使用别名强制kendo-ui-core使用与其他人相同版本的jquery。

在你的webpack.config.js中试试这个：

resolve: {
  alias: {
    jquery: path.resolve(__dirname, "node_modules/jquery"), 
  },
  modules: ["node_modules"]
}

如何使用webpack和es2016的kendo ui核心？

3 个答案: