2016-06-27 18 views
5

bower_concat ist großartig. Wenn Sie ein Bower Paket hinzufügen, mit:bower_concat entspricht für NPM

bower install something --save 

bower_concat wird die Javascript und CSS aus diesem Paket automatisch abgerufen und in ein Bündel concantenate, so dass Sie mit einer schönen vendor.js und vendor.css Dateien beenden, den Sie mit dann verkleinern und injizieren Sie in HTML.

Mit dem Aufkommen von angular2 though und dem Typescript-Import-System durchlaufen alle Pakete, einschließlich des in Ihrer App verwendeten, NPM.

Gibt es ein Äquivalent von bower_concat für NPM? Es würde Sie automatisch CSS abrufen und ein Bundle damit erzeugen?

+0

Werfen Sie einen Blick auf https://github.com/gruntjs/grunt-contrib-concat – AngJobs

+0

@AngJobs bower_concat ist kein einfaches concat-Tool. Es extrahiert relevante js und css aus dem Paket und verkettet sie automatisch. Mit grunt-concat müsste ich das grunfile jedes Mal aktualisieren, wenn ich eine Abhängigkeit hinzufüge. –

+0

Ich denke, Webpack kann das und noch viel mehr: https://webpack.github.io/docs/stylesheets.html; der Nachteil ist meiner Meinung nach, dass Webpack etwas gewöhnungsbedürftig ist. Aber Sie können ein gut getestetes Beispiel wie Angular 2 Webpack Starter verwenden: https://github.com/AnglarClass/angular2-webpack-starter – Manube

Antwort

1

Webpack ist definitiv der Weg zu gehen. Sie müssen Ihren Code ein wenig überarbeiten, am besten verwenden Sie den ES6-Import (verwenden Sie babel, um bei Bedarf auf ES5 herunterzustufen) und das Webpack wird "einfach funktionieren" (c).

Mit Webpack können Sie bower, aber auch require und sogar grunt loswerden, wenn Ihre Einrichtung einfach genug ist.

Wie funktioniert es? Es nimmt eine Datei (die "Hauptdatei") und geht dann durch die Importabhängigkeit, um sie in eine (oder mehrere) Dateien zu packen. Während sie verketten, können Sie 'Loader' anwenden. Loader sind Werkzeuge, die die Datei als Eingabe nehmen und die Ausgabe von Webpack übernehmen. Loader können beliebig transformieren, harmlos machen, transpilieren oder anwenden. Es gibt viele Lader da draußen.

ich nicht zurück bin auf der Suche ...

1

dieses Paket ähnlich ist Ihr Paket, sehen diese es Ihnen helfen, https://www.npmjs.com/package/node-minify

+0

Ich bin nicht auf der Suche nach minimieren, sondern nur concat. Und wenn ich die Dokumentation richtig verstehe, müssen Sie immer noch manuell angeben, welche Module minimiert werden sollen. bower_concat macht das automatisch. Also fügen Sie einfach ein Paket hinzu und es wird automatisch in Ihre Webapp ... –