From f44694ad44ac5ef361f6c10daadb68dc9871a0a6 Mon Sep 17 00:00:00 2001 From: Travis Ralston Date: Wed, 11 Mar 2020 18:19:03 -0600 Subject: [PATCH 1/2] Support TypeScript for React components Same treatment as https://github.com/matrix-org/matrix-react-sdk/pull/4203 --- package.json | 4 ++-- tsconfig.json | 6 ++++-- webpack.config.js | 2 +- yarn.lock | 2 +- 4 files changed, 8 insertions(+), 6 deletions(-) diff --git a/package.json b/package.json index 473e9a5f0..5f6e5b62a 100644 --- a/package.json +++ b/package.json @@ -40,7 +40,7 @@ "build:res": "node scripts/copy-res.js", "build:genfiles": "yarn reskindex && yarn build:res", "build:modernizr": "modernizr -c .modernizr.json -d src/vector/modernizr.js", - "build:compile": "babel -d lib --verbose --extensions \".ts,.js\" src", + "build:compile": "babel -d lib --verbose --extensions \".ts,.js,.tsx\" src", "build:bundle": "cross-env NODE_ENV=production webpack -p --progress --bail --mode production", "build:electron": "yarn build && yarn install:electron && electron-builder -wml --ia32 --x64", "build:electron:linux": "yarn build && electron-builder -l --x64", @@ -94,7 +94,7 @@ "@babel/preset-typescript": "^7.7.4", "@babel/register": "^7.7.4", "@babel/runtime": "^7.7.6", - "@types/react": "^16.9.17", + "@types/react": "16.9", "@types/react-dom": "^16.9.4", "autoprefixer": "^9.7.3", "babel-eslint": "^10.0.3", diff --git a/tsconfig.json b/tsconfig.json index ec1531e42..3e4db4baa 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -10,10 +10,12 @@ "outDir": "./lib", "declaration": true, "types": [ - "node" + "node", + "react" ] }, "include": [ - "./src/**/*.ts" + "./src/**/*.ts", + "./src/**/*.tsx" ] } diff --git a/webpack.config.js b/webpack.config.js index 688b39cbf..fbee94766 100644 --- a/webpack.config.js +++ b/webpack.config.js @@ -82,7 +82,7 @@ module.exports = (env, argv) => { aliasFields: ['matrix_src_browser', 'browser'], // We need to specify that TS can be resolved without an extension - extensions: ['.js', '.json', '.ts'], + extensions: ['.js', '.json', '.ts', '.tsx'], alias: { // alias any requires to the react module to the one in our path, // otherwise we tend to get the react source included twice when diff --git a/yarn.lock b/yarn.lock index 687980e4d..8897ae589 100644 --- a/yarn.lock +++ b/yarn.lock @@ -1262,7 +1262,7 @@ dependencies: "@types/react" "*" -"@types/react@*", "@types/react@^16.9.17": +"@types/react@*", "@types/react@16.9": version "16.9.23" resolved "https://registry.yarnpkg.com/@types/react/-/react-16.9.23.tgz#1a66c6d468ba11a8943ad958a8cb3e737568271c" integrity sha512-SsGVT4E7L2wLN3tPYLiF20hmZTPGuzaayVunfgXzUn1x4uHVsKH6QDJQ/TdpHqwsTLd4CwrmQ2vOgxN7gE24gw== From 798d4dabc0c2b0f575907f9edb5dc88d7bf5e908 Mon Sep 17 00:00:00 2001 From: Travis Ralston Date: Wed, 11 Mar 2020 18:24:33 -0600 Subject: [PATCH 2/2] Supply `--jsx react` to tsc --- package.json | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/package.json b/package.json index 5f6e5b62a..02a3a9d4e 100644 --- a/package.json +++ b/package.json @@ -46,7 +46,7 @@ "build:electron:linux": "yarn build && electron-builder -l --x64", "build:electron:macos": "yarn build && electron-builder -m --x64", "build:electron:windows": "yarn build && electron-builder -w --ia32 --x64", - "build:types": "tsc --emitDeclarationOnly", + "build:types": "tsc --emitDeclarationOnly --jsx react", "install:electron": "electron-builder install-app-deps", "dist": "scripts/package.sh", "start": "concurrently --kill-others-on-fail --prefix \"{time} [{name}]\" -n reskindex,reskindex-react,res,riot-js \"yarn reskindex:watch\" \"yarn reskindex:watch-react\" \"yarn start:res\" \"yarn start:js\"", @@ -56,7 +56,7 @@ "lint": "yarn lint:types && yarn lint:ts && yarn lint:js && yarn lint:style", "lint:js": "eslint src", "lint:ts": "echo 'We don't actually have a typescript linter at this layer because tslint is being removed from our stack. Presumably your TS is fine.'", - "lint:types": "tsc --noEmit", + "lint:types": "tsc --noEmit --jsx react", "lint:style": "stylelint 'res/css/**/*.scss'", "test": "jest" },