AureliaでJQuery-UIを使用する方法

Question

Aurelia CLIを使用して新しいAureliaアプリケーションを開始しました。私は、jQueryの-UIをインストールNPM

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

：

私はアウレリア文書で命令を使用してjQueryと設定さaurelia.jsonをインストールしました。

ここで、audelia.jsonをjquery-uiを認識するように設定する方法を知る必要があります。

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

問題は、あなたが直接jqueryの-UIをダウンロードするときとは異なり、jQueryの-UIモジュールが持っていないということです実際のjQuery：この例では、モジュールを参照する方法に与えられているアウレリアのドキュメントで

-ui.jsファイル（見つからない場合）

あなたは

Answer 1

jquery-uiパッケージは、私の知る限りjqueryの-UIの「構築された」バージョンが含まれていませんありがとうございました。私は最終的に、デフォルトのjquery-ui.jsとjquery-ui.cssファイルを含むjquery-ui-distパッケージを使用してこれを動作させました。

npm install jquery-ui-dist --save 

今ベンダーバンドルの依存関係でそれをaurelia.json追加：私たちが最初にjqueryのをロードしている

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

注意してください。 「main」属性は、そのディレクトリからjquery-ui.jsをロードする必要があることを示します。 "deps"属性はjqueryに依存していることを伝えます。最後に、「resources」属性にはデフォルトjquery-ui.cssが含まれています。

import * as $ from 'jquery'; 
import 'jquery-ui-dist'; 

Answer 2

私が更新した後、オーレリア1.0.Xを使用しています：

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

は、TSファイルで使用するには：app.htmlで今

、CSSファイルを必要とするようにしてくださいこの2つのインポートはjQuery-UIウィジェット（この場合はドラッグ可能）を使用するために必要でした。また、スライダを読み込んだりサイズを変更したりするときにも機能します。私のpackage.jsonで

import $ from 'jquery'; 
import {draggable} from 'jquery-ui'; 

次のように、私のJSPMの依存関係は、以下のとおりです。

"jquery": "npm:jquery@^3.2.1", 
"jquery-ui": "github:components/jqueryui@^1.12.1"