[Proposal] Make able to write React in Typescript (#16210)

Co-authored-by: berlysia <berlysia@gmail.com>
Co-authored-by: fusagiko / takayamaki <takayamaki@users.noreply.github.com>

1 files changed, 41 insertions, 3 deletions

diff --git a/package.json b/package.json
index 915a5331f..46a18d755 100644
--- a/package.json
+++ b/package.json
@@ -10,10 +10,11 @@
     "build:production": "cross-env RAILS_ENV=production NODE_ENV=production ./bin/webpack",
     "manage:translations": "node ./config/webpack/translationRunner.js",
     "start": "node ./streaming/index.js",
-    "test": "${npm_execpath} run test:lint:js && ${npm_execpath} run test:jest",
+    "test": "${npm_execpath} run test:lint:js && ${npm_execpath} run test:typecheck && ${npm_execpath} run test:jest",
     "test:lint": "${npm_execpath} run test:lint:js && ${npm_execpath} run test:lint:sass",
-    "test:lint:js": "eslint --ext=.js,.jsx . --cache --report-unused-disable-directives",
+    "test:lint:js": "eslint --ext=.js,.jsx,.ts,.tsx . --cache --report-unused-disable-directives",
     "test:lint:sass": "stylelint \"**/*.{css,scss}\" && prettier --check \"**/*.{css,scss}\"",
+    "test:typecheck": "tsc --noEmit",
     "test:jest": "cross-env NODE_ENV=test jest",
     "format": "prettier --write .",
     "format-check": "prettier --check .",
@@ -139,9 +140,45 @@
     "ws": "^8.12.1"
   },
   "devDependencies": {
-    "@babel/eslint-parser": "^7.21.3",
+    "@babel/preset-typescript": "^7.21.0",
     "@testing-library/jest-dom": "^5.16.5",
     "@testing-library/react": "^12.1.5",
+    "@types/babel__core": "^7.20.0",
+    "@types/emoji-mart": "^3.0.9",
+    "@types/escape-html": "^1.0.2",
+    "@types/eslint": "^8.21.2",
+    "@types/express": "^4.17.17",
+    "@types/glob": "^8.1.0",
+    "@types/http-link-header": "^1.0.3",
+    "@types/intl": "^1.2.0",
+    "@types/jest": "^29.4.2",
+    "@types/js-yaml": "^4.0.5",
+    "@types/lodash": "^4.14.191",
+    "@types/npmlog": "^4.1.4",
+    "@types/object-assign": "^4.0.30",
+    "@types/pg": "^8.6.6",
+    "@types/prop-types": "^15.7.5",
+    "@types/punycode": "^2.1.0",
+    "@types/raf": "^3.4.0",
+    "@types/react": "^18.0.28",
+    "@types/react-dom": "^18.0.11",
+    "@types/react-intl": "2.3.18",
+    "@types/react-motion": "^0.0.33",
+    "@types/react-redux": "^7.1.25",
+    "@types/react-router-dom": "^5.3.3",
+    "@types/react-sparklines": "^1.7.2",
+    "@types/react-swipeable-views": "^0.13.1",
+    "@types/react-test-renderer": "^18.0.0",
+    "@types/react-toggle": "^4.0.3",
+    "@types/redux-immutable": "^4.0.3",
+    "@types/requestidlecallback": "^0.3.5",
+    "@types/throng": "^5.0.4",
+    "@types/uuid": "^9.0.1",
+    "@types/webpack": "^5.28.0",
+    "@types/webpack-bundle-analyzer": "^4.6.0",
+    "@types/yargs": "^17.0.22",
+    "@typescript-eslint/eslint-plugin": "^5.55.0",
+    "@typescript-eslint/parser": "^5.55.0",
     "babel-jest": "^29.5.0",
     "eslint": "^8.36.0",
     "eslint-plugin-import": "~2.27.5",
@@ -160,6 +197,7 @@
     "react-test-renderer": "^16.14.0",
     "stylelint": "^15.3.0",
     "stylelint-config-standard-scss": "^7.0.1",
+    "typescript": "^4.9.5",
     "webpack-dev-server": "^3.11.3",
     "yargs": "^17.7.1"
   },