web-dev-qa-db-ja.com

npm、bower、gulp、Yeoman、およびgruntは何に適していますか?

私はバックエンド開発者であり、npm、bower、gulp、grunt、およびYeomanによって少し混乱しています。私が誰かに彼らの目的が何であるかを尋ねるときはいつでも、答えは依存関係マネージャーに要約される傾向があります-それらのすべてのために。確かに、同じことをする4つの異なるツールは必要ありませんか?

誰かがこれらのそれぞれの利点を説明してくださいできるだけ少ない文で-可能であれば、ツールごとに1つだけ、5歳の(開発スキルを持つ)が理解できる言語を使用して?

例えば:

  • [〜#〜] svn [〜#〜]ソースコードへの変更を保存、管理、追跡します

私は過去にMaven、Jenkins、Nexus、Antを使用しました。上記のツールをこれらと比較できますか?

また、他のフロントエンドツールをリストに追加してください。

ここに私がこれまでに発見したものがあります-しかし、それが正しいかどうかはわかりません:

  • bowerフロントエンド開発/ JSライブラリの依存関係マネージャー、フラットな依存関係リストを使用
  • npm node.jsサーバーの依存関係マネージャー、推移的な依存関係/依存関係ツリーを解決できます
  • grunt Jenkinsによく似たタスクを実行しますが、コマンドラインでの局所性
  • ヨーマン提供された足場、すなわちスケルトンプロジェクト
  • gulp gruntと同じですが、jsのみで記述されています
  • node.js jsアプリのサーバー?
  • git分散SCM/VCS、svn/cvsに対応

近いですか? :)

30
Christian

あなたは近いです! JavaScriptへようこそ:)

簡単な説明と、ほとんどの開発者がある程度の時間を費やす機能の1つを紹介します。

bowerブラウザーで使用されるパッケージに焦点を当てます。各bower install <packagename>は、インクルードするファイルを1つだけ指します(さらに多くのファイルをダウンロードできます)。 webpack、browserify、およびbabelの成功により、ファーストクラスの依存関係マネージャーとしてはほとんど使用されなくなりました。

2018年の更新:バウアーはNPMを支持してほとんど廃止されました

npm歴史的にNodeJSコードに焦点を合わせていましたが、ブラウザーモジュールに対するお辞儀を覆しました。だれにもだまされないでください。NPMは巨大です。また、NPMは多くのファイルをプロジェクトにロードします。新しいnpmをインストールすることは、常に新しいコーヒーをれる良い理由です。 NPMは簡単に使用できますが、バージョンを参照する方法がゆるいため、モジュール公開のenvironments意性のために、環境を変更するとアプリが破損する可能性があります。リサーチ シュリンクラップ およびnpm install --save-exact

2018アップデート:NPMが成長しました!安全性と再現性に関する多くの改善が実施されました。

gruntタスクの自動化を促進します。古くてやや緩慢な兄弟をむさぼり食う。 JavaScriptコミュニティは、2014年に彼とよく付き合いました。 Gruntは既にいくつかの場所でレガシーと見なされていますが、まだ非常に強力な自動化が数多く発見されています。構成は、大規模なユースケースでは悪夢のようです。 しかし、そのための不機嫌なモジュールがあります。

2018更新:grりはほとんど廃止されました。簡単に記述できるWebpack構成は、それを殺しました。

gulpうなり声と同じことをしますが、より高速です。

npm run-scriptタスクランナーはまったく必要ないかもしれません。 NodeJSスクリプトは非常に簡単に記述できるため、ほとんどのユースケースではカスタマイズされたタスク自動化ワークフローが可能です。 npm run-script を使用して、package.jsonファイルのコンテキストからスクリプトを実行します

webpackwebpackをお見逃しなく特に、JavaScriptを一貫したモジュラーコードに記述する多くの方法で迷っている場合。 Webpackは、.jsファイルをモジュールにパッケージ化し、見事にパッケージ化します。 Webpackは拡張性が高く、優れた開発環境も提供します。 webpack-dev-serverbabel と組み合わせて使用​​しますこれまでで最高のJavaScriptエクスペリエンスを実現します。

Yeoman足場。プロジェクトアーキテクチャの制御可能な共通基盤を提供するため、さまざまな背景を持つチームにとって非常に貴重です。足場用の scaffolding もあります。

44
Mirko

それで、それぞれが何であるかをよく知っているので、簡単なワークフローを提供します。

  1. yeomanを使用して、基本的なスケルトンを作成します。
  2. nodeをアプリケーションのランタイムとして使用しています。すなわち。実行node appname
  3. npmを使用して、ノードにアプリケーションを作成するためのノードモジュールをインストールします
  4. フロントエンドライブラリのようなbowerのコンポーネントが必要な場合があるため、bowerを使用してこれらを取得します。
  5. ここでいくつかの反復的なタスクを実行するために、いくつかのタスクを作成するためにgruntまたはgulpを使います。ですから、繰り返したいと思うときはいつでも、私がgrunt/gulpと呼ぶjsファイルを最小化し、それを実行させるように言ってください。違いは、Gulpはストリームベースで、Gruntはタスクベースです。
  6. gitを使用してバージョン管理を行い、変更を追跡します
7
JoviaArk

詳細を追加しました:

npmはjavascriptのパッケージマネージャーで、npmはnodejsのパッケージエコシステムですが、フロントエンドプロジェクトでのみ使用できます。

gruntgulpは、ミニファイ、コンパイル、コマンドラインでのユニットテストなどのタスクを分離および自動化するのに役立ちます。プロセスは分離された(通常は軽量の)コマンドライン/プロセスであるため、(たとえば)Visual Studioよりも優れています。

gulpgrunt、およびbowerの違いについては、すでにチケットがあります: Grunt、Gulp.js、およびBowerの違いは何ですか?なぜ、いつ使用するのですか?

Nodejsはjavascriptruntimeです。 Node.jsでは、jsと、さまざまなコア機能やその他のコア機能を処理する「モジュール」のコレクションを使用して、Webサーバーとネットワークツールを作成できます。 ソース

このチケットは、GitとSubversionの違いを再開します。 なぜGitはSubversionよりも優れているのですか?

1
Giu
  1. Gulp vs Grunt:Gulpはタスクの自動化により柔軟性を提供します。Gruntは、一般的な開発プラクティスに従って多くの機能を備えています。 GruntとGulpには2つの主な違いがあります。

    • Gruntは構成に焦点を当て、Gulpはコードに焦点を当てています
    • Gruntは組み込みの一般的に使用される一連のタスクを中心に構築されましたが、Gulpは何も強制しないというアイデアを思いつきましたが、コミュニティで開発されたマイクロタスクはどのように相互接続する必要がありますか こちらから

  1. NodeJS:ノンブロッキングサーバー側スクリプト言語です。つまり、現在の操作が終了するまで、操作はそれ以上の実行をブロックしません。

  1. Git:あなたが言ったように、それはSCMツールであり、広く使用されています。 GitHubドキュメントによると、データが削除されることはないため、他のSCMツールとは異なります。

    Gitは、データをミニファイルシステムのスナップショットのセットのように考えています。コミットするたび、またはGitでプロジェクトの状態を保存するたびに、基本的に、その時点でのすべてのファイルの外観を撮影し、そのスナップショットへの参照を保存します。

    Gitでアクションを実行すると、それらのほとんどすべてがGitデータベースにデータを追加するだけです。システムに元に戻せないことをさせたり、何らかの方法でデータを消去させることは非常に困難です。他のVCSと同様に、まだコミットしていない変更を失うか台無しにすることができます。ただし、スナップショットをGitにコミットした後、特に定期的にデータベースを別のリポジトリにプッシュする場合、失うのは非常に困難です。

    続きを読む


  1. Bower対NPM:BowerとNPMは依存関係マネージャーですが、Bowerモジュールはフロントエンド開発用です。 NPMは、NodeJSバックエンドで使用されるモジュールの膨大なコレクションです。 このSO答えはより適切にカバーしています
1