Redux単体で動作する環境を作る

taktamur

Reduxのソースを読むために、まずはReduxだけを動かす環境を作ります。
Reduxのgithubには、"The Gist"として、Redux単体で動かすサンプルコードが載っています。このサンプルコードを動かすまでを目標とします。

基本的にはNode.jsのプロジェクトを作成して、そこにreduxをインストールします。ただ、"The Gist"がES6のimportの書き方をしているので、これを解釈できるようにbabel-cliとbabel-preset-envも一緒に入れて、babel-nodeで起動できるようにします。

まずは、空のディレクトリを作成して、redux babel-cli babel-preset-env をインストールします。

$ mkdir redux-simple2 
$cd redux-simple2
$echo "{}" > package.json
$ npm install redux babel-cli babel-preset-env --save

次に、package.jsonにscript/startを追加します。

$ cat package.json
{
  "dependencies": {
    "babel-cli": "^6.26.0",
    "babel-preset-env": "^1.7.0",
    "redux": "^4.0.1"
  },
  "scripts": {  // ここを追加
    "start": "babel-node --presets babel-preset-env index.js" 
  }
}

最後に、index.jsに"The Gist"をコピペします。
この状態で npm start すると、babel-nodeがES6なindex.jsを解釈して起動します。

$ npm start

> @ start /Users/tak/proj/redux-simple2
> babel-node --presets babel-preset-env index.js

1
2
1

Ultimate版のIntelliJは、JavaScriptのデバッグ実行が可能です。babel-nodeの引数に$NODE_DEBUG_OPTION を追加する事で、IntelliJでのデバッグ実行ができるようになります。

"start": "babel-node $NODE_DEBUG_OPTION --presets babel-preset-env index.js"