Question

如何在Aurelia中使用jquery插件？特别是，我正在尝试使用Notify.js。

位于 jspm 下的 package.json - ＆gt; 依赖关系如下：

"notifyjs-browser": "npm:notifyjs-browser@^0.4.2"

我试图按如下方式导入它：

import { notify } from 'notifyjs-browser';

并像这样使用它：

$.notify("Test 123", "error");

但是，我收到此错误消息：

$.notify is not a function

我假设我在Aurelia中的任何jQuery插件都会遇到同样的问题。我该如何解决这个问题？

更新：看来这个问题可能只在我使用JSPM设置时才存在，因为@ peinearydevelopment的答案和我在Aurelia的“话语”中收到的另一个答案same question “页面都坚持notifyjs与Aurelia CLI一起正常工作。如果我不必重写所有内容只是为了从JSPM更改为Aurelia CLI，那将是非常好的。任何人都可以解决这个问题吗？转移到Aurelia CLI似乎为这个小问题做了很多工作。

Answer 1

如果没有您的确切设置，很难给您一个完整的答案。您获得错误的原因是由于您没有导入jQuery。没有它，Aurelia，或者更具体地说它的资源加载器不会将该脚本拉入您的应用程序，因此notify不是“函数”，因为它是jQuery原型的扩展。

我知道这是一个不同的设置，但这是我如何让该插件工作。我用Aurelia cli创建了一个新项目。

au new au-notifyjs

然后我安装了所需的包

au install jquery notifyjs-browser

这将安装npm软件包，更新package.json文件并更新aurelia.json文件，并正确引用js文件以及notify的css文件。

然后我更新了app.js文件以测试它是否适用于以下内容：

import 'jquery';
import 'notifyjs-browser';

export class App {
  constructor() {
    this.message = 'Hello World!';
  }

  attached() {
    $.notify('Test 123', 'error');
  }
}

我运行了应用程序，看到通知出现在屏幕的右上角。可以找到完整的代码项目here。希望这有帮助！

Answer 2

我无法 Notify.js 在 JSPM 设置下工作，所以我决定找其他的东西。我选择了aurelia-notification插件，并且工作正常。我仍然想知道在JSPM下它的工作原理是什么，因为可能有其他库存在同样的问题。所以，如果有人有答案，请分享。

如何在Aurelia中使用jQuery插件

2 个答案: