フロントエンドのCLI開発環境を整える

Node.jsの開発環境を中心に解説していきます。具体的には、shelljs,shelljs-nodecli,eslintなどを使います。

shelljsは、Shell上からNodeコマンドなどをCLIから使いやすくしてくれるツールです。読み込むことで特定の書き方ができたりします。

shelljs-nodecliは、shelljsと連携して書き方が分かりやすく出来ます。shelljs拡張機能です。

eslintは、言わずと知れたjsの構文チェックツール。

各ツールの基本的な使い方を紹介します。

$ npm i shelljs-nodecli eslint shelljs
$ npm init --scope=linclark
$ sed -i "" '$d' package.json
$ echo '
,"bin": {
    "eslintt": "bin/test.js"
  }
}' >> package.json
$ mkdir bin
$ vim bin/test.js

こんな感じでパスにリンクを貼って実行できます。ここではeslinttコマンドを発行。

次に、shelljs-nodecliを使ってeslintによるfoo.jsのチェックを行います。

bin/test.js

#! /usr/bin/env node
var nodeCLI = require("shelljs-nodecli");
var version = nodeCLI.exec('eslint', '-v', {silent:true}).output;
console.log(version);
nodeCLI.exec('eslint', 'foo.js');

設定ファイルは、通常はProject Rootに置きます。node_modules/shelljs-nodecli/.eslintrcもチェックしておきましょう。

.eslintrc

{
    "parser": "esprima",
    "rules": {
        "semi": "error"
    }
}

foo.jsはわざと末尾の;を忘れて作ります。そして、チェックを開始。想定通りエラーを出します。

$ npm link
$ echo 'var foo = "foo"' >> foo.js
$ eslintt
/path/to/foo.js
  1:5   error  'foo' is defined but never used  no-unused-vars
  1:16  error  Missing semicolon                semi

✖ 2 problems (2 errors, 0 warnings)

$ echo ';' >> foo.js
$ eslintt
...ok