2016-11-28 30 views
6

Aurelia CLI kullanarak yeni bir Aurelia uygulaması başlattım. Sonra JQuery-ui yüklü, NPMAurelia ile JQuery-UI nasıl kullanılır

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

:

I Aurelia belgelerine talimatları kullanılarak JQuery ve yapılandırılmış aurelia.json yüklü.

Artık audelia.json'un jquery-ui'yi tanıması için nasıl yapılandırılacağını bilmem gerekiyor.

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

sorun doğrudan jquery-ui indirdiğinizde aksine JQuery-ui modülü yok olan gerçek bir jQuery: Bu örnek, bir modül başvurmak için nasıl verilir Aurelia belgelerinde

-ui.js dosyası (eğer bunu bulamadım).

Eğer

+0

O modül referans sözdizimi tek bir dosya modülü için, ama jQuery UI birden fazla dosya vardır: şöyle my package.json olarak

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

, benim jspm bağımlılıkları vardır. Muhtemelen ana isim dosyasını tanımlamak için 'ana 'işlevini kullanmanız gerekecektir. Gönderdiğiniz Aurelia doc örneğinde biraz aşağı kaydırın ve "A CommonJS Paketi" ve "Bir Eski Kütüphane" altında "main" kullanımı için örnekler bulacaksınız. –

+0

biliyorum ama hala tam olarak nasıl yapılacağı sorusuna cevap vermiyor – William

+0

Ben de bugün bunu yüklemeyi denedim ve işe almak mümkün değildi. Çözüme ilgi duyarım. – LStarky

cevap

2

jquery-ui paket bildiğim kadarıyla söyleyebilirim jquery-ui bir "inşa" versiyonunu içermez ederiz. Sonunda jquery-ui.js ve jquery-ui.css dosyalarını içeren jquery-ui-dist paketini kullanarak çalıştım.

npm install jquery-ui-dist --save 

Şimdi satıcı-paket için bağımlılıkları bunu aurelia.json ekleyin: öncelikle jquery yüklüyorsunuz

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

dikkat edin. "Ana" özniteliği, bu dizinden jquery-ui.js dosyasını yüklemesi gerektiğini bildirir. "Deps" özniteliği, jquery'ye bağlı olduğunu belirtir. Son olarak, "kaynaklar" özniteliği, varsayılan jquery-ui.css içerir.

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

ben güncellemeden sonra, Aurelia 1.0.x kullanıyorum:

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

bir ts dosyasında kullanmak için: app.html Şimdi

, css dosyasını gerektiren emin olun Herhangi bir jQuery-UI parçacığını kullanmak için bu iki ithalata ihtiyacım vardı, bu durumda sürüklenebilir. Ayrıca kaydırıcıyı içe aktarırken veya yeniden boyutlandırıldığında da çalışır.

"jquery": "npm:[email protected]^3.2.1", 
"jquery-ui": "github:components/[email protected]^1.12.1"