Use eslint-config-react-app

.eslintignore

@@ -0,0 +1,2 @@
+/public
+/server.js

.eslintrc

@@ -1,20 +1,6 @@
 {
-  "env": {
-    "es6": true,
-    "node": true
-  },
-  "extends": ["eslint:recommended", "plugin:import/errors"],
-  "parser": "babel-eslint",
+  "extends": "react-app",
   "rules": {
-    "no-console": 0
-  },
-  "settings": {
-    "import/resolver": {
-      "node": {
-        "moduleDirectory": [
-          "node_modules"
-        ]
-      }
-    }
+    "import/first": 0
   }
 }

modules/client/.eslintrc

@@ -1,17 +1,5 @@
 {
   "env": {
     "browser": true
-  },
-  "plugins": ["react", "react-hooks"],
-  "rules": {
-    "react/jsx-uses-react": "error",
-    "react/jsx-uses-vars": "error",
-    "react-hooks/rules-of-hooks": "error",
-    "react-hooks/exhaustive-deps": "warn"
-  },
-  "settings": {
-    "react": {
-      "version": "16"
-    }
   }
 }

modules/client/browse/FileViewer.js

@@ -15,7 +15,7 @@ function getBasename(path) {
 function ImageViewer({ path, uri }) {
   return (
     <div css={{ padding: 20, textAlign: 'center' }}>
-      <img title={getBasename(path)} src={uri} />
+      <img alt={getBasename(path)} src={uri} />
     </div>
   );
 }

modules/client/main/App.js

@@ -67,6 +67,7 @@ function AboutLogo({ children }) {
 }
 
 function AboutLogoImage(props) {
+  /* eslint-disable-next-line jsx-a11y/alt-text */
   return <img {...props} css={{ maxWidth: '90%' }} />;
 }
 
@@ -442,7 +443,11 @@ export default function App() {
         >
           <AboutLogo>
             <a title="Cloudflare" href="https://www.cloudflare.com">
-              <AboutLogoImage src={CloudflareLogo} height="100" />
+              <AboutLogoImage
+                alt="Cloudflare"
+                src={CloudflareLogo}
+                height="100"
+              />
             </a>
           </AboutLogo>
         </div>
@@ -473,7 +478,7 @@ export default function App() {
         >
           <AboutLogo>
             <a title="Angular" href="https://angular.io">
-              <AboutLogoImage src={AngularLogo} width="200" />
+              <AboutLogoImage alt="Angular" src={AngularLogo} width="200" />
             </a>
           </AboutLogo>
         </div>

package.json

@@ -5,7 +5,7 @@
   "scripts": {
     "build": "rollup -c",
     "clean": "git clean -e '!/.env' -fdX .",
-    "lint": "eslint modules",
+    "lint": "eslint .",
     "serve": "nodemon -w server.js server.js",
     "test": "jest",
     "watch": "rollup -c -w"
@@ -51,16 +51,20 @@
     "@ampproject/rollup-plugin-closure-compiler": "^0.8.5",
     "@babel/preset-env": "^7.2.0",
     "@babel/preset-react": "^7.0.0",
+    "@typescript-eslint/eslint-plugin": "2.x",
+    "@typescript-eslint/parser": "2.x",
     "babel-core": "^7.0.0-bridge.0",
-    "babel-eslint": "^8.0.3",
+    "babel-eslint": "10.x",
     "babel-jest": "^23.4.2",
     "chalk": "^2.4.2",
     "dotenv": "^6.2.0",
-    "eslint": "^4.13.1",
-    "eslint-import-resolver-node": "^0.3.2",
-    "eslint-plugin-import": "^2.8.0",
-    "eslint-plugin-react": "^7.14.2",
-    "eslint-plugin-react-hooks": "^1.6.1",
+    "eslint": "6.x",
+    "eslint-config-react-app": "^5.0.2",
+    "eslint-plugin-flowtype": "3.x",
+    "eslint-plugin-import": "2.x",
+    "eslint-plugin-jsx-a11y": "6.x",
+    "eslint-plugin-react": "7.x",
+    "eslint-plugin-react-hooks": "1.x",
     "jest": "^22.4.4",
     "nodemon": "^1.19.1",
     "rollup": "^1.1.0",