EmberJS - Zarządzanie zależnościami

Ember używa NPM i Bower do zarządzania zależnościami, które są zdefiniowane w package.json dla NPM i bower.json dla Bower. Na przykład możesz wymagać zainstalowania SASS dla swoich arkuszy stylów, które nie są instalowane przez Ember podczas tworzenia aplikacji Ember. Aby to osiągnąć, użyj dodatków Ember do udostępniania bibliotek wielokrotnego użytku. Jeśli chcesz zainstalować dowolną strukturę CSS lub zależności datpicker JavaScript, użyj menedżera pakietów Bower.

Dodatki

Ember CLI może być użyty do zainstalowania Ember Addons za pomocą następującego polecenia -

ember install ember-cli-sass

Polecenie instalacji ember zapisze wszystkie zależności w odpowiednim pliku konfiguracyjnym.

Altana

Jest to menedżer pakietów dla sieci, który zarządza komponentami HTML, CSS, JavaScript lub plików graficznych. Zasadniczo utrzymuje i monitoruje wszystkie pakiety oraz sprawdza nowe aktualizacje. Używa pliku konfiguracyjnego bower.json do śledzenia aplikacji umieszczonych w katalogu głównym projektu Ember CLI.

Zależności projektu można zainstalować za pomocą następującego polecenia -

bower install <dependencies> --save

Majątek

Możesz umieścić JavaScript innej firmy w dostawcy / folderze projektu, który nie jest dostępny jako pakiet Addon lub Bower, i umieścić własne zasoby, takie jak robots.txt, favicon itp. W folderze publicznym / projektu. Zależności, które nie są instalowane przez Ember podczas tworzenia aplikacji Ember, należy uwzględnić za pomocą pliku manifestu ember-cli-build.js .

Moduły JavaScript AMD

Możesz podać ścieżkę zasobu jako pierwszy argument, a listę modułów i eksportów jako drugi argument. Możesz dołączyć te zasoby do pliku manifestu ember-cli-build.js jako -

app.import('bower_components/ic-ajax/dist/named-amd/main.js', {
   exports: {
      'ic-ajax': [
         'default',
         'defineFixture',
         'lookupFixture',
         'raw',
         'request'
      ]
   }
});

Zasoby specyficzne dla środowiska

Różne zasoby mogą być używane w różnych środowiskach poprzez zdefiniowanie obiektu jako pierwszego parametru, którym jest nazwa środowiska, a wartość obiektu powinna być używana jako zasób w tym środowisku. W pliku manifestu ember-cli-build.js można dołączyć jako -

app.import ({
   development: 'bower_components/ember/ember.js',
   production:  'bower_components/ember/ember.prod.js'
});

Inne aktywa

Gdy wszystkie zasoby zostaną umieszczone w folderze public / , zostaną skopiowane do katalogu dist /. Na przykład, jeśli skopiujesz favicon umieszczoną w folderze public / images / favicon.ico , zostanie ona skopiowana do katalogu dist / images / favicon.ico . Zasoby stron trzecich można dodać ręcznie w dostawcy / folderze lub za pomocą menedżera pakietów Bower za pośrednictwem opcji import () . Zasoby, które nie zostaną dodane za pomocą opcji import () , nie będą obecne w ostatecznej kompilacji.

Weźmy na przykład pod uwagę następujący wiersz kodu, który importuje zasoby do folderu dist / .

app.import('bower_components/font-awesome/fonts/fontawesome-webfont.ttf');

Powyższy wiersz kodu tworzy plik czcionki w lokalizacji dist / font-awesome / fonts / fontawesomewebfont.ttf . Możesz również umieścić powyższy plik w innej ścieżce, jak pokazano poniżej -

app.import('bower_components/font-awesome/fonts/fontawesome-webfont.ttf', {
   destDir: 'assets'
});

Plik czcionki zostanie skopiowany w dist / asset / fontawesome-webfont.ttf .