Prepare environment for development react.js with TypeScript applications

Prepare react project with typescript without CRA

Add TypeScript in React app

Based on course

$ npm init -y
$ npm install --save-dev \
  typescript \
  @types/react \
  @types/react-dom \

$ npx tsc --init

"strict": true,
"lib": ["ESNext", "DOM"],
"jsx": "react-jsx",
"outDir": "./build",

$ npm uninstall @babel/eslint-parser

$ npm install -D [email protected] @typescript-eslint/[email protected] @typescript-eslint/[email protected]


"lint": "eslint \"src/**/*.{js,jsx,ts,tsx}\" --quiet"


// inside extends, above prettier rules

// inside rules, generally a good rule but we're going to disable it for now
"@typescript-eslint/no-empty-function": 0

// inside plugins

// replace parser
"parser": "@typescript-eslint/parser",

// add to settings array
"import/parsers": {
  "@typescript-eslint/parser": [".ts", ".tsx"]
"import/resolver": {
  "typescript": {
    "alwaysTryTypes": true

// under plugin:@typescript-eslint/recommended