Make @typescript-eslint an optional peer dependency

Author: ThewBear

docusaurus/docs/adding-typescript.md

@@ -26,11 +26,11 @@ yarn create react-app my-app --template typescript
 To add [TypeScript](https://www.typescriptlang.org/) to a Create React App project, first install it:
 
 ```sh
-npm install --save typescript @types/node @types/react @types/react-dom @types/jest
+npm install --save typescript @typescript-eslint/eslint-plugin @typescript-eslint/parser @types/node @types/react @types/react-dom @types/jest
 
 # or
 
-yarn add typescript @types/node @types/react @types/react-dom @types/jest
+yarn add typescript @typescript-eslint/eslint-plugin @typescript-eslint/parser @types/node @types/react @types/react-dom @types/jest
 ```
 
 Next, rename any file to be a TypeScript file (e.g. `src/index.js` to `src/index.tsx`) and **restart your development server**!

packages/cra-template-typescript/template.json

@@ -8,7 +8,9 @@
       "@types/react": "^16.9.0",
       "@types/react-dom": "^16.9.0",
       "@types/jest": "^25.0.0",
-      "typescript": "^3.8.0"
+      "typescript": "^3.8.0",
+      "@typescript-eslint/eslint-plugin": "^2.28.0",
+      "@typescript-eslint/parser": "^2.28.0"
     }
   }
 }

packages/eslint-config-react-app/README.md

@@ -19,7 +19,7 @@ If you want to use this ESLint configuration in a project not built with Create
 First, install this package, ESLint and the necessary plugins.
 
 ```sh
-npm install --save-dev eslint-config-react-app @typescript-eslint/eslint-plugin@2.x @typescript-eslint/parser@2.x babel-eslint@10.x eslint@6.x eslint-plugin-flowtype@4.x eslint-plugin-import@2.x eslint-plugin-jsx-a11y@6.x eslint-plugin-react@7.x eslint-plugin-react-hooks@2.x
+npm install --save-dev eslint-config-react-app babel-eslint@10.x eslint@6.x eslint-plugin-flowtype@4.x eslint-plugin-import@2.x eslint-plugin-jsx-a11y@6.x eslint-plugin-react@7.x eslint-plugin-react-hooks@2.x
 ```
 
 Then create a file named `.eslintrc.json` with following contents in the root folder of your project:

packages/eslint-config-react-app/package.json

@@ -25,7 +25,16 @@
     "eslint-plugin-react": "7.x",
     "eslint-plugin-react-hooks": "1.x || 2.x || 3.x || 4.x"
   },
+  "peerDependenciesMeta": {
+    "@typescript-eslint/eslint-plugin": {
+      "optional": true
+    },
+    "@typescript-eslint/parser": {
+      "optional": true
+    }
+  },
   "dependencies": {
-    "confusing-browser-globals": "^1.0.9"
+    "confusing-browser-globals": "^1.0.9",
+    "resolve": "^1.16.0"
   }
 }

packages/react-scripts/package.json

@@ -31,8 +31,6 @@
     "@babel/core": "7.10.1",
     "@pmmmwh/react-refresh-webpack-plugin": "0.3.2",
     "@svgr/webpack": "5.4.0",
-    "@typescript-eslint/eslint-plugin": "^2.10.0",
-    "@typescript-eslint/parser": "^2.10.0",
     "babel-eslint": "10.1.0",
     "babel-jest": "^26.0.1",
     "babel-loader": "8.1.0",
@@ -92,11 +90,19 @@
     "fsevents": "^2.1.3"
   },
   "peerDependencies": {
-    "typescript": "^3.2.1"
+    "typescript": "^3.2.1",
+    "@typescript-eslint/eslint-plugin": "^2.28.0",
+    "@typescript-eslint/parser": "^2.28.0"
   },
   "peerDependenciesMeta": {
     "typescript": {
       "optional": true
+    },
+    "@typescript-eslint/eslint-plugin": {
+      "optional": true
+    },
+    "@typescript-eslint/parser": {
+      "optional": true
     }
   },
   "browserslist": {

test/fixtures/typescript-advanced/index.test.js

@@ -1,7 +1,8 @@
 const testSetup = require('../__shared__/test-setup');
 
 test('builds in development', async () => {
-  const { fulfilled } = await testSetup.scripts.start({ smoke: true });
+  const { fulfilled, stderr } = await testSetup.scripts.start({ smoke: true });
+  expect(stderr).toBe("We detected TypeScript in your project (src/App.test.ts) and created a tsconfig.json file for you.\n");
   expect(fulfilled).toBe(true);
 });
 test('builds in production', async () => {

test/fixtures/typescript-advanced/package.json

@@ -5,6 +5,8 @@
     "@types/jest": "*",
     "react": "*",
     "react-dom": "*",
-    "typescript": "3.7.2"
+    "typescript": "3.7.2",
+    "@typescript-eslint/eslint-plugin": "^2.28.0",
+    "@typescript-eslint/parser": "^2.28.0"
   }
 }