Node for MaxでTypeScriptを使う

つくったもの

Node for Max向けに簡単なTypeScriptの開発環境を作りました。

エディター

Max APIの型定義が効いているので、快適に開発ができます。

ソースコード: github

機能

ts-nodeモード

Max 8.0.4のアップデートで node.script にCLIオプションが渡せるようになりました。

これによって、 nodeの-rオプションが使えるようになったので、ts-node/registerを使うことができます。

つまり、.jsを吐かずにTypeScriptを実行できて、REPLとかもできちゃうし、 ファイルを吐き出す時間がないので、小さなプロジェクトなら実行にかかる時間もjsとほとんど変わらずサクサクです。

tscモード

tscを使ってトランスパイルしたファイルを通常通りに吐き出せるようにもしてあるので、ts-nodeが嫌いな人はそちらで。

ボイラープレートの構成（省略版）

├── @types
│ └── max-api.d.ts <-- MaxAPIの型定義ファイル
├── index.ts <-- ts-nodeモードのエントリーポイント
├── lib/ <-- tscしたらここに入る
├── main.maxpat <-- Maxはこれを開く
├── node_modules
├── package.json
├── run-transpiled.js <-- tscモードの時のエントリーポイント
└── tsconfig.json

ボイラープレートについて

メインのMaxファイルがこんな感じで、

これに対応するコードが

index.ts

import * as MaxAPI from 'max-api'
import * as fs from 'fs'
import { say } from 'cowsay'
import { Log } from './utils'

enum actionTypes {
  LIST_FILES = 'list-files',
  SAY = 'say'
}

MaxAPI.addHandler(actionTypes.LIST_FILES, () => {
  fs.readdir(process.cwd(), (err, files) => {
    if (err) {
      MaxAPI.post(err.message, "error")
    }
    const text = say({
      text: 'Node for Max is Awesome!'
    });

    Log(...files)
    MaxAPI.outlet(...files, text)
  })
})

MaxAPI.addHandler(actionTypes.SAY, (...whatever: string[]) => {
  const text = say({
    text: whatever.join(' ')
  })
  Log(text)
  MaxAPI.outlet(text)
})

こんな感じ。（サンプルがcowsayかよというツッコミはさておき、、）

で、umenuから ts-node を使うか tsc を使うか選択すると、

こんな感じでスイッチングされる。
node.script の @options に渡しているのがそのままnodeに渡されるのでこれはつまり

node -r ts-node/register index.ts

ということ。 （-r オプションは指定したライブラリを実行前にrequireしてくれる）

tscモード の場合は右の node.script run-transpiled.js （※.jsに注目)が実行される。

これは単純に、

run-transpiled.js

/**
 * @description This file should only be called after source code is transpiled.
 * @author Yuichi Yogo
 */
require('./lib/index')

lib/ にtscでトランスパイルしたjsファイルが入ることが期待されているので（そこの同期処理はMaxパッチ側で書いてある）、それをシンプルにrequireするだけ。

まとめ

今回のボイラープレート作成にあたり、Max APIの型定義ファイルをCylclingがpublishしていないので、自分で用意しました。
とても不便なのでcycling '74にお願いしておきました。（対応してくれるかどうかは知らない）

そのうちnpm installで最新の型が手に入るようになるといいですね！