chore(gatsby): Use Typescript internally! (#19923)

* chore(gatsby): Begin the great TypeScript migration!

remove flow from eslint

Add typings for `got`

fix lint

drop commit test:check

bring back webpack-utils

Allow flow to live with typescript

fix lint

Improve check-ts script and add ts transformation to a second package

Fix ts imports

Fix gatsby-cli build script

address PR comments

* reduce PR scope to not affect peril files

* Bring back peril changes, they are necassary for the proper setup

* Reconfig peril so we dont have to change things

.babelrc.js

@@ -9,5 +9,11 @@ if (process.env.NODE_ENV !== `test`) {
 module.exports = {
   sourceMaps: true,
   presets: ["babel-preset-gatsby-package"],
+  overrides: [
+    {
+      test: "**/*.ts",
+      plugins: [["@babel/plugin-transform-typescript", { isTSX: true }]],
+    },
+  ],
   ignore,
 }

.circleci/config.yml

@@ -186,6 +186,7 @@ jobs:
       - <<: *attach_to_bootstrap
       - run: yarn lint:code
       - run: yarn lint:other
+      - run: yarn typecheck
       - run: yarn check-repo-fields
 
   unit_tests_node8:

jest.config.js

@@ -23,7 +23,7 @@ const useCoverage = !!process.env.GENERATE_JEST_REPORT
 module.exports = {
   notify: true,
   verbose: true,
-  roots: [...pkgs, `<rootDir>/peril`],
+  roots: pkgs,
   modulePathIgnorePatterns: ignoreDirs,
   coveragePathIgnorePatterns: ignoreDirs,
   testPathIgnorePatterns: [

package.json

@@ -4,6 +4,11 @@
     "@babel/node": "^7.7.4",
     "@babel/runtime": "^7.7.6",
     "@lerna/prompt": "3.18.5",
+    "@types/express": "^4.17.2",
+    "@types/got": "^9.6.9",
+    "@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",
     "babel-eslint": "^10.0.3",
@@ -99,11 +104,13 @@
     "publish": "node scripts/check-publish-access && node scripts/clear-package-dir --verbose && lerna publish",
     "publish-canary": "lerna publish --canary --yes",
     "publish-next": "lerna publish --npm-tag=next --bump=prerelease",
-    "test": "npm-run-all -s lint jest",
+    "test": "npm-run-all -s lint jest test:peril",
     "test:coverage": "jest --coverage",
     "test:update": "jest --updateSnapshot",
     "test:watch": "jest --watch",
     "test:integration": "jest --config=integration-tests/jest.config.js",
+    "test:peril": "cd peril && yarn test",
+    "typecheck": "node ./scripts/check-ts",
     "version": "prettier --write \"**/CHANGELOG.md\"",
     "watch": "lerna run watch --no-sort --stream --concurrency 999"
   },

packages/gatsby-cli/.babelrc

@@ -1,7 +1,16 @@
 {
   "presets": [
-    ["babel-preset-gatsby-package", {
-      "nodeVersion": "6.0"
-    }]
+    [
+      "babel-preset-gatsby-package",
+      {
+        "nodeVersion": "6.0"
+      }
+    ]
+  ],
+  "overrides": [
+    {
+      "test": "**/*.ts",
+      "plugins": [["@babel/plugin-transform-typescript", { "isTSX": true }]]
+    }
   ]
 }

packages/gatsby-cli/package.json

@@ -76,9 +76,9 @@
     "directory": "packages/gatsby-cli"
   },
   "scripts": {
-    "build": "babel src --out-dir lib --ignore \"**/__tests__\"",
+    "build": "babel src --out-dir lib --ignore \"**/__tests__\" --extensions \".ts,.js\"",
     "prepare": "cross-env NODE_ENV=production npm run build",
-    "watch": "babel -w src --out-dir lib --ignore \"**/__tests__\"",
+    "watch": "babel -w src --out-dir lib --ignore \"**/__tests__\"  --extensions \".ts,.js\"",
     "postinstall": "node scripts/postinstall.js"
   },
   "yargs": {

packages/gatsby-cli/src/index.js → packages/gatsby-cli/src/index.ts

@@ -1,22 +1,19 @@
 #!/usr/bin/env node
 
-// babel-preset-env doesn't find this import if you
-// use require() with backtick strings so use the es6 syntax
 import "@babel/polyfill"
-const semver = require(`semver`)
-const util = require(`util`)
+import semver from "semver"
+import util from "util"
+import createCli from "./create-cli"
+import report from "./reporter"
+import pkg from "../package.json"
+import updateNotifier from "update-notifier"
 
 const useJsonLogger = process.argv.slice(2).some(arg => arg.includes(`json`))
 
 if (useJsonLogger) {
   process.env.GATSBY_LOGGER = `json`
 }
 
-const createCli = require(`./create-cli`)
-const report = require(`./reporter`)
-const pkg = require(`../package.json`)
-const updateNotifier = require(`update-notifier`)
-
 // Check if update is available
 updateNotifier({ pkg }).notify({ isGlobal: true })
 

packages/gatsby-cli/tsconfig.json

@@ -0,0 +1,3 @@
+{
+  "extends": "../../tsconfig.json"
+}

packages/gatsby-core-utils/index.d.ts

@@ -12,6 +12,12 @@ export declare function createContentDigest(input: any): string
  */
 export declare function joinPath(...paths: string[]): string
 
+/**
+ * Convert Windows backslash paths to slash paths: foo\\bar ➔ foo/bar
+ * @param {string} path
+ */
+export declare function slash(path: string): string
+
 /**
  * Checks if the file name matches a node path
  * @param {string} fileName File name

packages/gatsby/package.json

@@ -196,7 +196,7 @@
     "build:internal-plugins": "copyfiles -u 1 src/internal-plugins/**/package.json dist",
     "build:rawfiles": "copyfiles -u 1 src/internal-plugins/**/raw_* dist",
     "build:cjs": "babel cache-dir --out-dir cache-dir/commonjs --ignore **/__tests__",
-    "build:src": "babel src --out-dir dist --source-maps --verbose --ignore **/gatsby-cli.js,src/internal-plugins/dev-404-page/raw_dev-404-page.js,**/__tests__",
+    "build:src": "babel src --out-dir dist --source-maps --verbose --ignore **/gatsby-cli.js,src/internal-plugins/dev-404-page/raw_dev-404-page.js,**/__tests__ --extensions \".ts,.js\"",
     "clean-test-bundles": "find test/ -type f -name bundle.js* -exec rm -rf {} +",
     "prebuild": "rimraf dist && rimraf cache-dir/commonjs",
     "postinstall": "node scripts/postinstall.js",