JS開発のための最小限の環境:ava、standard、chokidar-cli、およびprecommit-hook

周りにはJavaScriptフレームワーク、ライブラリ、さまざまなツールがいっぱいです。 何を選択しますか? このような多様性を見ると、開発者がこの質問に答えることは容易ではありません。

画像

私は経験から知っています。たとえば、モジュールやコマンドラインツールの作成など、新しいプロジェクトの最初のステップは、作業環境を構成することです。 このステップを好む人もいれば、耐えられない人もいますが、どちらの場合も、予備準備には許容できないほど長い時間がかかります。 特に、すべてを慎重に確認し、すべてのメカニズムをスムーズかつ安定して連携させる必要がある場合。

もちろん、JS開発者の兵器庫にwebpack、eslint、jasmine、さらにはTypeScriptを含めることができます。 このアプローチを使用すると、エラーを見つけて除去するのに問題はありません。 ただし、補助的なタスクのほとんどを解決するには、実際にセットアップする必要のないシンプルなツールが最適です。 それらから収集された環境により、できるだけ早く開始し、コードの正確さを制御し、エラーをタイムリーに通知することができます。

最小のJS環境について考えると、プログラムのテストとコードの分析、作業中のファイルの変更の追跡、バージョン管理システムでトランザクションをコミットする前のプロジェクトの確認という4つのことがすぐに思い浮かびます。

次に、文字通りゼロから、わずか数分で生産的な作業を開始できる開発環境を作成する方法について詳しく説明します。

Node.jsプロジェクトとGitリポジトリの初期化


まず、ディレクトリを作成してそこに移動します。 ここで、 $_コンストラクトは最後のコマンドの引数を格納します。

 $ mkdir awesome-module && cd $_ 

次に、Node.jsプロジェクトをデフォルト設定で初期化します。

 npm init --yes 

フォルダーとファイルを作成する

 $ mkdir lib test $ touch index.js lib/meaningOfLife.js test/index.test.js test/meaningOfLife.test.js 

ここで、Gitリポジトリを初期化し、最初のトランザクションをコミットします。

 $ git init $ git add -A; git commit -am "Awesome Module, day one" 

プロジェクトの構造を準備し、ツールを扱います。

ツールのインストール


4つの単純なモジュールを使用します。各モジュールは、1つの問題を解決するように設計されています。


なぜそれらを選んだのですか? 構成がまったく必要ないという理由だけで。 このアプローチにより、頭の負担が完全に軽減され、開発に関する有用なアイデアへの道が開かれます。 プロジェクトフォルダーで次のコマンドを実行して、モジュールをインストールします。

 $ npm i --save-dev ava standard chokidar-cli precommit-hook 

インストール後(その速度はNPMのムードのみに依存します) .gitignoreファイルを作成し、 node_modulesフォルダーを追加することを忘れないでください。 リポジトリには必要ありません。

プロジェクトのセットアップ


ツール自体を設定する必要はありませんが、それでもプロジェクトを設定する必要があります。 確かに、ここではすべてが非常に簡単です。 package.jsonを開き、次のスクリプトを追加します。

 "scripts": { "test": "ava", "lint": "standard", "dev": "chokidar '**/*.js' -c 'standard && ava'" }, "pre-commit": ["test", "lint"], 

実際、それがすべてです。 npm run dev chokidarを実行するとすぐに、 chokidarはファイルのステータスの監視を開始し、必要に応じて静的分析のstandardを開始し、コードをテストするためのavaを開始します。 問題を見つけた場合、すぐにそれを知ることができます。 リポジトリを変更する場合も同様です。 私たちの環境では、プロジェクトが正常に分析およびテストされるまで、トランザクションをコミットできません。

ここで、2つのことに注意を向けたいと思います。

  1. これらはnodeコンテキスト内から実行されるため、 standardまたはavaグローバルに設定する必要はありません。

  2. 代わりに&&を使用するため; devスクリプトでは、コードが静的アナライザーでテストに合格するまで、テストは呼び出されません。 これにより、作業が高速化されます。

使い方


開発環境は、テスト(TDD)による開発スタイルのプログラミング用に設計されています。 devスクリプトが実行されるとすぐに、テストを作成できます。テストは、ファイル監視ツールを再起動したり、他の操作を実行したりすることなく、コードテストのセットに自動的に追加されます。

最初のテストを作成しましょう。

 // test/meaningOfLife.test.js const test = require('ava') const meaningOfLife = require('../lib/meaningOfLife') test('Real meaning of life', (t) => { t.is(meaningOfLife(), 42) }) 

このファイルを保存すると、システムはテストの1つが失敗したことをすぐに報告します。 修正してください。

 // lib/meaningOfLife.js module.exports = () => 42 

これですべてが正常に機能するようになりました! どこも簡単です。 数値パラメーターを乗算するモジュールを作成します。 すぐに彼の単体テストを準備し、また、新しいモジュールがmeaningOfLife正しく機能するかどうかをmeaningOfLifeます。 ちなみに、これは単体テストではなく統合になります。 モジュールコードは次のとおりです。

 // lib/multiply.js module.exports = (number) => { if (typeof number !== 'number') throw new TypeError('Only numbers can be multiplied!') return number * 2 } 

以下にテストを示します。

 // test/multiply.test.js const test = require('ava') const multiply = require('../lib/multiply') test('Can multiply numbers', (t) => { t.is(multiply(10), 20) }) test('Throws when you try to multiply non-number value', (t) => { t.throws(() => multiply('ohai!'), 'Only numbers can be multiplied!') }) 

次に、すべてを一緒にテストします。

 // test/index.test.js const test = require('ava') const awesomeModule = require('../index') test('Works nicely together', (t) => { t.is(awesomeModule(), 84) }) 

そして、以下をindex.jsに追加します。

 // index.js const meaningOfLife = require('./lib/meaningOfLife') const multiply = require('./lib/multiply') module.exports = () => multiply(meaningOfLife()) 

テストに合格しました! ご覧のとおり、ツールがシンプルであるため、私たちはプロジェクトの作業をすぐに開始し、環境の準備にほとんど時間を費やしませんでした。

まとめ


新しいきらめくツールは、多くの場合、文字通りプログラマーに催眠術をかけ、主なものを忘れさせます。 そして、主なことは、作業を簡素化および高速化し、エラーと戦うことです。 通常、見かけよりもはるかに頻繁に、最も単純なツールでこれらの問題を解決できます。 補助システムをセットアップするのではなく、プログラムの作成に時間を費やすことができるもの。

プロジェクトが成長し始めると、ava、standard、chokidar-cli、precommit-hookの単純な組み合わせよりもはるかに高度なものが必要だと感じるかもしれません。 しかし、ほとんどの場合、他に何も必要ありません。 そして、私が話したこれらのシンプルで理解可能なツールは、非常に長い間、忠実にあなたに仕えます。
また、どのような環境でプログラムを作成しますか?

Source: https://habr.com/ru/post/J317238/


All Articles