Niedzielski has submitted this change and it was merged. ( https://gerrit.wikimedia.org/r/371010 )
Change subject: Chore: Add ES5 transpilation for client files ...................................................................... Chore: Add ES5 transpilation for client files Using typescript as the compiler, add ts-loader so that webpack transpiles files to ES5. * Base tsconfig.json in the root of the project * Specific client details extending the root config in src/client/tsconfig.json * Use the typescript parser for eslint and prettier * Tested by creating some lint and style errors on src/client/index.js and it seems to lint well * impliedStrict needed to supress strict mode rules. ES modules are implied strict. * Modify npm run lint to read ts and tsx files * Add ts-loader for webpack support Bug: T172437 Change-Id: If76bd06a768e75a82e1d54e45be8177e2decf20b --- M .eslintrc.json M package-lock.json M package.json R src/client/index.ts A src/client/tsconfig.json A tsconfig.json M webpack.config.js 7 files changed, 138 insertions(+), 4 deletions(-) Approvals: Niedzielski: Verified; Looks good to me, approved diff --git a/.eslintrc.json b/.eslintrc.json index bf986ec..e4630e8 100644 --- a/.eslintrc.json +++ b/.eslintrc.json @@ -7,11 +7,16 @@ "prettier" ], "rules": { - "prettier/prettier": "error" + "prettier/prettier": ["error", {"parser": "typescript"}] }, + "parser": "typescript-eslint-parser", "parserOptions": { "ecmaVersion": 2016, - "sourceType": "module" + "sourceType": "module", + "ecmaFeatures": { + "jsx": true, + "impliedStrict": true + } }, "env": { "es6": true, diff --git a/package-lock.json b/package-lock.json index 2d71c41..2ecb354 100644 --- a/package-lock.json +++ b/package-lock.json @@ -550,6 +550,21 @@ "integrity": "sha1-DQcLTQQ6W+ozovGkDi7bPZpMz3c=", "dev": true }, + "color-convert": { + "version": "1.9.0", + "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-1.9.0.tgz", + "integrity": "sha1-Gsz5fdc5uYO/mU1W/sj5WFNkG3o=", + "dev": true, + "requires": { + "color-name": "1.1.3" + } + }, + "color-name": { + "version": "1.1.3", + "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.3.tgz", + "integrity": "sha1-p9BVi9icQveV3UIyj3QIMcpTvCU=", + "dev": true + }, "comment-parser": { "version": "0.4.0", "resolved": "https://registry.npmjs.org/comment-parser/-/comment-parser-0.4.0.tgz", @@ -3441,6 +3456,12 @@ "lodash.keysin": "3.0.8" } }, + "lodash.unescape": { + "version": "4.0.1", + "resolved": "https://registry.npmjs.org/lodash.unescape/-/lodash.unescape-4.0.1.tgz", + "integrity": "sha1-vyJJiGzlFM2hEvrpIYzcBlIR/Jw=", + "dev": true + }, "lolex": { "version": "2.1.2", "resolved": "https://registry.npmjs.org/lolex/-/lolex-2.1.2.tgz", @@ -5011,6 +5032,49 @@ "integrity": "sha1-OTvnMKlEb9Hq1tpZoBQwjzbCics=", "dev": true }, + "ts-loader": { + "version": "2.3.2", + "resolved": "https://registry.npmjs.org/ts-loader/-/ts-loader-2.3.2.tgz", + "integrity": "sha512-KcQvWwla5nviCMX1511iKVsLfrx97Hbah6l5awE1HNL6eiyAzb3gSO8b5yasB6fK/qGukLpu9czWcd/AGGFy/g==", + "dev": true, + "requires": { + "chalk": "2.1.0", + "enhanced-resolve": "3.4.1", + "loader-utils": "1.1.0", + "semver": "5.4.1" + }, + "dependencies": { + "ansi-styles": { + "version": "3.2.0", + "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-3.2.0.tgz", + "integrity": "sha512-NnSOmMEYtVR2JVMIGTzynRkkaxtiq1xnFBcdQD/DnNCYPoEPsVJhM98BDyaoNOQIi7p4okdi3E27eN7GQbsUug==", + "dev": true, + "requires": { + "color-convert": "1.9.0" + } + }, + "chalk": { + "version": "2.1.0", + "resolved": "https://registry.npmjs.org/chalk/-/chalk-2.1.0.tgz", + "integrity": "sha512-LUHGS/dge4ujbXMJrnihYMcL4AoOweGnw9Tp3kQuqy1Kx5c1qKjqvMJZ6nVJPMWJtKCTN72ZogH3oeSO9g9rXQ==", + "dev": true, + "requires": { + "ansi-styles": "3.2.0", + "escape-string-regexp": "1.0.5", + "supports-color": "4.2.1" + } + }, + "supports-color": { + "version": "4.2.1", + "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-4.2.1.tgz", + "integrity": "sha512-qxzYsob3yv6U+xMzPrv170y8AwGP7i74g+pbixCfD6rgso8BscLT2qXIuz6TpOaiJZ3mFgT5O9lyT9nMU4LfaA==", + "dev": true, + "requires": { + "has-flag": "2.0.0" + } + } + } + }, "tty-browserify": { "version": "0.0.0", "resolved": "https://registry.npmjs.org/tty-browserify/-/tty-browserify-0.0.0.tgz", @@ -5047,6 +5111,30 @@ "integrity": "sha1-hnrHTjhkGHsdPUfZlqeOxciDB3c=", "dev": true }, + "typescript": { + "version": "2.4.2", + "resolved": "https://registry.npmjs.org/typescript/-/typescript-2.4.2.tgz", + "integrity": "sha1-+DlfhdRZJ2BnyYiqQYN6j4KHCEQ=", + "dev": true + }, + "typescript-eslint-parser": { + "version": "5.0.1", + "resolved": "https://registry.npmjs.org/typescript-eslint-parser/-/typescript-eslint-parser-5.0.1.tgz", + "integrity": "sha1-ChG3yUTcVtS9OCbcvT1SqIUJjz4=", + "dev": true, + "requires": { + "lodash.unescape": "4.0.1", + "semver": "5.3.0" + }, + "dependencies": { + "semver": { + "version": "5.3.0", + "resolved": "https://registry.npmjs.org/semver/-/semver-5.3.0.tgz", + "integrity": "sha1-myzl094C0XxgEq0yaqa00M9U+U8=", + "dev": true + } + } + }, "uglify-js": { "version": "2.8.29", "resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-2.8.29.tgz", diff --git a/package.json b/package.json index a2eb893..af6420b 100644 --- a/package.json +++ b/package.json @@ -9,7 +9,7 @@ "prod:build": "NODE_ENV=production webpack -p", "format": "npm run lint -s -- --fix", "format:all": "npm run format -s -- .", - "lint": "eslint --cache --max-warnings 0 --ext js,json", + "lint": "eslint --cache --max-warnings 0 --ext ts,tsx,js,json", "lint:all": "npm run lint -s -- .", "pretest": "npm run lint:all -s", "test": "mocha '{src,test}/**/*.test.js'", @@ -56,6 +56,9 @@ "npm-run-all": "^4.0.2", "prettier": "^1.5.3", "sinon": "^3.0.0", + "ts-loader": "^2.3.2", + "typescript": "^2.4.2", + "typescript-eslint-parser": "^5.0.1", "webpack": "^3.4.1" } } diff --git a/src/client/index.js b/src/client/index.ts similarity index 100% rename from src/client/index.js rename to src/client/index.ts diff --git a/src/client/tsconfig.json b/src/client/tsconfig.json new file mode 100644 index 0000000..2820b53 --- /dev/null +++ b/src/client/tsconfig.json @@ -0,0 +1,7 @@ +{ + "extends": "../../tsconfig.json", + "compilerOptions": { + "target": "ES5", + "module": "ES2015" + } +} diff --git a/tsconfig.json b/tsconfig.json new file mode 100644 index 0000000..311848a --- /dev/null +++ b/tsconfig.json @@ -0,0 +1,17 @@ +{ + "compilerOptions": { + "jsx": "react", + "jsxFactory": "h", + "sourceMap": true, + + "strict": true, + + "noUnusedLocals": true, + "noUnusedParameters": true, + "noImplicitReturns": true, + "noFallthroughCasesInSwitch": true, + + "newLine": "lf", + "forceConsistentCasingInFileNames": true + } +} diff --git a/webpack.config.js b/webpack.config.js index 8e83a38..390b89e 100644 --- a/webpack.config.js +++ b/webpack.config.js @@ -15,7 +15,7 @@ target: "web", entry: { - index: "./src/client/index.js" + index: "./src/client/index" }, output: { @@ -27,6 +27,20 @@ filename: "[name].[chunkhash].js" }, + resolve: { + // Add `.ts` and `.tsx` as a resolvable extension. + extensions: [".ts", ".tsx", ".js"] + }, + + module: { + rules: [ + { + test: /\.tsx?$/, + loader: "ts-loader" + } + ] + }, + devtool: isProd ? "source-map" : "cheap-module-eval-source-map", plugins: [ -- To view, visit https://gerrit.wikimedia.org/r/371010 To unsubscribe, visit https://gerrit.wikimedia.org/r/settings Gerrit-MessageType: merged Gerrit-Change-Id: If76bd06a768e75a82e1d54e45be8177e2decf20b Gerrit-PatchSet: 6 Gerrit-Project: marvin Gerrit-Branch: master Gerrit-Owner: Jhernandez <jhernan...@wikimedia.org> Gerrit-Reviewer: Jhernandez <jhernan...@wikimedia.org> Gerrit-Reviewer: Niedzielski <sniedziel...@wikimedia.org> _______________________________________________ MediaWiki-commits mailing list MediaWiki-commits@lists.wikimedia.org https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits