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 <[email protected]>
Gerrit-Reviewer: Jhernandez <[email protected]>
Gerrit-Reviewer: Niedzielski <[email protected]>
_______________________________________________
MediaWiki-commits mailing list
[email protected]
https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits