Typescripted cvat-core, cvat-data (#120)

* Typescripted cvat-core, cvat-data

* Removed unused import

* Fixed two issues

* Fixed comments

* Removed duplicated line

.eslintrc.js

@@ -7,21 +7,21 @@ module.exports = {
     env: {
         node: true,
         browser: true,
-        es6: true,
+        es2020: true,
     },
     parserOptions: {
         sourceType: 'module',
-        ecmaVersion: 2018,
+        parser: '@typescript-eslint/parser',
     },
     ignorePatterns: [
         '.eslintrc.js',
         'lint-staged.config.js',
     ],
-    plugins: ['security', 'no-unsanitized', 'eslint-plugin-header', 'import'],
+    plugins: ['@typescript-eslint', 'security', 'no-unsanitized', 'eslint-plugin-header', 'import'],
     extends: [
         'eslint:recommended', 'plugin:security/recommended', 'plugin:no-unsanitized/DOM',
         'airbnb-base', 'plugin:import/errors', 'plugin:import/warnings',
-        'plugin:import/typescript',
+        'plugin:import/typescript', 'plugin:@typescript-eslint/recommended', 'airbnb-typescript/base',
     ],
     rules: {
         'header/header': [2, 'line', [{
@@ -51,5 +51,21 @@ module.exports = {
         'security/detect-object-injection': 0, // the rule is relevant for user input data on the node.js environment
         'import/order': ['error', {'groups': ['builtin', 'external', 'internal']}],
         'import/prefer-default-export': 0, // works incorrect with interfaces
+
+        '@typescript-eslint/no-explicit-any': 0,
+        '@typescript-eslint/indent': ['error', 4],
+        '@typescript-eslint/lines-between-class-members': 0,
+        '@typescript-eslint/explicit-function-return-type': ['warn', { allowExpressions: true }],
+        '@typescript-eslint/explicit-module-boundary-types': 'off',
+        '@typescript-eslint/ban-types': [
+            'error',
+            {
+                types: {
+                    '{}': false, // TODO: try to fix with Record<string, unknown>
+                    object: false, // TODO: try to fix with Record<string, unknown>
+                    Function: false, // TODO: try to fix somehow
+                },
+            },
+        ],
     },
 };

cvat-canvas/.eslintrc.js

@@ -2,12 +2,7 @@
 //
 // SPDX-License-Identifier: MIT
 
-const globalConfig = require('../.eslintrc.js');
-
 module.exports = {
-    env: {
-        node: true,
-    },
     ignorePatterns: [
         '.eslintrc.js',
         'webpack.config.js',
@@ -15,31 +10,7 @@ module.exports = {
         'dist/**',
     ],
     parserOptions: {
-        parser: '@typescript-eslint/parser',
-        ecmaVersion: 6,
         project: './tsconfig.json',
         tsconfigRootDir: __dirname,
     },
-    plugins: ['@typescript-eslint'],
-    extends: ['plugin:@typescript-eslint/recommended', 'airbnb-typescript/base'],
-    rules: {
-        ...globalConfig.rules,
-
-        '@typescript-eslint/no-explicit-any': 0,
-        '@typescript-eslint/indent': ['error', 4],
-        '@typescript-eslint/lines-between-class-members': 0,
-        '@typescript-eslint/no-explicit-any': [0],
-        '@typescript-eslint/explicit-function-return-type': ['warn', { allowExpressions: true }],
-        '@typescript-eslint/explicit-module-boundary-types': 'off',
-        '@typescript-eslint/ban-types': [
-            'error',
-            {
-                types: {
-                    '{}': false, // TODO: try to fix with Record<string, unknown>
-                    object: false, // TODO: try to fix with Record<string, unknown>
-                    Function: false, // TODO: try to fix somehow
-                },
-            },
-        ],
-    },
 };

cvat-canvas3d/.eslintrc.js

@@ -2,15 +2,8 @@
 //
 // SPDX-License-Identifier: MIT
 
-const globalConfig = require('../.eslintrc.js');
-
 module.exports = {
-    env: {
-        node: true,
-    },
     parserOptions: {
-        parser: '@typescript-eslint/parser',
-        ecmaVersion: 6,
         project: './tsconfig.json',
         tsconfigRootDir: __dirname,
     },
@@ -20,26 +13,4 @@ module.exports = {
         'node_modules/**',
         'dist/**',
     ],
-    plugins: ['@typescript-eslint'],
-    extends: ['plugin:@typescript-eslint/recommended', 'airbnb-typescript/base'],
-    rules: {
-        ...globalConfig.rules,
-
-        '@typescript-eslint/no-explicit-any': 0,
-        '@typescript-eslint/indent': ['error', 4],
-        '@typescript-eslint/lines-between-class-members': 0,
-        '@typescript-eslint/no-explicit-any': [0],
-        '@typescript-eslint/explicit-function-return-type': ['warn', { allowExpressions: true }],
-        '@typescript-eslint/explicit-module-boundary-types': 'off',
-        '@typescript-eslint/ban-types': [
-            'error',
-            {
-                types: {
-                    '{}': false, // TODO: try to fix with Record<string, unknown>
-                    object: false, // TODO: try to fix with Record<string, unknown>
-                    Function: false, // TODO: try to fix somehow
-                },
-            },
-        ],
-    },
 };

cvat-core/.eslintrc.js

@@ -4,9 +4,6 @@
 
 module.exports = {
     env: {
-        node: true,
-        browser: true,
-        es6: true,
         'jest/globals': true,
     },
     ignorePatterns: [
@@ -19,9 +16,8 @@ module.exports = {
         'dist/**',
     ],
     parserOptions: {
-        parser: 'babel-eslint',
-        sourceType: 'module',
-        ecmaVersion: 2018,
+        project: './tsconfig.json',
+        tsconfigRootDir: __dirname,
     },
     plugins: ['jest'],
     rules: {
@@ -29,5 +25,5 @@ module.exports = {
         'jest/no-focused-tests': 'error',
         'jest/no-identical-title': 'error',
         'jest/prefer-to-have-length': 'warn',
-      }
+    }
 };

cvat-core/package.json

@@ -2,12 +2,14 @@
   "name": "cvat-core",
   "version": "5.1.0",
   "description": "Part of Computer Vision Tool which presents an interface for client-side integration",
-  "main": "babel.config.js",
+  "main": "src/api.ts",
   "scripts": {
     "build": "webpack",
     "test": "jest --config=jest.config.js --coverage",
     "docs": "jsdoc --readme README.md src/*.js -p -c jsdoc.config.js -d docs",
-    "coveralls": "cat ./reports/coverage/lcov.info | coveralls"
+    "coveralls": "cat ./reports/coverage/lcov.info | coveralls",
+    "type-check": "tsc --noEmit",
+    "type-check:watch": "npm run type-check -- --watch"
   },
   "author": "Intel",
   "license": "MIT",
@@ -26,7 +28,7 @@
   "dependencies": {
     "axios": "^0.21.4",
     "browser-or-node": "^1.2.1",
-    "cvat-data": "../cvat-data",
+    "cvat-data": "file:../cvat-data",
     "detect-browser": "^5.2.1",
     "error-stack-parser": "^2.0.2",
     "form-data": "^2.5.0",

cvat-core/tsconfig.json

+{
+    "compilerOptions": {
+      "target": "es2020",
+      "allowJs": true,
+      "module": "commonjs",
+      "moduleResolution": "node",
+      "esModuleInterop": true,
+      "isolatedModules": true,
+      "noEmit": true,
+      "baseUrl": "src",
+    },
+    "include": ["src/*.ts"]
+}

cvat-core/webpack.config.js

@@ -12,17 +12,31 @@ const nodeConfig = {
     target: 'node',
     mode: 'development',
     devtool: 'source-map',
-    entry: './src/api.js',
+    entry: './src/api.ts',
     output: {
         path: path.resolve(__dirname, 'dist'),
         filename: 'cvat-core.node.js',
         libraryTarget: 'commonjs',
     },
+    resolve: {
+        extensions: ['.ts', '.js'],
+    },
     module: {
         rules: [
             {
-                test: /.js?$/,
+                test: /.ts?$/,
                 exclude: /node_modules/,
+                use: {
+                    loader: 'babel-loader',
+                    options: {
+                        plugins: [
+                            '@babel/plugin-proposal-class-properties',
+                            '@babel/plugin-proposal-optional-chaining',
+                        ],
+                        presets: ['@babel/preset-env', '@babel/typescript'],
+                        sourceType: 'unambiguous',
+                    },
+                },
             },
         ],
     },
@@ -36,7 +50,7 @@ const webConfig = {
     mode: 'production',
     devtool: 'source-map',
     entry: {
-        'cvat-core': './src/api.js',
+        'cvat-core': './src/api.ts',
     },
     output: {
         path: path.resolve(__dirname, 'dist'),
@@ -44,15 +58,22 @@ const webConfig = {
         library: 'cvat',
         libraryTarget: 'window',
     },
+    resolve: {
+        extensions: ['.ts', '.js'],
+    },
     module: {
         rules: [
             {
-                test: /.js?$/,
+                test: /.ts?$/,
                 exclude: /node_modules/,
                 use: {
                     loader: 'babel-loader',
                     options: {
-                        presets: ['@babel/preset-env'],
+                        plugins: [
+                            '@babel/plugin-proposal-class-properties',
+                            '@babel/plugin-proposal-optional-chaining',
+                        ],
+                        presets: ['@babel/preset-env', '@babel/typescript'],
                         sourceType: 'unambiguous',
                     },
                 },

cvat-data/.eslintrc.js

@@ -3,10 +3,16 @@
 // SPDX-License-Identifier: MIT
 
 module.exports = {
+    ignorePatterns: [
+        '.eslintrc.js',
+        'webpack.config.js',
+        'src/3rdparty/**',
+        'node_modules/**',
+        'dist/**',
+    ],
     parserOptions: {
-        parser: 'babel-eslint',
-        sourceType: 'module',
-        ecmaVersion: 2018,
+        project: './tsconfig.json',
+        tsconfigRootDir: __dirname,
     },
-    ignorePatterns: ['.eslintrc.js', 'webpack.config.js', 'src/3rdparty/**', 'node_modules/**', 'dist/**'],
+    plugins: ['jest'],
 };

cvat-data/package.json

@@ -2,11 +2,13 @@
   "name": "cvat-data",
   "version": "1.0.2",
   "description": "",
-  "main": "src/js/cvat-data.js",
+  "main": "src/ts/cvat-data.ts",
   "scripts": {
-    "patch": "cd src/js && patch --dry-run --forward -p0 < 3rdparty_patch.diff >> /dev/null && patch -p0 < 3rdparty_patch.diff; true",
+    "patch": "cd src/ts && patch --dry-run --forward -p0 < 3rdparty_patch.diff >> /dev/null && patch -p0 < 3rdparty_patch.diff; true",
     "build": "npm run patch; webpack --config ./webpack.config.js",
-    "server": "npm run patch; nodemon --watch config --exec 'webpack-dev-server --config ./webpack.config.js --mode=development --open'"
+    "server": "npm run patch; nodemon --watch config --exec 'webpack-dev-server --config ./webpack.config.js --mode=development --open'",
+    "type-check": "tsc --noEmit",
+    "type-check:watch": "npm run type-check -- --watch"
   },
   "author": "Intel",
   "license": "MIT",

cvat-data/tsconfig.json

+{
+    "compilerOptions": {
+      "target": "es2020",
+      "allowJs": true,
+      "module": "commonjs",
+      "moduleResolution": "node",
+      "esModuleInterop": true,
+      "isolatedModules": true,
+      "noEmit": true,
+      "baseUrl": "src",
+    },
+    "include": ["src/*.ts"]
+}

cvat-data/webpack.config.js

@@ -13,7 +13,7 @@ const cvatData = {
     target: 'web',
     mode: 'production',
     entry: {
-        'cvat-data': './src/js/cvat-data.js',
+        'cvat-data': './src/js/cvat-data.ts',
     },
     output: {
         path: path.resolve(__dirname, 'dist'),
@@ -21,15 +21,22 @@ const cvatData = {
         library: 'cvatData',
         libraryTarget: 'window',
     },
+    resolve: {
+        extensions: ['.ts', '.js'],
+    },
     module: {
         rules: [
             {
-                test: /.js?$/,
+                test: /.ts?$/,
                 exclude: /node_modules/,
                 use: {
                     loader: 'babel-loader',
                     options: {
-                        presets: ['@babel/preset-env'],
+                        plugins: [
+                            '@babel/plugin-proposal-class-properties',
+                            '@babel/plugin-proposal-optional-chaining',
+                        ],
+                        presets: ['@babel/preset-env', '@babel/typescript'],
                         sourceType: 'unambiguous',
                     },
                 },

cvat-ui/.eslintrc.js

@@ -5,12 +5,7 @@
 const globalConfig = require('../.eslintrc.js');
 
 module.exports = {
-    env: {
-        node: true,
-    },
     parserOptions: {
-        parser: '@typescript-eslint/parser',
-        ecmaVersion: 6,
         project: './tsconfig.json',
         tsconfigRootDir: __dirname,
     },
@@ -20,27 +15,9 @@ module.exports = {
         'node_modules/**',
         'dist/**',
     ],
-    plugins: ['@typescript-eslint'],
-    extends: ['plugin:@typescript-eslint/recommended', 'airbnb-typescript'],
+    extends: ['airbnb-typescript'],
     rules: {
-        ...globalConfig.rules,
-
-        '@typescript-eslint/no-explicit-any': 0,
-        '@typescript-eslint/indent': ['error', 4],
-        '@typescript-eslint/lines-between-class-members': 0,
-        '@typescript-eslint/no-explicit-any': [0],
-        '@typescript-eslint/explicit-function-return-type': ['warn', { allowExpressions: true }],
-        '@typescript-eslint/explicit-module-boundary-types': 'off',
-        '@typescript-eslint/ban-types': [
-            'error',
-            {
-                types: {
-                    '{}': false, // TODO: try to fix with Record<string, unknown>
-                    object: false, // TODO: try to fix with Record<string, unknown>
-                    Function: false, // TODO: try to fix somehow
-                },
-            },
-        ],
+        ...globalConfig.rules, // need to import rules again because they've been redefined by "airbnb-typescript"
 
         'react/no-did-update-set-state': 0, // https://github.com/airbnb/javascript/issues/1875
         'react/require-default-props': 'off',
@@ -52,11 +29,4 @@ module.exports = {
         'react/jsx-props-no-spreading': 0,
         'jsx-quotes': ['error', 'prefer-single'],
     },
-    // settings: {
-    //     'import/resolver': {
-    //         node: {
-    //             paths: ['src', `${__dirname}/src`],
-    //         },
-    //     },
-    // },
 };

cvat-ui/webpack.config.js

@@ -146,7 +146,7 @@ module.exports = (env) => ({
         new CopyPlugin({
             patterns: [
                 {
-                    from: '../cvat-data/src/js/3rdparty/avc.wasm',
+                    from: '../cvat-data/src/ts/3rdparty/avc.wasm',
                     to: 'assets/3rdparty/',
                 },
             ],