Jak dodać bibliotekę stron trzecich podczas korzystania z funkcji kątowej-cli?

Question

Chciałem wypróbować tworzenie aplikacji Angular 2 z kątowym-cli (https://github.com/angular/angular-cli), a następnie użyć materiału ng2 (https://github.com/justindujardin/ng2-material) dla komponentów interfejsu użytkownika. Ale po prostu nie rozumiem, jak/gdzie muszę dołączyć bibliotekę ng2-materialu, aby z niej skorzystać.

Stworzyłem projekt z ng new myproject, a następnie uruchomiłem serwer z ng serve i otworzyłem stronę, która właśnie działała dobrze. W następnym kroku zainstalowałem materiał ng2 z npm install ng2-material --save. Następnie dodałem MATERIAL_PROVIDERS do bootstrapu kątowego, jak pokazano tutaj https://github.com/AngularShowcase/angular2-seed-ng2-material/blob/master/app/bootstrap.ts.

Powoduje to wyświetlenie komunikatu o błędzie GET http://localhost:4200/ng2-material/all 404 (Not Found) w przeglądarce internetowej i nie mogę pojąć, jak się go pozbyć.

cokular-cli wydaje się robić coś, aby utworzyć dist -folder, w którym niektóre moduły węzłów używane w index.html kończą się, ale nie widzę, gdzie i jak to skonfigurowano.

Answer 1

[EDIT 29/09/2016] Teraz, kanciasty-CLI używa system.js WebPack ISO, to odpowiedź nie mieć więcej sensu. Sprawdź strony "3d party lib installation" i "global lib installation" na stronie wiki kątowej.

[EDIT 10/05/2016] Zostało to teraz opisane szczegółowo pod numerem angular cli wiki.

Ten pracował dla mnie:

W Ember-CLI-build.js, dodać zależność do vendorNpmFiles, na przykład

module.exports = function (defaults) { 
    var app = new Angular2App(defaults, { 
     vendorNpmFiles: [ 
      'a2-in-memory-web-api/web-api.js' 
     ] 
    }); 
    return app.toTree(); 
} 

(gdzie a2-in-memory-web-api/web-api.js plik jest w moich node_modules folder)

W index.html dodasz linia:

<script src="vendor/a2-in-memory-web-api/web-api.js"></script> 

Na koniec ponownie uruchom serwer.

Nie testowałem tego z kanciastym materiałem, ale masz pomysł.

Answer 2

Spróbuj konfigurowania SystemJS w index.html tak:

System.config({ 
    packages: { 
     app: { 
      format: 'register', 
      defaultExtension: 'js' 
     }, 
     'node_modules/ng2-material': { 
      format: 'register', 
      defaultExtension: 'js' 
     } 
    }, 
    paths: { 
     'ng2-material/all': 'node_modules/ng2-material/all' 
    } 
});