React.js 開発環境構築（Sublime Text3設定編）です。
package追加随時更新します。
Sublime Text3 の React.js 開発用 packageインストール
以下のpackageをインストールしておく
- Babel
ReactJS
⇒Sublime Text3のpackageのインストール方法リンク
Sublime Text3 の ReactJS Syntax 設定方法
前提：上記packageがインストールされている事
view->Syntax->Babel->JavaScript(Babel)を選択
以下のreact_test.jsを開いて色がつけばOK
snippetsの確認（ショートコマンドで定型分に展開される）
「rcc」とうってtabを押して展開されればOK
全コマンドはpackage公式参照
https://github.com/facebookarchive/sublime-react
React.js サンプル HelloWorld
index.html
<!DOCTYPE html>
<html>
<head>
<script src="http://fb.me/react-0.13.3.js"></script>
<script src="http://fb.me/JSXTransformer-0.13.3.js"></script>
</head>
<body>
<div id="app"></div>
<script type="text/jsx" src="react_test.js"></script>
</body>
</html>
react_test.js
class HelloWorld extends React.Component {
render() {
return (
<div>
HelloWorld {this.props.name}
</div>
);
}
}
var m = React.render(<HelloWorld name="john" />, document.getElementById('app'));
Pingback: 【エンジニア向け】Macにおすすめのテキストエディタ3選 - hiroエンジニアのNote