Create React AppでTypeScriptとScssを使う

Create React App は React を学習するのに快適な環境であり、React で新しいシングルページアプリケーションを作成するのに最も良い方法です。(-- 新しい React アプリを作る)

Create React App を用いて React で SPA ( single-page application ) を作成する際に、TypeScript と Scss を導入するためのメモです。

Create React App のプロジェクトをインストール

npx create-react-app my-app --template typescript
# or
yarn create react-app my-app --template typescript

--template typescriptをつけるだけ

node-sassをインストール

npm install node-sass --save
# or
yarn add node-sass

あとはsrc/App.cssをsrc/App.scssに書き換えて、src/App.jsでsrc/App.scssを読み込むように書き換えるだけ

以上でCreate React AppでTypeScriptとScssを書ける。

参考

• 新しい React アプリを作る
• Adding TypeScript
• Adding a Sass Stylesheet