如何将 JQuery-UI 与 Aurelia 结合使用

2023-11-24

我使用 Aurelia CLI 启动了一个新的 Aurelia 应用程序。

我按照 Aurelia 文档中的说明安装了 JQuery 并配置了 aurelia.json:

http://aurelia.io/hub.html#/doc/article/aurelia/framework/latest/the-aurelia-cli/6

然后我 npm 安装了 Jquery-ui。

我现在需要知道如何配置 audelia.json 来识别 jquery-ui。

在 Aurelia 文档中,给出了有关如何引用模块的示例:

"dependencies": [
  {
    "name": "library-name",
    "path": "../node_modules/library-name/dist/library-name"
  }
]

问题是,与直接下载 jquery-ui 不同,JQuery-ui 模块没有实际的 Jquery-ui.js 文件(如果有,我找不到它)。

谢谢


The jquery-ui据我所知,package 不包含 jquery-ui 的“内置”版本。我终于通过使用得到了这个工作jquery-ui-dist包,其中包括默认的 jquery-ui.js 和 jquery-ui.css 文件。

npm install jquery-ui-dist --save

现在将 aurelia.json 添加到供应商捆绑包的依赖项中:

    "dependencies": [
      "aurelia-binding",
      ...
      "jquery",
      {
        "name": "jquery-ui-dist",
        "path": "../node_modules/jquery-ui-dist",
        "main": "jquery-ui",
        "deps": ["jquery"],
        "resources": [
          "jquery-ui.css"
        ]
      },
    ]

请注意,我们首先加载 jquery。 “main”属性告诉它应该从该目录加载 jquery-ui.js。 “deps”属性告诉它它依赖于jquery。最后,“resources”属性包括默认的 jquery-ui.css。

现在在 app.html 中,请确保需要 css 文件:

<require from="jquery-ui-dist/jquery-ui.css"></require>

在 ts 文件中使用:

import * as $ from 'jquery';
import 'jquery-ui-dist';
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

如何将 JQuery-UI 与 Aurelia 结合使用 的相关文章