fix(create-gatsby): Better subprocess handling (#28043)

packages/create-gatsby/package.json

@@ -1,6 +1,6 @@
 {
   "name": "create-gatsby",
-  "version": "0.0.0-9",
+  "version": "0.0.0-10",
   "main": "lib/index.js",
   "bin": "cli.js",
   "license": "MIT",
@@ -15,9 +15,6 @@
     "lib/index.js",
     "cli.js"
   ],
-  "dependencies": {
-    "readable-stream": "^2.3.6"
-  },
   "devDependencies": {
     "@babel/runtime": "^7.12.1",
     "@types/configstore": "^4.0.0",
@@ -33,7 +30,6 @@
     "joi": "^17.2.1",
     "microbundle": "^0.12.4",
     "prettier": "^2.1.2",
-    "stream-filter": "^2.1.0",
     "string-length": "^4.0.1",
     "terminal-link": "^2.1.1",
     "tiny-spin": "^1.0.2",

packages/create-gatsby/src/index.ts

@@ -212,7 +212,7 @@ ${center(c.blueBright.bold.underline(`Welcome to Gatsby!`))}
 
   if (data.features?.length) {
     messages.push(
-      `${w(`🔌  `)}Install ${data.features
+      `${w(`🔌 `)}Install ${data.features
         ?.map((feat: string) => c.magenta(feat))
         .join(`, `)}`
     )

packages/create-gatsby/src/init-starter.ts

@@ -3,7 +3,6 @@ import execa from "execa"
 import fs from "fs-extra"
 import path from "path"
 import { reporter } from "./reporter"
-import filterStream from "stream-filter"
 import { spin } from "tiny-spin"
 import { getConfigStore } from "./get-config-store"
 type PackageManager = "yarn" | "npm"
@@ -17,20 +16,6 @@ export const setPackageManager = (packageManager: PackageManager): void => {
   getConfigStore().set(packageMangerConfigKey, packageManager)
 }
 
-const spawnWithArgs = (
-  file: string,
-  args: Array<string>,
-  options?: execa.Options
-): execa.ExecaChildProcess =>
-  execa(file, args, { stdio: `inherit`, preferLocal: false, ...options })
-
-const spawn = (
-  cmd: string,
-  options?: execa.Options
-): execa.ExecaChildProcess => {
-  const [file, ...args] = cmd.split(/\s+/)
-  return spawnWithArgs(file, args, options)
-}
 // Checks the existence of yarn package
 // We use yarnpkg instead of yarn to avoid conflict with Hadoop yarn
 // Refer to https://github.com/yarnpkg/yarn/issues/673
@@ -49,7 +34,7 @@ const gitInit = async (
 ): Promise<execa.ExecaReturnBase<string>> => {
   reporter.info(`Initialising git in ${rootPath}`)
 
-  return await spawn(`git init`, { cwd: rootPath })
+  return await execa(`git`, [`init`], { cwd: rootPath })
 }
 
 // Create a .gitignore file if it is missing in the new directory
@@ -69,7 +54,7 @@ const maybeCreateGitIgnore = async (rootPath: string): Promise<void> => {
 const createInitialGitCommit = async (rootPath: string): Promise<void> => {
   reporter.info(`Create initial git commit in ${rootPath}`)
 
-  await spawn(`git add -A`, { cwd: rootPath })
+  await execa(`git`, [`add`, `-A`], { cwd: rootPath })
   // use execSync instead of spawn to handle git clients using
   // pgp signatures (with password)
   try {
@@ -83,9 +68,6 @@ const createInitialGitCommit = async (rootPath: string): Promise<void> => {
   }
 }
 
-const filter = (pattern: string): NodeJS.ReadWriteStream =>
-  filterStream((data: string): boolean => !data.toString().startsWith(pattern))
-
 // Executes `npm install` or `yarn install` in rootPath.
 const install = async (
   rootPath: string,
@@ -112,48 +94,24 @@ const install = async (
     if (getPackageManager() === `yarn` && checkForYarn()) {
       if (await fs.pathExists(`package-lock.json`)) {
         if (!(await fs.pathExists(`yarn.lock`))) {
-          await spawn(`yarnpkg import`)
+          await execa(`yarnpkg`, [`import`])
         }
         await fs.remove(`package-lock.json`)
       }
 
       const args = packages.length ? [`add`, silent, ...packages] : [silent]
-
-      const childProcess = spawnWithArgs(`yarnpkg`, args, {
-        all: true,
-        stdio: `pipe`,
-      })
-      // eslint-disable-next-line no-unused-expressions
-      childProcess.all?.pipe(filter(`warning`)).pipe(process.stderr)
-
-      await childProcess
+      await execa(`yarnpkg`, args)
     } else {
       await fs.remove(`yarn.lock`)
 
-      let childProcess = spawnWithArgs(`npm`, [`install`, silent], {
-        all: true,
-        stdio: `pipe`,
-      })
-      // eslint-disable-next-line no-unused-expressions
-      childProcess.all?.pipe(filter(`npm WARN`)).pipe(process.stderr)
-
-      await childProcess
-
+      await execa(`npm`, [`install`, silent])
       stop()
-
       stop = spin(`Installing plugins...`)
-
-      childProcess = spawnWithArgs(`npm`, [`install`, silent, ...packages], {
-        all: true,
-        stdio: `pipe`,
-      })
-      // eslint-disable-next-line no-unused-expressions
-      childProcess.all?.pipe(filter(`npm WARN`)).pipe(process.stderr)
-
-      await childProcess
+      await execa(`npm`, [`install`, silent, ...packages])
+      stop()
     }
   } catch (e) {
-    reporter.error(e)
+    reporter.panic(e.message)
   } finally {
     process.chdir(prevDir)
     stop()
@@ -181,10 +139,13 @@ const clone = async (
     `--quiet`,
   ].filter(arg => Boolean(arg))
 
-  await spawnWithArgs(`git`, args)
+  try {
+    await execa(`git`, args)
+  } catch (err) {
+    reporter.panic(err.message)
+  }
   stop()
   reporter.success(`Created site from template`)
-
   await fs.remove(path.join(rootPath, `.git`))
 }
 

packages/create-gatsby/src/reporter.ts

@@ -8,7 +8,7 @@ export const reporter = {
     console.log(c.green(c.symbols.check + ` `) + message),
   error: (message: string): void =>
     console.error(c.red(c.symbols.cross + ` `) + message),
-  panic: (message: string): void => {
+  panic: (message: string): never => {
     console.error(message)
     process.exit(1)
   },

yarn.lock

@@ -23160,14 +23160,6 @@ stream-each@^1.1.0:
     end-of-stream "^1.1.0"
     stream-shift "^1.0.0"
 
-stream-filter@^2.1.0:
-  version "2.1.0"
-  resolved "https://registry.yarnpkg.com/stream-filter/-/stream-filter-2.1.0.tgz#bdff4eee3cde4c1525e02b78dde93d821fe529bd"
-  integrity sha1-vf9O7jzeTBUl4Ct43ek9gh/lKb0=
-  dependencies:
-    through2 "^2.0.1"
-    xtend "^4.0.1"
-
 stream-http@^2.7.2:
   version "2.8.3"
   resolved "https://registry.yarnpkg.com/stream-http/-/stream-http-2.8.3.tgz#b2d242469288a5a27ec4fe8933acf623de6514fc"