Merge pull request #1 from balakrishna-binary/trader_ts_config

Bala/setup TS eslint and add tsc to webpack compiler

package.json

@@ -19,6 +19,8 @@
         "@babel/preset-react": "^7.12.10",
         "@jest/globals": "^26.5.3",
         "@testing-library/react": "^12.0.0",
+        "@typescript-eslint/eslint-plugin": "^5.8.0",
+        "@typescript-eslint/parser": "^5.8.0",
         "babel-eslint": "^10.1.0",
         "babel-polyfill": "^6.26.0",
         "chai": "^4.2.0",

packages/dashboard/package.json

@@ -63,8 +63,8 @@
         "@types/classnames": "^2.2.11",
         "@types/object.fromentries": "^2.0.0",
         "@types/react-router-dom": "^5.1.6",
-        "@typescript-eslint/eslint-plugin": "^4.10.0",
-        "@typescript-eslint/parser": "^4.10.0",
+        "@typescript-eslint/eslint-plugin": "^5.8.0",
+        "@typescript-eslint/parser": "^5.8.0",
         "babel-core": "^6.26.3",
         "babel-loader": "^8.1.0",
         "chai": "^4.2.0",
@@ -79,7 +79,6 @@
         "postcss-loader": "^6.1.1",
         "postcss-preset-env": "^6.7.0",
         "postcss-scss": "^4.0.0",
-
         "resolve-url-loader": "^3.1.2",
         "sass-loader": "^10.1.1",
         "sass-resources-loader": "^2.1.1",

packages/trader/.eslintrc.js

@@ -4,7 +4,7 @@ module.exports = {
     extends: '../../.eslintrc.js',
     settings: {
         'import/resolver': {
-            webpack: { config: webpackConfig({})},
-        }
+            webpack: { config: webpackConfig({}) },
+        },
     },
 };

packages/trader/.eslintrc.ts

@@ -0,0 +1,16 @@
+const webpackConfig = require('./build/webpack.config-test.js');
+
+module.exports = {
+    extends: [
+        '../../.eslintrc.js',
+        'plugin:@typescript-eslint/recommended',
+        'plugin:@typescript-eslint/eslint-recommended',
+    ],
+    parser: '@typescript-eslint/parser',
+    plugins: ['@typescript-eslint'],
+    settings: {
+        'import/resolver': {
+            webpack: { config: webpackConfig({}) },
+        },
+    },
+};

packages/trader/build/constants.js

@@ -11,6 +11,7 @@ const StylelintPlugin = require('stylelint-webpack-plugin');
 const TerserPlugin = require('terser-webpack-plugin');
 // const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin;
 const { WebpackManifestPlugin } = require('webpack-manifest-plugin');
+const ForkTsCheckerWebpackPlugin = require('fork-ts-checker-webpack-plugin');
 
 const {
     copyConfig,
@@ -49,7 +50,7 @@ const rules = (is_test_env = false, is_mocha_only = false) => [
     ...(is_test_env && !is_mocha_only
         ? [
               {
-                  test: /\.(js|jsx|ts|tsx)$/,
+                  test: /\.(js|jsx)$/,
                   exclude: /node_modules|__tests__|(build\/.*\.js$)|(_common\/lib)/,
                   include: /src/,
                   loader: 'eslint-loader',
@@ -60,6 +61,18 @@ const rules = (is_test_env = false, is_mocha_only = false) => [
                       ignorePath: path.resolve(__dirname, '../.eslintignore'),
                   },
               },
+              {
+                  test: /\.(ts|tsx)$/,
+                  exclude: /node_modules|__tests__|(build\/.*\.js$)|(_common\/lib)/,
+                  include: /src/,
+                  loader: 'eslint-loader',
+                  enforce: 'pre',
+                  options: {
+                      formatter: require('eslint-formatter-pretty'),
+                      configFile: path.resolve(__dirname, '../.eslintrc.ts'),
+                      ignorePath: path.resolve(__dirname, '../.eslintignore'),
+                  },
+              },
           ]
         : []),
     {
@@ -118,6 +131,7 @@ const plugins = (base, is_test_env, is_mocha_only) => [
     new IgnorePlugin({ resourceRegExp: /^\.\/locale$/, contextRegExp: /moment$/ }),
     new MiniCssExtractPlugin(cssConfig()),
     new CircularDependencyPlugin({ exclude: /node_modules/, failOnError: true }),
+    new ForkTsCheckerWebpackPlugin(),
     ...(IS_RELEASE
         ? []
         : [

packages/trader/build/webpack.config.js

@@ -5,7 +5,7 @@ module.exports = function (env, argv) {
     const base = env && env.base && env.base != true ? '/' + env.base + '/' : '/';
 
     return {
-        context: path.resolve(__dirname, '../src'),
+        context: path.resolve(__dirname, '../'),
         devtool: IS_RELEASE ? undefined : 'eval-cheap-module-source-map',
         entry: {
             trader: path.resolve(__dirname, '../src', 'index.tsx'),

packages/trader/globals.d.ts

@@ -1,10 +1,3 @@
 declare module '@deriv/components';
 declare module '@deriv/translations';
 declare module '@deriv/shared';
-declare module 'Stores/connect';
-declare module 'Modules/Trading/Containers/toast-popup.jsx';
-declare module 'App/Containers/trade-settings-extensions.jsx';
-declare module 'App/Containers/trade-footer-extensions.jsx';
-declare module 'App/Containers/trade-header-extensions.jsx';
-declare module 'App/Containers/Routes/routes.jsx';
-declare module 'react-loadable';