React + TypeScriptのプロジェクト初期設定時に出るエラー対処法

‘–jsx’ フラグが指定されていないと、JSX を使用できません

これはcreate-react-app直後からエラーが出ていました。
原因はtsconfig.jsonの設定ミスです。

react-jsx→reactにしてあげれば解決します。

参考:「–jsx」フラグが指定されていない限り、JSXを使用できません

React importエラー

Reactのimport時に宣言されていないと言うエラーが出ています。

npm i -D @types/react で解決します。

tsconfig.jsonのオプション

全てのオプション

tsconfig.jsonの全オプションを理解する(随時追加中)

scss導入

この記事を参考に導入

Create React AppでTypeScriptとScssを使う

node-sassのversionによってはエラーが出る。

ver4.0以下の場合はこちらでインストール

yarn add node-sass@4.14.1

TypeScriptの入門記事一覧

【TypeScript入門】JavaScriptとの違いや特徴を詳しく解説
【TypeScript入門】基本的な型の定義方法
【TypeScript入門】関数とクラスの型定義(継承と合成)
【TypeScript入門】クラスの型定義(インターフェースと型エイリアスの違い)
【TypeScript】高度な型表現について
【TypeScript】型ガードと型アサーションでunknown型を使い勝手良くする

Select the fields to be shown. Others will be hidden. Drag and drop to rearrange the order.
  • Image
  • SKU
  • Rating
  • Price
  • Stock
  • Availability
  • Add to cart
  • Description
  • Content
  • Weight
  • Dimensions
  • Additional information
  • Attributes
  • Custom attributes
  • Custom fields
Click outside to hide the compare bar
Compare
Compare ×
Let's Compare! Continue shopping