日本語 Home
詳しくは、examplesを見てください。
ソースコードからソースコードへのリアルタイムコード生成。 あなたのエディタを監視して、リアルタイムにコードを生成します。
変更したファイル名が一致すると、単一のBabelPluginを実行し、それをコードへと反映します。
- エディタにロックインされません。AtomでもVSCodeでも使えます。
- s2s自体にロックインされません。単なるBabelPluginを書くだけで拡張できます。
もし、あなたの会社やプロジェクトでs2sを使っている場合は、プルリクエストを送ってリストに追加してくださると嬉しいです。(アルファベット順でお願いします)
では、本当に小さいサンプルから始めましょう。 しかし、s2sの力を知るには十分です。
はじめに取り組むのは、以下のように、Flowの型情報を利用して、変数の初期化を自動で行うサンプルです。
レポジトリをクローンし、依存をインストールしてください。
$ git clone --depth=1 git@github.com:akameco/s2s.git
$ cd examples/getting-started
$ yarn
// or npm install
ルートにあるs2s.config.jsを確認してください。
これが、s2sの設定ファイルです。
watchで監視するディレクトリを指定し、pluginsは配列を指定します。
もし、webpackに馴染みがあれば似たように書けるでしょう。
詳しい設定については、Configを確認してください。
module.exports = {
watch: './**/*.js',
plugins: [
{
test: /.*.js$/,
plugin: ['s2s-variable-initializing'],
},
],
}s2sの前にflowを実行しておく必要があります。
$ yarn run flow
そして、s2sを起動します。
$ yarn run s2s
src/index.jsをエディタで開いて、var user: Userと入力し保存してください。
初期値が自動生成されましたか？
これで、クリックスタートを終わります。 ご苦労様でした。
複数のプラグインを組みわせると、より力を発揮します。 以下の例は、Actionの型を定義すると、Actionの定数、アクションクリエイター、reducer、reducerのテストをそれぞれ生成します。
もっと多くの情報が必要ですか？ Examplesを確認してください。
reduxとflowtypeを組み合わせた例。
ショッピングカート (redux+flowtype+s2s)
- babel-plugin-s2s-action-types
generate redux action types - babel-plugin-s2s-action-creater
generate redux action creater - babel-plugin-s2s-action-root
compose flow + redux action types - babel-plugin-s2s-state-root
compose flow + redux state types - babel-plugin-s2s-reducer-root
compose redux reducer - babel-plugin-s2s-reducer-test-case
create reducer test using switch/case
どのような貢献でもウェルカムです。
また、このレポジトリは、all-contributorsSpecに従って運用しています。
あたながコードとテストを書いて貢献した場合、以下のコマンドを打ってください。
$ yarn run all-contributors GitHubのアカウント名 code,test
また、ドキュメントの追加や修正を行った場合は以下のコマンドです。
$ yarn run all-contributors GitHubのアカウント名 doc
詳しくは、all-contributorsを参照してください。
どのような貢献でも待っています。