如何在Angular 2 - Webpack App中包含非节点模块Jquery插件

时间:2017-02-16 18:34:33

标签: javascript jquery node.js angular webpack

我正在使用ng2-admin template并尝试在其中加入Sly,但我正在努力添加它。

我只是在我的Index.html中添加了jquery和Sly链接,但我不知道如何在我的Component中导入Sly。

webpack.common.js:

new webpack.ProvidePlugin({
    $: "jquery",
    jQuery: "jquery",
    "window.jQuery": "jquery",
    ...
  }),

analysis.component.ts:

import { Component, OnInit } from '@angular/core';
var Sly = require('../../../assets/plugins/sly/sly')
import 'style-loader!./analysis.scss';

@Component({
    selector: 'analysis',
    templateUrl: './analysis.html'
})
export class AnalysisComponent implements OnInit {
    public acreage: any = {
        condition: { good: 46, ok: 27, bad: 27 }
    }
    constructor() { }

    ngOnInit() {
        console.log('Sly', Sly)
        var sly = new Sly('#frame', { horizontal: true }, {
            load: function () {
                console.log('load')
            },
            move: [
                function () {
                    console.log('move 1')
                },
                function () {
                    console.log('move 2')
                }
            ]
        });
        sly.init();
    }
}

我在浏览器的控制台中遇到以下错误:

  

Sly不是构造函数

错误只是意味着未导入Sly插件。 如何在Angular 2 Webpack应用程序中导入和使用非节点模块Jquery插件。我正在使用的模板的完整代码可以找到here

0 个答案:

没有答案