EmberJS - Verwalten von Abhängigkeiten

Ember verwendet NPM und Bower zum Verwalten von Abhängigkeiten, die in package.json für NPM und bower.json für Bower definiert sind. Beispielsweise müssen Sie möglicherweise SASS für Ihre Stylesheets installieren, die Ember während der Entwicklung der Ember-App nicht installiert hat. Verwenden Sie dazu die Ember Addons, um die wiederverwendbaren Bibliotheken freizugeben . Wenn Sie CSS-Framework- oder JavaScript-Datumsauswahlabhängigkeiten installieren möchten, verwenden Sie den Bower-Paketmanager.

Addons

Die Ember-CLI kann verwendet werden, um die Ember-Addons mit dem folgenden Befehl zu installieren:

ember install ember-cli-sass

Der Befehl ember install speichert alle Abhängigkeiten in der jeweiligen Konfigurationsdatei.

Laube

Es ist ein Paketmanager für das Web, der die Komponenten von HTML-, CSS-, JavaScript- oder Bilddateien verwaltet. Grundsätzlich werden alle Pakete gepflegt und überwacht und neue Updates geprüft. Es verwendet die Konfigurationsdatei bower.json , um Anwendungen zu verfolgen, die sich im Stammverzeichnis des Ember CLI-Projekts befinden.

Sie können die Projektabhängigkeiten mit dem folgenden Befehl installieren:

bower install <dependencies> --save

Vermögenswerte

Sie können das JavaScript eines Drittanbieters im Anbieter / Ordner Ihres Projekts ablegen, die nicht als Addon- oder Bower-Paket verfügbar sind, und die eigenen Assets wie robots.txt, favicon usw. in der public / Ordner Ihres Projekts ablegen . Die Abhängigkeiten, die Ember während der Entwicklung der Ember-App nicht installiert hat, sollten mithilfe der Manifestdatei ember-cli-build.js aufgenommen werden .

AMD JavaScript-Module

Sie können den Asset-Pfad als erstes Argument und die Liste der Module und Exporte als zweites Argument angeben. Sie können diese Assets als - in die Manifestdatei ember-cli-build.js aufnehmen.

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

Umgebungsspezifische Vermögenswerte

Die verschiedenen Assets können in verschiedenen Umgebungen verwendet werden, indem das Objekt als erster Parameter definiert wird, bei dem es sich um einen Umgebungsnamen handelt. Der Wert eines Objekts sollte in dieser Umgebung als Asset verwendet werden. In die Manifestdatei ember-cli-build.js können Sie Folgendes einfügen :

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

Sonstige Vermögensgegenstände

Sobald alle Assets im Ordner public / abgelegt sind , werden sie in das Verzeichnis dist / kopiert. Wenn Sie beispielsweise ein Favicon kopieren, das sich im Ordner public / images / favicon.ico befindet , wird dieses in das Verzeichnis dist / images / favicon.ico kopiert . Die Assets von Drittanbietern können manuell im Anbieter / Ordner oder mithilfe des Bower-Paketmanagers über die Option import () hinzugefügt werden . Die Assets, die nicht mit der Option import () hinzugefügt wurden , sind im endgültigen Build nicht vorhanden.

Betrachten Sie beispielsweise die folgende Codezeile, mit der die Assets in den Ordner dist / importiert werden .

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

Die obige Codezeile erstellt eine Schriftartdatei in dist / font-awesome / fonts / fontawesomewebfont.ttf . Sie können die obige Datei auch an einem anderen Pfad platzieren, wie unten gezeigt -

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

Die Schriftartdatei wird in dist / assets / fontawesome-webfont.ttf kopiert .