How to add TypeScript to existing application built with Create React App

If you already have an app built with create-react-app, you can add TypeScript by installing it and type definitions for all the installed packages:

Or if you use yarn:

This command will add TypeScript to your project and provide type definitions for react, react-dom and jest—packages used in Create React App.

If you have some other packages in your project, let's say enzyme you want to add types for those package too.

The DefinitelyTyped repository contains the biggest amount of type declarations for npm packages. You can find the types for your package there and install them.

Next, rename each component file to be a TypeScript file. For example:

This will allow TypeScript compiler to work with those files. It is important to use .tsx extension for React-components in TypeScript to work properly.

Now you can start the development server by running.

Sources#