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

React

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

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

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

参考:https://www.it-swarm-ja.tech/ja/reactjs/%e3%80%8cjsx%e3%80%8d%e3%83%95%e3%83%a9%e3%82%b0%e3%81%8c%e6%8c%87%e5%ae%9a%e3%81%95%e3%82%8c%e3%81%a6%e3%81%84%e3%81%aa%e3%81%84%e9%99%90%e3%82%8a%e3%80%81jsx%e3%82%92%e4%bd%bf%e7%94%a8%e3%81%a7%e3%81%8d%e3%81%be%e3%81%9b%e3%82%93/838744128/

React importエラー

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

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

tsconfig.jsonのオプション

全てのオプション

tsconfig.jsonの全オプションを理解する(随時追加中) - Qiita
概要 社内勉強会の資料。 TypeScriptのtsconfig.jsonにはオプションが色々とあるので、それらの意味や用途を理解する目的です。 tscのバージョンは3.7.2を使用します。 VSCodeのバージョンは1.40...

scss導入

この記事を参考に導入

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

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

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

yarn add node-sass@4.14.1

コメント

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
Compare
Wishlist 0
Open wishlist page Continue shopping
タイトルとURLをコピーしました