TypeScript with React

To install the latest version of TypeScript into your project run from the terminal: 'yarn add --dev typescript' for yarn or 'npm install --save-dev typescript' for npm.

Add tsc to the “scripts” section in our package.json: { "scripts": { "build": "tsc", }, }.

To generate a special file called tsconfig.json with compilation rules run: tsc --init.

Next tell the compiler where our source code is and where the output should go (in 'tsconfig.json'): { "compilerOptions": { "rootDir": "src", "outDir": "build" }, }.

In TypeScript we have 2 file extensions: .ts is the default file extension while .tsx is a special extension used for files which contain JSX.

Run TypeScript: use 'yarn build' for yarn or 'npm run build' for npm.

Create React App supports TypeScript out of the box: run 'create-react-app my-app --typescript'.