これを見ればReactの環境がパパッと整うので、自分のメモとしても役に立つかなと考えたのでまとめました。

React

まずはこれですね。

Reactを使うまでにはいろいろ設定をしなければならないのですが、

sudo npm install -g create-react-app

でインストールして、

create-react-app ???

としたら、だいたいの環境が完成しています。

(上記は、version 4以上のNode.jsが入っていることが前提となっています)

ちなみに、???のところは自分の好きなディレクトリ名を記入してください。

できたら一度

cd ???
npm start

として、無事にページが立ち上がるかを確認してみて下さい。

Babel

create-react-appを使って環境構築したならば、すでに入っています。

トランスコンパイラをTypeScriptでも使いたい場合は、

npx create-react-app ??? --typescript
cd ???
npm install -D typescript @types/node @types/react @types/react-dom @types/jest

としてみて下さい。

文字通りきれいにしてくれます。

npm install prettier --save-dev

これもcreate-react-appを使って環境構築したならば、すでに入っています。

便利。

create-react-appを使って環境構築したならば、またしてもすでに入っています。

Enzymeをreactで使用する場合は「enzyme」「enzyme-adapter-react-16」(reactのバージョンによって16のところが変化する)の2つのライブラリが必要なため、

npm install enzyme enzyme-adapter-react-16

とする。

その後、create-react-appで作り出したsrc内にsetupTests.jsを作成します。

そして、

import Enzyme from 'enzyme';
import Adapter from 'enzyme-adapter-react-16';

Enzyme.configure({ adapter: new Adapter() });

と書けば初期設定は完了です。