问题描述
我使用Aurelia CLI启动了一个新的Aurelia应用程序。
I started a new Aurelia app using the Aurelia CLI.
我安装了JQuery并使用Aurelia文档中的说明配置了aurelia.json:
I installed JQuery and configured aurelia.json using the instructions at the Aurelia documentation:
我已经安装了npm Jquery-ui。
I then npm installed Jquery-ui.
我现在需要知道如何配置audelia.json来识别jquery-ui。
I now need to know how to configure audelia.json to recognize jquery-ui.
在Aurelia文档中,给出了如何引用模块的示例:
In the Aurelia documentation this example is given on how to reference a module:
"dependencies": [
{
"name": "library-name",
"path": "../node_modules/library-name/dist/library-name"
}
]
问题在于,与直接下载jquery-ui时不同,JQuery-ui模块没有实际的Jquery-ui.js文件(如果它我找不到它)。
The problem is that unlike when you download jquery-ui directly, the JQuery-ui module does not have an actual Jquery-ui.js file ( if it does I couldn't find it).
谢谢
推荐答案
jquery -ui
据我所知,包不包含jquery-ui的内置版本。我终于通过使用 jquery-ui-dist
包来完成这项工作,该包包含默认的jquery-ui.js和jquery-ui.css文件。
The jquery-ui
package doesn't include a "built" version of jquery-ui as far as I can tell. I finally got this working by using the jquery-ui-dist
package, which includes the default jquery-ui.js and jquery-ui.css files.
npm install jquery-ui-dist --save
现在在vendor-bundle的依赖项中添加aurelia.json:
Now add it aurelia.json in dependencies for vendor-bundle:
"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。
Notice we are loading jquery first. The "main" attribute tells it that it should load jquery-ui.js from that directory. The "deps" attribute tells it that it is dependent on jquery. Finally the "resources" attribute includes the default jquery-ui.css.
现在在app.html中,请务必要求css文件:
Now in app.html, be sure to require the css file:
<require from="jquery-ui-dist/jquery-ui.css"></require>
要在ts文件中使用:
import * as $ from 'jquery';
import 'jquery-ui-dist';
这篇关于如何在Aurelia中使用JQuery-UI的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!