remove css modules plugin for typescript, add classNames, use tslint

package-lock.json

@@ -951,6 +951,12 @@
         "physical-cpu-count": "^2.0.0"
       }
     },
+    "@types/classnames": {
+      "version": "2.2.9",
+      "resolved": "https://registry.npmjs.org/@types/classnames/-/classnames-2.2.9.tgz",
+      "integrity": "sha512-MNl+rT5UmZeilaPxAVs6YaPC2m6aA8rofviZbhbxpPpl61uKodfdQVsBtgJGTqGizEf02oW3tsVe7FYB8kK14A==",
+      "dev": true
+    },
     "@types/history": {
       "version": "4.7.3",
       "resolved": "https://registry.npmjs.org/@types/history/-/history-4.7.3.tgz",
@@ -1159,13 +1165,6 @@
       "integrity": "sha1-qJS3XUvE9s1nnvMkSp/Y9Gri1Cg=",
       "dev": true
     },
-    "asap": {
-      "version": "2.0.6",
-      "resolved": "https://registry.npmjs.org/asap/-/asap-2.0.6.tgz",
-      "integrity": "sha1-5QNHYR1+aQlDIIu9r+vLwvuGbUY=",
-      "dev": true,
-      "optional": true
-    },
     "asn1": {
       "version": "0.2.4",
       "resolved": "https://registry.npmjs.org/asn1/-/asn1-0.2.4.tgz",
@@ -1760,6 +1759,12 @@
         }
       }
     },
+    "classnames": {
+      "version": "2.2.6",
+      "resolved": "https://registry.npmjs.org/classnames/-/classnames-2.2.6.tgz",
+      "integrity": "sha512-JR/iSQOSt+LQIWwrwEzJ9uk0xfN3mTVYMwt1Ir5mUcSN6pU+V4zQFFaJsclJbPuAUQH+yfWef6tm7l1quW3C8Q==",
+      "dev": true
+    },
     "cli-cursor": {
       "version": "2.1.0",
       "resolved": "https://registry.npmjs.org/cli-cursor/-/cli-cursor-2.1.0.tgz",
@@ -2682,16 +2687,6 @@
       "integrity": "sha512-FdDfnWnCVjxTTpWE3d6Jgh5JDIA3Cw7LCgpM/pI7kK1ORkjaqI2r6NqQ+ln2j0dfpgxY00AWieSvtkiZQKIItA==",
       "dev": true
     },
-    "errno": {
-      "version": "0.1.7",
-      "resolved": "https://registry.npmjs.org/errno/-/errno-0.1.7.tgz",
-      "integrity": "sha512-MfrRBDWzIWifgq6tJj60gkAwtLNb6sQPlcFrSOflcP1aFmmruKQ2wRnze/8V6kgyz7H3FF8Npzv78mZ7XLLflg==",
-      "dev": true,
-      "optional": true,
-      "requires": {
-        "prr": "~1.0.1"
-      }
-    },
     "error-ex": {
       "version": "1.3.2",
       "resolved": "https://registry.npmjs.org/error-ex/-/error-ex-1.3.2.tgz",
@@ -4046,37 +4041,12 @@
       "integrity": "sha1-Bupvg2ead0njhs/h/oEq5dsiPe0=",
       "dev": true
     },
-    "icss-utils": {
-      "version": "4.1.1",
-      "resolved": "https://registry.npmjs.org/icss-utils/-/icss-utils-4.1.1.tgz",
-      "integrity": "sha512-4aFq7wvWyMHKgxsH8QQtGpvbASCf+eM3wPRLI6R+MgAnTCZ6STYsRvttLvRWK0Nfif5piF394St3HeJDaljGPA==",
-      "dev": true,
-      "requires": {
-        "postcss": "^7.0.14"
-      }
-    },
     "ieee754": {
       "version": "1.1.13",
       "resolved": "https://registry.npmjs.org/ieee754/-/ieee754-1.1.13.tgz",
       "integrity": "sha512-4vf7I2LYV/HaWerSo3XmlMkp5eZ83i+/CDluXi/IGTs/O1sejBNhTtnxzmRZfvOUqj7lZjqHkeTvpgSFDlWZTg==",
       "dev": true
     },
-    "image-size": {
-      "version": "0.5.5",
-      "resolved": "https://registry.npmjs.org/image-size/-/image-size-0.5.5.tgz",
-      "integrity": "sha1-Cd/Uq50g4p6xw+gLiZA3jfnjy5w=",
-      "dev": true,
-      "optional": true
-    },
-    "import-cwd": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/import-cwd/-/import-cwd-2.1.0.tgz",
-      "integrity": "sha1-qmzzbnInYShcs3HsZRn1PiQ1sKk=",
-      "dev": true,
-      "requires": {
-        "import-from": "^2.1.0"
-      }
-    },
     "import-fresh": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/import-fresh/-/import-fresh-2.0.0.tgz",
@@ -4087,15 +4057,6 @@
         "resolve-from": "^3.0.0"
       }
     },
-    "import-from": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/import-from/-/import-from-2.1.0.tgz",
-      "integrity": "sha1-M1238qev/VOqpHHUuAId7ja387E=",
-      "dev": true,
-      "requires": {
-        "resolve-from": "^3.0.0"
-      }
-    },
     "indexes-of": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/indexes-of/-/indexes-of-1.0.1.tgz",
@@ -4554,23 +4515,6 @@
       "integrity": "sha512-s5kLOcnH0XqDO+FvuaLX8DDjZ18CGFk7VygH40QoKPUQhW4e2rvM0rwUq0t8IQDOwYSeLK01U90OjzBTme2QqA==",
       "dev": true
     },
-    "less": {
-      "version": "3.10.3",
-      "resolved": "https://registry.npmjs.org/less/-/less-3.10.3.tgz",
-      "integrity": "sha512-vz32vqfgmoxF1h3K4J+yKCtajH0PWmjkIFgbs5d78E/c/e+UQTnI+lWK+1eQRE95PXM2mC3rJlLSSP9VQHnaow==",
-      "dev": true,
-      "requires": {
-        "clone": "^2.1.2",
-        "errno": "^0.1.1",
-        "graceful-fs": "^4.1.2",
-        "image-size": "~0.5.0",
-        "mime": "^1.4.1",
-        "mkdirp": "^0.5.0",
-        "promise": "^7.1.1",
-        "request": "^2.83.0",
-        "source-map": "~0.6.0"
-      }
-    },
     "levn": {
       "version": "0.3.0",
       "resolved": "https://registry.npmjs.org/levn/-/levn-0.3.0.tgz",
@@ -5501,73 +5445,6 @@
         "postcss": "^7.0.0"
       }
     },
-    "postcss-filter-plugins": {
-      "version": "3.0.1",
-      "resolved": "https://registry.npmjs.org/postcss-filter-plugins/-/postcss-filter-plugins-3.0.1.tgz",
-      "integrity": "sha512-tRKbW4wWBEkSSFuJtamV2wkiV9rj6Yy7P3Y13+zaynlPEEZt8EgYKn3y/RBpMeIhNmHXFlSdzofml65hD5OafA==",
-      "dev": true,
-      "requires": {
-        "postcss": "^6.0.14"
-      },
-      "dependencies": {
-        "postcss": {
-          "version": "6.0.23",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.23.tgz",
-          "integrity": "sha512-soOk1h6J3VMTZtVeVpv15/Hpdl2cBLX3CAw4TAbkpTJiNPk9YP/zWcD1ND+xEtvyuuvKzbxliTOIyvkSeSJ6ag==",
-          "dev": true,
-          "requires": {
-            "chalk": "^2.4.1",
-            "source-map": "^0.6.1",
-            "supports-color": "^5.4.0"
-          }
-        }
-      }
-    },
-    "postcss-icss-selectors": {
-      "version": "2.0.3",
-      "resolved": "https://registry.npmjs.org/postcss-icss-selectors/-/postcss-icss-selectors-2.0.3.tgz",
-      "integrity": "sha1-J/oa/Kq2xgLIZsuymPMhjpvBybM=",
-      "dev": true,
-      "requires": {
-        "css-selector-tokenizer": "^0.7.0",
-        "generic-names": "^1.0.2",
-        "icss-utils": "^3.0.1",
-        "lodash": "^4.17.4",
-        "postcss": "^6.0.2"
-      },
-      "dependencies": {
-        "icss-utils": {
-          "version": "3.0.1",
-          "resolved": "https://registry.npmjs.org/icss-utils/-/icss-utils-3.0.1.tgz",
-          "integrity": "sha1-7nDTroysOMa+XtkehRsn7tNDrQ8=",
-          "dev": true,
-          "requires": {
-            "postcss": "^6.0.2"
-          }
-        },
-        "postcss": {
-          "version": "6.0.23",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.23.tgz",
-          "integrity": "sha512-soOk1h6J3VMTZtVeVpv15/Hpdl2cBLX3CAw4TAbkpTJiNPk9YP/zWcD1ND+xEtvyuuvKzbxliTOIyvkSeSJ6ag==",
-          "dev": true,
-          "requires": {
-            "chalk": "^2.4.1",
-            "source-map": "^0.6.1",
-            "supports-color": "^5.4.0"
-          }
-        }
-      }
-    },
-    "postcss-load-config": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/postcss-load-config/-/postcss-load-config-2.1.0.tgz",
-      "integrity": "sha512-4pV3JJVPLd5+RueiVVB+gFOAa7GWc25XQcMp86Zexzke69mKf6Nx9LRcQywdz7yZI9n1udOxmLuAwTBypypF8Q==",
-      "dev": true,
-      "requires": {
-        "cosmiconfig": "^5.0.0",
-        "import-cwd": "^2.0.0"
-      }
-    },
     "postcss-merge-longhand": {
       "version": "4.0.11",
       "resolved": "https://registry.npmjs.org/postcss-merge-longhand/-/postcss-merge-longhand-4.0.11.tgz",
@@ -6032,16 +5909,6 @@
       "integrity": "sha512-3ouUOpQhtgrbOa17J7+uxOTpITYWaGP7/AhoR3+A+/1e9skrzelGi/dXzEYyvbxubEF6Wn2ypscTKiKJFFn1ag==",
       "dev": true
     },
-    "promise": {
-      "version": "7.3.1",
-      "resolved": "https://registry.npmjs.org/promise/-/promise-7.3.1.tgz",
-      "integrity": "sha512-nolQXZ/4L+bP/UGlkfaIujX9BKxGwmQ9OT4mOt5yvy8iK1h3wqTEJCijzGANTCCl9nWjY41juyAn2K3Q1hLLTg==",
-      "dev": true,
-      "optional": true,
-      "requires": {
-        "asap": "~2.0.3"
-      }
-    },
     "prop-types": {
       "version": "15.7.2",
       "resolved": "https://registry.npmjs.org/prop-types/-/prop-types-15.7.2.tgz",
@@ -6053,13 +5920,6 @@
         "react-is": "^16.8.1"
       }
     },
-    "prr": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/prr/-/prr-1.0.1.tgz",
-      "integrity": "sha1-0/wRS6BplaRexok/SEzrHXj19HY=",
-      "dev": true,
-      "optional": true
-    },
     "psl": {
       "version": "1.4.0",
       "resolved": "https://registry.npmjs.org/psl/-/psl-1.4.0.tgz",
@@ -6438,12 +6298,6 @@
       "integrity": "sha512-NKN5kMDylKuldxYLSUfrbo5Tuzh4hd+2E8NPPX02mZtn1VuREQToYe/ZdlJy+J3uCpfaiGF05e7B8W0iXbQHmg==",
       "dev": true
     },
-    "reserved-words": {
-      "version": "0.1.2",
-      "resolved": "https://registry.npmjs.org/reserved-words/-/reserved-words-0.1.2.tgz",
-      "integrity": "sha1-AKCUD5jNUBrqqsMWQR2a3FKzGrE=",
-      "dev": true
-    },
     "resolve": {
       "version": "1.12.0",
       "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.12.0.tgz",
@@ -6539,15 +6393,6 @@
       "integrity": "sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg==",
       "dev": true
     },
-    "sass": {
-      "version": "1.23.6",
-      "resolved": "https://registry.npmjs.org/sass/-/sass-1.23.6.tgz",
-      "integrity": "sha512-awBvj9xrAuiS2TOCcYSUGCmaBV3UW6fVSK4oJ2LHS8IRfnRLc5EJihw90C7ZJ/skcEwFGSf9/XO5NlMiKupBCg==",
-      "dev": true,
-      "requires": {
-        "chokidar": ">=2.0.0 <4.0.0"
-      }
-    },
     "sax": {
       "version": "1.2.4",
       "resolved": "https://registry.npmjs.org/sax/-/sax-1.2.4.tgz",
@@ -7370,32 +7215,6 @@
       "resolved": "https://registry.npmjs.org/typescript/-/typescript-3.7.2.tgz",
       "integrity": "sha512-ml7V7JfiN2Xwvcer+XAf2csGO1bPBdRbFCkYBczNZggrBZ9c7G3riSUeJmqEU5uOtXNPMhE3n+R4FA/3YOAWOQ=="
     },
-    "typescript-plugin-css-modules": {
-      "version": "2.0.2",
-      "resolved": "https://registry.npmjs.org/typescript-plugin-css-modules/-/typescript-plugin-css-modules-2.0.2.tgz",
-      "integrity": "sha512-Yxp11x2DT5njDSi/8HyigRLCFlkdmb+bZOZ+Ig3BX8hZJ/y4OiktN/b6ZsZML2W2DWBnuJdUsbRiVJgOYq7mSQ==",
-      "dev": true,
-      "requires": {
-        "dotenv": "^8.2.0",
-        "icss-utils": "^4.1.1",
-        "less": "^3.9.0",
-        "lodash.camelcase": "^4.3.0",
-        "postcss": "^7.0.17",
-        "postcss-filter-plugins": "^3.0.1",
-        "postcss-icss-selectors": "^2.0.3",
-        "postcss-load-config": "^2.1.0",
-        "reserved-words": "^0.1.2",
-        "sass": "^1.22.4"
-      },
-      "dependencies": {
-        "dotenv": {
-          "version": "8.2.0",
-          "resolved": "https://registry.npmjs.org/dotenv/-/dotenv-8.2.0.tgz",
-          "integrity": "sha512-8sJ78ElpbDJBHNeBzUbUVLsqKdccaa/BXF1uPTw3GrvQTBgrQrtObr2mUrE38vzYd8cEv+m/JBfDLioYcfXoaw==",
-          "dev": true
-        }
-      }
-    },
     "uncss": {
       "version": "0.17.2",
       "resolved": "https://registry.npmjs.org/uncss/-/uncss-0.17.2.tgz",

package.json

@@ -5,7 +5,7 @@
   "main": "index.js",
   "scripts": {
     "clean": "rm -rf ./dist",
-    "eslint": "eslint ./src --ext .js,.jsx,.ts,.tsx",
+    "lint": "tslint --project .",
     "tscheck": "tsc --noEmit",
     "prebuild": "npm run clean && npm run tscheck",
     "build": "parcel build -d dist --public-url ./ ./src/index.html",
@@ -30,12 +30,14 @@
     "typescript": "^3.7.2"
   },
   "devDependencies": {
+    "@types/classnames": "^2.2.9",
     "@types/node": "^12.12.7",
     "@types/react": "^16.9.11",
     "@types/react-dom": "^16.9.4",
     "@types/react-router": "^5.1.3",
     "@types/react-router-dom": "^5.1.2",
     "@types/webpack-env": "^1.14.1",
+    "classnames": "^2.2.6",
     "parcel-bundler": "^1.12.4",
     "postcss-modules": "^1.4.1",
     "postcss-nested": "^4.2.1",
@@ -43,7 +45,6 @@
     "react-dom": "^16.11.0",
     "react-router": "^5.1.2",
     "react-router-dom": "^5.1.2",
-    "tslint": "^5.20.1",
-    "typescript-plugin-css-modules": "^2.0.2"
+    "tslint": "^5.20.1"
   }
 }

tsconfig.json

@@ -62,15 +62,8 @@
     // "emitDecoratorMetadata": true,         /* Enables experimental support for emitting type metadata for decorators. */
 
     /* Advanced Options */
-    "forceConsistentCasingInFileNames": true, /* Disallow inconsistently-cased references to the same file. */
-    "plugins": [{
-      "name": "typescript-plugin-css-modules",
-      "options": {
-        "customMatcher": "\\.css$"
-      }
-    }]
+    "forceConsistentCasingInFileNames": true  /* Disallow inconsistently-cased references to the same file. */
   },
-
   "include": [
     "src/**/*",
     "src/typings"