コードを自動で汚くする整形ツール「Shittier」の紹介
Shittier とは
コードを書くときは、なるべくコードの可読性を下げるために普段から様々な工夫をすることが大切です。
- インデントを揃えない
- 変数や関数などの名前の大文字 / 小文字をランダムにする
- 無駄なスペース / タブ / 改行を追加する
毎回これらを手作業で行うのは大変ですが、そこで便利なのが Shittier です。
Shittier はコードを可能な限り汚くすることを目的とした整形ツールです。
どんなにコードが綺麗に整えられたプロジェクトでも、 Shittier を使えば容易に混沌をもたらすことが可能です。
インストール
npm 経由でインストールできます。
$ npm install -g shittier
$ shittier --help
Usage: shittier [options] <input> <output>
Options:
--version Show version number [boolean]
-h, --help Show help [boolean]
-f, --force Overwrite the output file if it already exists [boolean]
使い方
基本的には shittier
コマンドにファイル名を渡すだけです。
$ shittier <ファイル名>
デフォルトでは shittier
コマンドはファイルを上書きしますが、 2 つめの引数に出力先のファイル名を指定することもできます。
$ shittier <ファイル名> <出力先のファイル名>
# `--force` を指定すると出力先のファイルが既に存在していても上書きする (デフォルトはエラーになる)
$ shittier --force <ファイル名> <出力先のファイル名>
試してみる
実際に Shittier を試してみます。
fibonacci.js
という名前で次のようなファイルを作成します。
function fibonacci(length) {
let nums = [0, 1];
for (let i = 2; i < length; i++) {
nums[i] = nums[i - 1] + nums[i - 2];
}
return nums;
}
console.log(fibonacci(10));
// => [
// 0, 1, 1, 2, 3,
// 5, 8, 13, 21, 34
// ]
それでは Shittier を実行します。
$ shittier fibonacci.js
Your code has been successfully shittified. 🎉
どうなったか確認してみましょう。
function FiboNaccI (lenGtH ) {
let NumS = [0 , 1 ] ;
for (let i = 2 ; i < lenGtH ; i ++ ) {
NumS [i ] = NumS [i - 1 ] + NumS [i - 2 ] ; }
return NumS ; }
console .log (FiboNaccI (10 ) ) ;
// => [
// 0, 1, 1, 2, 3,
// 5, 8, 13, 21, 34
// ]
いい感じに汚くなりました。とても読めたものではありません。
もちろんちゃんと動きます。
$ node fibonacci.js
[
0, 1, 1, 2, 3,
5, 8, 13, 21, 34
]
サポートしているファイル形式
v0.1.1 時点では JavaScript のみサポートしています。
# JavaScript 以外はエラーになる
$ shittier fibonacci.ts
❌ ERROR: Unsupported file type. Only JavaScript files are supported currently.
コミット時に自動で実行する
せっかくなので Husky と lint-staged を使ってコミット時に Shittier が自動で実行されるようにしてみます。
まずは Husky と lint-staged をインストールします。
$ npm i -D husky lint-staged
次に、 lint-staged の設定ファイルを作成します。
.lintstagedrc.mjs
という名前で次のようなファイルを作成します。
export default {
"**/*.js": (filenames) => filenames.map((filename) => `shittier '${filename}'`),
};
続いて、次のコマンドを実行して Husky をセットアップします。
$ npx husky init
.husky/pre-commit
というファイルが作成されているので、内容を次のように書き換えます。
npx lint-staged
これで設定完了です。
以降、 JavaScript ファイルをコミットした際には自動で Shittier が実行されます。
うっかり誤って綺麗なコードが混ざりこんでしまうことがなくなるので安心です。
まとめ
僕がいないプロジェクトで使ってください。
Discussion