JavaScript
cli

テンプレートを置いたら CLI コマンドに追加されて、フラグ渡したりでファイル作る感じのツール

新しいの作るたび最初にあれこれ設定ファイル(*.json, .*rc)を用意すると思いますが、あんましググらずに用意できたことがないなと思って。この辺やっぱり CLI で作れたら楽かな思ったので、mozaとかいうの作りました。

流れ

  1. ./.moza/~/.config/moza/ディレクトリに*.hbshandlebars)ファイルを置く
  2. その頭にフロントマターを記述(yargsoptions形式)
  3. その下にhandlebarsで適当にテンプレートを書く
  4. コマンド実行でテンプレートを展開してファイル作成

プロジェクト固有なのは./.moza/*.hbsみたいな

インスト

npm i -g moza
# yarn global add moza

実行。

moza
# npx moza

こんなファイルを./.moza/下に置く。

tsconfig.hbs
---
CONFIG:
  description: description
  usage: usage
NOTE: |
  `preact`や`ink`を使う場合は、`--jsx-factory`に`h`を指定
lib:
  alias: l
  default:
    - es2016
    - es2017
    - es2017.object
target: es6
jsx:
  default: false
  type: boolean
jsxFactory:
  default: React.Component
  type: string
  choices:
    - React.Component
    - h
module: commonjs
---

{
  "compilerOptions": {
    "target": "{{target}}",
    "module": "{{module}}",
    "lib": [
      {{#each lib}}
      "{{this}}"{{#unless @last}},{{/unless}}
      {{/each}}
    ],
    {{#if jsx}}
    "jsx": "React",
    "jsxFactory": "{{jsxFactory}}",
    {{/if}}
    "strict": true,
    "sourceMap": true
  },
  include: [
    "./src/**/*.ts",
    "./src/**/*.tsx"
  ]
}

すると、tsconfig.hbsというファイルだったので、tsconfigというコマンドが使えるようになっています。またCONFIGNOTE以外は KebabCase に変換されてフラグで渡せるようになってます。

moza --help
#
# Commands:
#   tsconfig
#

moza tsconfig --help
#
# Variables:
#   --lib, -l                       [default: ["es2016","es2017","es2017.object"]]
#   --target                                                      [default: "es6"]
#   --jsx                                               [boolean] [default: false]
#   --jsx-factory
#          [string] [choices: "React.Component", "h"] [default: "React.Component"]
#   --module                                                 [default: "commonjs"]
#

  • CONFIG.descriptionにはtsconfigコマンドの説明。
  • CONFIG.usageには--help時に表示される使い方。
  • NOTEにはmoza note tsconfigみたいにした時に表示できるテキスト。(npm i ...............みたいなの書く想定で…)

あとはmoza tsconfig [flags] <dest-path>みたいな感じで生成だけです。

1つ注意で、type: arrayなフラグがある場合は<dest-path>の前に--が必要です。

moza foo --value 0 --value 1 --value 2 -- foo.json

Kapture 2017-10-08 at 7.22.32.gif

以上!

その他

リモートにあるテンプレートファイルを取ってくる

例えばgistとかから。

moza add <url> --output foo.hbs # ダウンロードして ./.moza/foo.hbs へ作成
moza add -g <url> -o foo.hbs    # 〃 ~/.config/moza/foo.hbs

持ってるテンプレートファイル一覧を見る

パスも表示されるので削除するときとか。

moza ls    # ./.moza/*
moza ls -g # ~/.config/moza/*

ノート表示

moza note <command>