Gestion des dépendances JavaScript: npm vs bower vs volo [fermé]

160

Comment comparez-vous npm, boweret volo?

Les trois peuvent être utilisés pour installer des dépendances JavaScript pour un projet d'interface utilisateur. Je comprends que npmc'est plus spécifique au nœud.

Alors, quand utiliser quoi?

npmse tient encore lointaine, mais boweret volosemblent être résoudre exactement le même problème, même si je ne suis pas en mesure de tracer une ligne entre npmet bower-volo.

Yugal Jindle
la source
1
Si vous êtes ici en train de lire cette question et que vous souhaitez une réponse de 2015, consultez ma réponse mise à jour.
gustavohenke
2
Bower pourrait être fusionné dans npm assez bientôt.
Dan Dascalescu

Réponses:

104

Une description qui décrit le mieux la différence entre npm et bower est la suivante: npm gère les modules JavaScript appelés packages et Bower gère les composants frontaux (css, html et JavaScript) appelés composants. npm est également utilisé pour installer bower. Voici un article complet sur npm et bower (ne couvre pas le volo), il va dans beaucoup de détails.

strangeloops
la source
88
Ce n'est pas une très bonne description. Npm peut certainement être utilisé pour installer des composants frontaux.
BT
Bien que j'aie remarqué que certaines bibliothèques «frontend» sur npm sont abandonnées au profit de leurs homologues bower. Prenez par exemple Ember , qui n'a pas été publié depuis un an.
briangonzalez
4
@Nate Le nom est simplement là où il a commencé. NPM est maintenant un système de gestion de paquets très général. J'utilise régulièrement npm pour installer des modules frontaux. Il n'y a aucune différence entre l'utilisation de NPM pour les modules commonjs, par rapport à amd, par rapport à autre chose. Vous pouvez également utiliser npm pour les modules non javascript. Par conséquent, ce n'est tout simplement pas une différence entre npm et bower. Que vous les appeliez packages ou composants, ils sont identiques en ce sens qu'ils sont tous deux des collections de fichiers arbitraires.
BT
2
C'est une réponse très trompeuse étant donné que bower n'a pas de politique pour traiter le html, le css et le javascript. npm n'a pas non plus de politique, sauf que presque tout sur npm est écrit pour au moins prendre en charge commonjs et parfois d'autres formats. Vous pouvez mettre du html et du css dans des packages npm comme vous pouvez le faire avec bower. Il existe de nombreux packages frontaux uniquement sur npm, y compris des packages qui incluent css et html.
Substack
3
Si vous utilisez browserify , npm est le gestionnaire de packages parfait. Je ne pense pas que le gestionnaire de packages que vous utilisez importe peu, mais je m'en tiendrai personnellement à un seul par projet.
Eruant le
72

tonnelle

Il est toujours très populaire parmi les développeurs front-end, même s'il a très peu de fonctionnalités. Chaque package frontal l'utilise. Il existe également une initiative visant à fusionner bower dans npm .

Bower est optimisé pour le côté client et ne prend en charge que les arbres de dépendances plats, c'est-à-dire que chaque bibliothèque ne doit être utilisée qu'une seule fois (car il est coûteux de livrer différentes versions de la même bibliothèque au client), et les contraintes de dépendance doivent être résolues par l'utilisateur .

Vous pouvez vous attendre à trouver tout ce qui est lié au front-end dans le registre de bower (bower search <some keyword> ) - à mon avis, c'est le plus grand avantage de bower par rapport aux autres gestionnaires de paquets.

volo

Je ne l'ai toujours pas utilisé depuis plus de 5 minutes depuis des années. Je ne sais pas à ce sujet, mais d'après ce que je peux voir il inclut un outil de construction, qui est très familier aux utilisateurs de Grunt.

npm

Oui, npm signifie Node Package Manager. Mais de nos jours, vous pouvez l'utiliser pour tout; les gens ne font plus que des npm installchoses et s'attendent à ce qu'ils fonctionnent uniquement dans l'environnement Node. Par exemple, il existe de nombreux packages npm pour Twitter Bootstrap .

Npm est optimisé pour une utilisation côté serveur, avec une arborescence de dépendances imbriquée. Chaque dépendance peut avoir ses propres dépendances qui peuvent avoir les leurs, et ainsi de suite. Cette version éliminée des conflits de dépendance car chaque dépendance peut utiliser sa propre version, par exemple Underscore. Cependant, la prochaine version 3 de npm aplatira l'arborescence des dépendances :

Avec npm @ 3, votre répertoire node_modules sera beaucoup plus plat. Toutes vos dépendances et la plupart de vos sous-dépendances (et (sous) + dépendances) seront placées les unes à côté des autres au niveau supérieur. Ce n'est qu'en cas de conflit que les modules seront installés à des niveaux plus profonds. Cela devrait rendre les choses beaucoup plus faciles pour les utilisateurs de Windows.

Quelques avantages que je vois en utilisant npm:

  • Il est utilisé par tous les autres gestionnaires de paquets (composant, bower, volo, JSPM, etc.);
  • Permet d'utiliser des scripts de construction;
  • De nombreux outils sont disponibles pour l'introspection des packages basés sur npm

npm est le gestionnaire de packages pour JavaScript.

Capture d'écran de npmjs.com


En février 2013, mon opinion était la suivante. Veuillez ne plus en tenir compte.

npm

Il vaut mieux s'y tenir lorsque vous êtes avec un projet Node, il y a très peu de projets qui sont également disponibles pour les navigateurs ...

tonnelle

Bower est le gars de la pop en ce moment. Ils ont beaucoup de projets sous leur capot, et les responsables de projet aiment les tenir à jour dans le registre des bower ...

C'est dommage qu'il soit parfois un peu bogué.

volo

Je n'ai pas essayé volo depuis plus de 5 minutes depuis, mais d'après ce que j'ai pu voir, il semble plus flexible que bower.

Un point négatif pour volo est que leurs projets sont très dépassés.

Gustavohenke
la source
19
Il existe des milliers de modules sur npm qui fonctionnent uniquement dans les navigateurs ou fonctionnent à la fois dans les nœuds et dans les navigateurs. Beaucoup d'entre eux ont même des badges ci qui vous indiquent exactement dans quels navigateurs ils travaillent. Presque tout sur bower et tout est probablement sur npm.
Substack
Je ne comprends pas la nécessité pour un projet comme ngBoilerplate d'utiliser bower alors que cela dépend déjà de npm pour l'installation
lolski
5
Qu'est-ce qu'un "pop guy"? Est-ce que "pop" est un abbrev. pour "populaire"?
Bryan Oakley
4
Dans votre capture d'écran, npm représente le manuel de planification nucléaire;)
Jim Jones
24

Ils semblent résoudre le même problème mais pour des environnements / mondes différents. NPM pour nodejs et volo, bower pour le navigateur.

La vérité est que vous pouvez également utiliser NPM pour gérer javascript et css pour le navigateur. Rien ne vous empêche de le faire. En ce sens, utiliser NPM me semble plus naturel que de devoir gérer deux outils différents dans le même but.

Il semble que bower ait plus de packages disponibles, du moins pour les plus populaires. Mais bientôt jQuery sera également disponible directement dans NPM et probablement toutes les autres bibliothèques suivront la même tendance.

À mon avis, comme il existe des outils comme browserify et webmake , qui aident à utiliser des modules de nœuds dans le navigateur, il n'y a plus vraiment besoin de bower ou de volo , à moins qu'ils n'offrent autre chose pour vous (un module particulier existant uniquement dans leurs registres).

Les deux Volo et Bower sont bons aussi, mais de mon point de vue, si vous utilisez déjà NPM, il pourrait être préférable de s'y tenir.

Veuillez noter que vous pouvez utiliser NPM pour gérer vos dépendances client même sans utiliser browserify ou webmake . Dans la plupart des projets sur lesquels je travaille, une fois les modules npm installés, j'exécute un script pour les déployer à l'emplacement où mon application cliente les utilise. Parfois, j'utilise grunt pour concaténer ce fichier avec d'autres fichiers js et parfois je le référence directement à partir des fichiers de modèle de mes applications Web. Dans tous les cas, c'est une préférence personnelle. D'autres pourraient trouver Bower ou Volo plus faciles à utiliser car ils s'intègrent plus naturellement dans leurs flux de travail.

Roy Riojas
la source
1
Il est bon d'avoir des solutions concurrentes pour le même problème. Toute idée de la raison pour laquelle yeomanProject a choisi de créer un nouveau gestionnaire de packages alors que nous avions déjànpm ? (C'était mature, célèbre et riche en fonctionnalités) Cette pensée me fait sentir que je manque encore le point réel.
Yugal Jindle
1
Pas vraiment, mais comme vous l'avez dit parfois, c'est drôle de réinventer la roue, juste parce que vous le pouvez, et parfois en le faisant, des améliorations sont apportées tout en essayant de résoudre le même problème. Pas vraiment pourquoi ils choisissent d'en créer un nouveau, à part le fait de faciliter la recherche de packages par les développeurs frontend. Tous les développeurs frontend n'ont pas l'expérience des nœuds, je suppose que c'est la principale raison derrière des projets comme Bower. Essayez de faciliter la tâche aux utilisateurs non-nœuds, je suppose ici.
roy riojas
Je suppose qu'ils voulaient séparer les tracas npmen faveur de la simplicité du frontend. Par conséquent pour le développement frontend.
Yugal Jindle
15

Le grand avantage de Bower par rapport à NPM est que sa gestion des dépendances impose l'utilisation d'une seule version d'un composant (alors que NPM fonctionne en ayant différentes copies / versions en tant que sous-dépendances de différents modules). C'est une très bonne chose chose car cela empêche votre javascript côté client de devenir gonflé en ayant besoin d'inclure plusieurs copies d'un composant dans différentes versions. L'inclusion de plusieurs copies d'un module est essentielle au fonctionnement de la gestion des dépendances de NPM, et NPM est donc totalement inadapté à la gestion des packages côté client.

Une conséquence de ce qui précède est que les mainteneurs et les consommateurs de paquets bower doivent être plus attentifs à maintenir leurs numéros de version de dépendance pour éviter les conflits, mais c'est un prix à payer. Et je trouve que les modules NPM sont souvent bâclés dans leur publication de versions majeures, mineures et de correctifs, de sorte que la gestion des dépendances NPM n'est pas non plus un lit de roses.

où rhys
la source
3
Cela n'est vrai que si vous servez votre code frontend directement à partir du dossier dans lequel le gestionnaire de packages a placé ces fichiers. Dans mon cas, j'ai soit un script de construction pour traiter les fichiers less / js, soit browserify pour créer un bundle à partir de ces fichiers. Ce n'est donc pas vraiment un gros problème dans mon cas. Le code distribué a toujours les bonnes versions, même lorsque d'autres sous-composants peuvent avoir des doublons pendant le développement, ils ne parviennent jamais à la production.
roy riojas
même si vous avez besoin par inadvertance (en tant que sous-dépendances) de deux versions différentes de la même dépendance? Je pense que dans ce cas, vous vous trompez
wheresrhys
Je n'ai généralement pas besoin de modules que je ne contrôle pas, donc ils seront toujours les bons ... si par inadvertance un module essaie d'exiger un module donné hors des modules calés, la construction échouera. Aucun intérêt à utiliser Bower dans mon cas, aucun avantage ajouté
Roy Riojas
Ainsi, npm ne peut être dit en toute sécurité d'éviter la duplication de modules dans votre code côté client que si vous avez le contrôle de l'ensemble de votre arbre de dépendances. Ce n'est certainement pas le cas avec la grande majorité des choses sur lesquelles je travaille et probablement pas pour la plupart des projets utilisant un gestionnaire de dépendances pour inclure des modules côté client.
wheresrhys
1
À moins que vous ne travailliez sur des mashups, votre arbre de dépendances ne sera pas si compliqué, du moins pour le code tiers. La plupart des bibliothèques js exportent un seul global, donc en utilisant browserify-shim, vous pouvez vous assurer que vous pouvez les utiliser à partir de la portée globale, donc toujours une version que vous contrôlez. Mon point est que vous pouvez réaliser la même chose sans avoir besoin d'un autre gestionnaire de paquets en plus de celui que vous avez déjà. En fin de compte, cela pourrait être une question de préférences. Il y a toujours des compromis à faire.
roy riojas
5

Je sais que cela ne fait pas partie de la portée de la question, mais il existe également une autre alternative. Jam JS - http://jamjs.org/ Une chose intéressante est qu'il a des capacités de grognement dans la confiture:

jam compile output.js

Quelqu'un devrait créer un autre gestionnaire de paquets et le nommer: yapm :)

Bruce Lim
la source
5
Votre souhait est exaucé: github.com/rlidwka/yapm : P
alex
1
Eh bien, je pensais au gestionnaire de dépendances côté navigateur mais je suppose que cela fonctionne pour les deux: p C'est pourquoi je ne peux pas faire de startups, toutes mes idées ont déjà été pensées.
Bruce Lim
@BruceLim ouais, à chaque fois que nous pensons avoir une bonne idée, il y a toujours d'autres personnes qui l'ont déjà eue.
Evan Hu