タスクランナーを使用する利点

コードを使用したことがある場合は、「Keep it DRY」（「Don’t Repeat Yourself」）というフレーズを聞いたことがあ 言い換えれば、タスクを繰り返し実行する必要がある場合は、より効率的に行う方法を見つけてください。

新しいプロジェクトの開発を始めると、イメージの最適化、コードの縮小、ファイルのコンパイルなど、同じことを何度も繰り返していることがよくあ いくつかのケースでは、私たちは分に数回自分自身を繰り返していました。 これらのタスクの時間コストは、変更を加えたり、新しいファイルを作成したりするとすぐに加算されます。

それはひどく非効率的です。 それは私たちの指やキーボードのキーに摩耗や涙を追加することは言うまでもありません。 タスクランナーは助けるためにここにいます！

タスクランナーとは何ですか？

タスクランナーは文字通りそれを行います…彼らはタスクを実行します。 コーダーは、タスクランナーが実行するタスクを指定することができ、それは彼らのためにすべての作業を行います。

タスクランナーの前に、Sassをコンパイルし、Autoprefixerを実行し、変更を加えるたびに結果のCSSを縮小する場合は、各タスクを個別に完了する必要があります。 当然のことながら、それは本当に迅速に迷惑になるだろう。 あなた自身を繰り返す非常に多くの時間を無駄にすることは言うまでもありません。 楽しくない。

タスクランナーを使用すると、完了したいタスクを指定して一度実行すると、すべての作業が実行されます。 時間を節約し、お金を節約し、世界を救う（多分？).

そこにはたくさんのタスクランナーがいます：ブランチ。js、Gulp。jsブロッコリーjs、ケーキ。js、およびうなり声。js、ちょうどJavascriptで構築されたいくつかの名前を付けます。 はい、彼らの名前はあなたの誕生日の間に何かのように聞こえます（ブロッコリーを除いて、それは悲しい誕生日のように聞こえます）が、一年中これらを使

選択したタスクランナー

Gruntを使用することを選択しました。js”を発表した。 これは、市場で最も広くサポートされており、人気のあるタスクランナーです。 これは、Javascriptオブジェクト内のタスク設定を含むGruntfileを読み取ることによって機能します。 次に、ターミナルでコマンドを実行して、実行するタスクを指定します。 簡単なpeasy。

実行しているタスクに応じて、Gruntfileは単純または堅牢にすることができます。

一般的なGruntfilesは次のタスクを実行します:

CSS

• SassをCSSにコンパイル
• 新しいCSSでAutoprefixerを実行して、見逃している可能性のあるベンダーの接頭辞をキャッチします
• 接頭辞付きCSSを縮小します
• 新しいタイムスタンプ情報でCSSバナーを更新します

Javascript

• javascriptでエラーをチェック
• 他の含まれているスクリプトを一つのファイルに連結
• エラーを再チェック
• スクリプトを縮小

画像

• jpg、gif、またはpngを最適化してファイルサイズを小さくする

その他のユーティリティ

• 変更のためのファイルを監視し、必要に応じてタスクを再実行
• 一度に複数のブラウザやデバイスでテストするためのBrowserSyncを実行

これらのタ 私たちがしなければならないのは、一つの簡単なコマンドを実行:

$ grunt

魔法のように、この1つのコマンドは私たちのすべてのタスクを実行し、自分自身を繰り返すことから私たちを救います。

Gruntの詳細については。js、彼らのドキュメントをチェックして、Gruntfilesを見始めてください。