コンポーネント。 作る&見る

コンポーネントノートの先頭



メイクvs. うなり声対 ガルプウォッチ





タスクランナー-ファイルの変換プロセスを自動化するユーティリティのクラス。 Make、Rake、Cakeなど、たくさんあります。 通常実行されるタスクは非常に重要であり、頻繁に、そして非常に頻繁に行われます。 コンパイル、テストの実行、ファイル形式のレンダリングと変換、jsファイルの縮小、CSS変換。 毎日の仕事に非常に重要なこと。







うなり声 (うなり声)。 Gruntfile.jsは、gruntユーティリティの構成ファイルです。 Gruntfile.jsは直感的です。サンプルを見るだけで、タスクに似たサンプルを作成できます。 しかし、gruntfile.jsは非常に見苦しく、加えて、gulpの著者はgrunt



非常に非効率的だと書いています。 gruntfile.js



書き込みと読み取りは、すぐに非常に退屈になります。



gulp (「新鮮な空気」の息)。 gruntfile.jsとは異なり、gulpfile.jsは構成ファイルではなく、node.js上のプログラムです。 2つのファイルの比較を参照してください。 はい、はるかに便利でおなじみです。 さらに、gulpプラグインがその役割を果たします。 たとえば、jsファイルを縮小するには、2つのプラグインを呼び出す必要があります。1つはファイルを縮小し、もう1つはファイルの名前を.min.jsに変更します。 これは正しいです。 しかし、guplfile.jsのサイズはgruntgile.jsほど小さくなく、10回目は同様に退屈なプロセスを作成します。 それにもかかわらず、好みの問題ですが、私見でgulp



、gulpはうなり声よりもはるかに便利です。



Makeは素晴らしく強力ですが、Makefileには非常にわかりにくいという欠点があります。 完全で、非常に詳細でドライな説明- 教科書があります。 または、プログラミング言語がなく、C言語がまだ開発中であった最後の千年紀の1960年代と同じテキストを語る多くのマニュアル。 これらのコケむしたCの例は語り直しです。 ただし、Makefileは把握できます。 これはあなたがgrunt



声とgulp



を忘れることができます。 コンポーネントコミュニティとノードコミュニティでは、 Makefile



非常に人気があるため、ここで説明します。



メイクファイルの概要





make



は、あらゆるシェルコマンドを実行し、あらゆるタイプのファイルを処理できます。制限はありません。 唯一のもの-チームがスペースではなく、タブでなければなりません。 (それにもかかわらず、過去千年、人々は強かった)。 別の注意-スペースを含むファイル名に関する苦情があります。



file



は、変数とルールの説明で構成されます。



ターゲットルール





Makefileのターゲットルールは次のように構成されています。



 target: sources tab -> commands tab ->tab -> commands, .    
      
      







ここでtarget



は取得する必要があるもので、sourcesはソースファイルの配列です。 通常、 target



は特別なPHONY



ターゲットを除き、単なるファイルです(以下を参照)。



make



でエラーmake



発生した場合、中止します。 (オプション-iはエラーを無視します)。



make



mtime



make



使用します-ファイルが最後に変更された時刻。 target



は、まず、すでに存在し、次にソースよりも新しい場合、準備ができていると見なされます。 したがって、makeは変更されたファイルのみを処理します。



make



は、指定されたルールのターゲットターゲットで始まります。 パラメーターなしでmakeを呼び出す場合、これが最初のルールです。 ソースを調べ、独自のルールがある場合は、再帰的にチェックします。 配列内のソースを処理する順序は任意です!



make



は、完成したターゲット、ソースを持たないターゲット、またはそのソースが独自のルールを持たないものを見つけるまで、ソースチェーンをたどります。 彼はそのようなケースを見つけると、再帰チェーンに沿って戻り、適切なコマンドを実行します。 make



は、各ソースに対して再帰チェーンを作成します。



ルールは空の文字列で区切る必要があります。



パターンルール





パターンルールは、特定の拡張子で何をすべきかを記述し、次のようになります。



 %.js: %.html @component convert $<;
      
      







偽のルール





偽のルールはファイルではなく、コマンドです。 ソースコード、再帰、およびその他のルールを持つすべてのものを使用できますが、mtimeは計算されません。 例:



 clean: rm -fr build components $(TEMPLATES) .PHONY: clean
      
      







偽のルールは特別な変数.PHONY



記述される必要があります



変数の説明





自動的に事前定義された変数があり、それらを理解する必要があります。 一般的な$ @-ターゲットの名前、$ +-スペースで区切られたすべてのソース、$ <; -最初のソースの名前。 チュートリアルの全リスト-http ://www.gnu.org/software/make/manual/make.html#Automatic-Variables



通常の変数(処理が必要なファイル、ソースにファイルがあるターゲット)-単純にリストできます



 JS = index.js example.js
      
      







しかし、シェルを使用してそれらを計算すると便利なことがよくあります。



 CF = $(shell find templates -name "*.coffee")
      
      







または、組み込みのワイルドカードユーティリティを使用します。



 SRC = $(wildcard client/*/*.js)
      
      







または、作成済みの変数からtargets



を定義します。



 HTML = $(JADE: .jade=.html)
      
      







後者の場合、htmlファイル自体はまだ作成されていませんが、さらに処理するための名前の配列のみが作成されています。



変数とルールの設定例:





 SRC = $(wildcard client/*/*.js) HTML = $(wildcard client/*/*.html) TEMPLATES = $(HTML:.html=.js) build: components $(SRC) $(TEMPLATES) @component build components: component.json @component install %.js: %.html @component convert $<;
      
      







ここで何が起こっていますか? makeという名前のコンポーネントを検出し、そのようなディレクトリを検出し、component.jsonファイルに変更を加えるとインストールされます。



彼はJSファイルの配列であるSRCに進みます。 最初の.jsファイルの「ソース」を調べ、.jsのパターンルールを見つけて、.htmlソースから実行します。 次に、すべてを単一のbuild/build.js



に収集し、 component build



component convert



参照しcomponent build







別の例:



 JADE = $(shell find templates -name "*.jade") HTML = $(JADE:.jade=.html) all: $(HTML) %.html: %.jade jade < $< > $@
      
      







パターンルールの例は、コーヒー、ヒスイを処理することです。



 %.js: %.coffee @coffee -c $< %.js: %.jade @jade -c $<
      
      







当然、 coffee



jade



ユーティリティをシステムにインストールする必要があります。



見る





watchはコンポーネントではなく、node.jsユーティリティではなく、通常のUNIXユーティリティです。 (たとえば、 Altlinuxにないのは奇妙です)。



クローンを作成して配置します。



 $ PREFIX=~ make install
      
      







make



を実行しmake







 $ watch make &;
      
      







ソースの変更を追跡し、 grunt



自動再コンパイルするために必要なことと比較してください。 gulp



この機能はプラグインではなくカーネルに組み込まれています。 しかし、 gulpfile.js



実行するのは簡単ではありません。 サンプルコードを提供したくはありません。



Makefileでは、監視ユーティリティなしで同じものを整理できます。



 .PHONY: continuously continuously: while true; do make 1>/dev/null; sleep 3; done
      
      







継続する



All Articles