chore(gatsby): Add TS support to eslint and improve speed

.eslintignore

@@ -0,0 +1,25 @@
+
+**/coverage/**
+**/node_modules/**
+bin/
+packages/*/dist/**
+packages/*/lib/**
+packages/*/scripts/**
+**/dist/*
+**/__testfixtures__/**
+**/__tests__/fixtures/**
+peril
+docs
+plop-templates
+starters
+www
+benchmarks
+e2e-tests
+examples
+integration-tests
+**/*.d.ts
+
+packages/*/*.js
+packages/gatsby-plugin-preload-fonts/prepare/*.js
+packages/gatsby-image/withIEPolyfill/index.js
+packages/gatsby/cache-dir/commonjs/**/*

.eslintrc.js

@@ -0,0 +1,130 @@
+const TSEslint = require("@typescript-eslint/eslint-plugin")
+
+module.exports = {
+  parser: "babel-eslint",
+  extends: [
+    "google",
+    "eslint:recommended",
+    "plugin:flowtype/recommended",
+    "plugin:react/recommended",
+    "prettier",
+    "prettier/flowtype",
+    "prettier/react",
+  ],
+  plugins: ["flowtype", "prettier", "react", "filenames"],
+  parserOptions: {
+    ecmaVersion: 2016,
+    sourceType: "module",
+    ecmaFeatures: {
+      jsx: true,
+    },
+  },
+  env: {
+    browser: true,
+    es6: true,
+    node: true,
+    jest: true,
+  },
+  globals: {
+    before: true,
+    after: true,
+    spyOn: true,
+    __PATH_PREFIX__: true,
+    __BASE_PATH__: true,
+    __ASSET_PREFIX__: true,
+  },
+  rules: {
+    "arrow-body-style": [
+      "error",
+      "as-needed",
+      { requireReturnForObjectLiteral: true },
+    ],
+    "no-unused-expressions": [
+      "error",
+      {
+        allowTaggedTemplates: true,
+      },
+    ],
+    "consistent-return": ["error"],
+    "filenames/match-regex": ["error", "^[a-z-\\d\\.]+$", true],
+    "no-console": "off",
+    "no-inner-declarations": "off",
+    "prettier/prettier": "error",
+    quotes: ["error", "backtick"],
+    "react/display-name": "off",
+    "react/jsx-key": "warn",
+    "react/no-unescaped-entities": "off",
+    "react/prop-types": "off",
+    "require-jsdoc": "off",
+    "valid-jsdoc": "off",
+  },
+  overrides: [
+    {
+      files: [
+        "packages/**/gatsby-browser.js",
+        "packages/gatsby/cache-dir/**/*",
+      ],
+      env: {
+        browser: true,
+      },
+      globals: {
+        ___loader: false,
+        ___emitter: false,
+      },
+    },
+    {
+      files: ["**/cypress/integration/**/*", "**/cypress/support/**/*"],
+      globals: {
+        cy: false,
+        Cypress: false,
+      },
+    },
+    {
+      files: ["*.ts", "*.tsx"],
+      parser: "@typescript-eslint/parser",
+      plugins: ["@typescript-eslint/eslint-plugin"],
+      rules: {
+        ...TSEslint.configs.recommended.rules,
+        // This rule ensures that typescript types do not have semicolons
+        // at the end of their lines, since our prettier setup is to have no semicolons
+        // e.g.,
+        // interface Foo {
+        // -  baz: string;
+        // +  baz: string
+        // }
+        "@typescript-eslint/member-delimiter-style": [
+          "error",
+          {
+            multiline: {
+              delimiter: "none",
+            },
+          },
+        ],
+        // This ensures all interfaces are named with an I as a prefix
+        // e.g.,
+        // interface IFoo {}
+        "@typescript-eslint/interface-name-prefix": [
+          "error",
+          { prefixWithI: "always" },
+        ],
+        "@typescript-eslint/no-empty-function": "off",
+        // This ensures that we always type the return type of functions
+        // a high level focus of our TS setup is typing fn inputs and outputs.
+        "@typescript-eslint/explicit-function-return-type": "error",
+        // This forces us to use interfaces over types aliases for object defintions.
+        // Type is still useful for opaque types
+        // e.g.,
+        // type UUID = string
+        "@typescript-eslint/consistent-type-definitions": [
+          "error",
+          "interface",
+        ],
+      },
+    },
+  ],
+  settings: {
+    react: {
+      version: "16.4.2",
+    },
+  },
+}

.gitignore

@@ -52,6 +52,7 @@ node_modules/
 
 # misc
 .serverless/
+.eslintcache
 
 # lock files
 yarn.lock

package.json

@@ -10,8 +10,8 @@
     "@types/jest": "^24.0.23",
     "@types/node": "^12.12.11",
     "@types/webpack": "^4.41.0",
-    "@typescript-eslint/eslint-plugin": "^2.11.0",
-    "@typescript-eslint/parser": "^2.11.0",
+    "@typescript-eslint/eslint-plugin": "^2.12.0",
+    "@typescript-eslint/parser": "^2.12.0",
     "babel-eslint": "^10.0.3",
     "babel-jest": "^24.9.0",
     "chalk": "^2.4.2",
@@ -62,7 +62,7 @@
   "private": true,
   "lint-staged": {
     "*.{js,jsx}": [
-      "eslint --ignore-path .gitignore --ignore-path .prettierignore --fix",
+      "eslint --cache --ext .js,.jsx,.ts,.tsx --fix",
       "git add"
     ],
     "*.{md,css,scss,yaml,yml}": [
@@ -94,7 +94,7 @@
     "lerna": "lerna",
     "lerna-prepare": "lerna run prepare",
     "lint": "npm-run-all --continue-on-error -p lint:code lint:other",
-    "lint:code": "eslint --ignore-path .gitignore --ignore-path .prettierignore --ext .js,.jsx .",
+    "lint:code": "eslint --cache --ext .js,.jsx,.ts,.tsx .",
     "lint:scripts": "sh scripts/lint-shell-scripts.sh",
     "lint:other": "npm run prettier -- --check",
     "markdown": "md-magic --path \"starters/**/*.md\"",

packages/babel-preset-gatsby-package/__tests__/index.js

@@ -25,14 +25,16 @@ describe(`babel-preset-gatsby-package`, () => {
 
     it(`can pass custom nodeVersion target`, () => {
       process.env.BABEL_ENV = `production`
-    
+
       const nodeVersion = `6.0`
       const { presets } = preset(null, {
-        nodeVersion
+        nodeVersion,
       })
 
-      const [_, opts] = presets.find(preset => [].concat(preset).includes('@babel/preset-env'))
-
+      const [, opts] = presets.find(preset =>
+        [].concat(preset).includes(`@babel/preset-env`)
+      )
+
       expect(opts.targets.node).toBe(nodeVersion)
     })
   })

packages/gatsby/cache-dir/__tests__/static-entry.js

@@ -321,6 +321,7 @@ describe(`sanitizeComponents`, () => {
 
     const sanitizedComponents = sanitizeComponents([
       <link
+        key="manifest"
         rel="manifest"
         href="https://gatsbyjs.org/blog/manifest.webmanifest"
       />,

packages/gatsby/src/bootstrap/page-hot-reloader.js

@@ -7,28 +7,6 @@ const report = require(`gatsby-cli/lib/reporter`)
 let pagesDirty = false
 let graphql
 
-emitter.on(`CREATE_NODE`, action => {
-  if (action.payload.internal.type !== `SitePage`) {
-    pagesDirty = true
-  }
-})
-emitter.on(`DELETE_NODE`, action => {
-  if (action.payload.internal.type !== `SitePage`) {
-    pagesDirty = true
-    // Make a fake API call to trigger `API_RUNNING_QUEUE_EMPTY` being called.
-    // We don't want to call runCreatePages here as there might be work in
-    // progress. So this is a safe way to make sure runCreatePages gets called
-    // at a safe time.
-    apiRunnerNode(`FAKE_API_CALL`)
-  }
-})
-
-emitter.on(`API_RUNNING_QUEUE_EMPTY`, () => {
-  if (pagesDirty) {
-    runCreatePages()
-  }
-})
-
 const runCreatePages = async () => {
   pagesDirty = false
 
@@ -65,4 +43,25 @@ const runCreatePages = async () => {
 
 module.exports = graphqlRunner => {
   graphql = graphqlRunner
+  emitter.on(`CREATE_NODE`, action => {
+    if (action.payload.internal.type !== `SitePage`) {
+      pagesDirty = true
+    }
+  })
+  emitter.on(`DELETE_NODE`, action => {
+    if (action.payload.internal.type !== `SitePage`) {
+      pagesDirty = true
+      // Make a fake API call to trigger `API_RUNNING_QUEUE_EMPTY` being called.
+      // We don't want to call runCreatePages here as there might be work in
+      // progress. So this is a safe way to make sure runCreatePages gets called
+      // at a safe time.
+      apiRunnerNode(`FAKE_API_CALL`)
+    }
+  })
+
+  emitter.on(`API_RUNNING_QUEUE_EMPTY`, () => {
+    if (pagesDirty) {
+      runCreatePages()
+    }
+  })
 }