create-react-app fails on Node 14+ with local template file

Created by: prijks

Describe the bug

When running create-react-app on Node 14+, the project fails to create. Instead an error is returned that no package.json could be found in the template file, despite a package.json being present. This happens even when downloading a copy of an official template, so it is not an issue in my template.

The problem as far as I've narrowed it down is that starting in Node 14, the unpack function in tar-pack triggers the callback function before the files have finished unpacking. So when createReactApp.js goes to look for the package.json file, it doesn't exist yet.

tar-pack appears to be unmaintained, but an issue has been opened for this exact problem. It looks like the problem is that the PassThrough stream tar-pack uses triggers a close event twice. Once when gunzip finishes and once when the untar finishes. The callback is unfortunately triggered on the first close event, before untar finishes. This only started happening with Node 14.

tar-pack uses version 2.2.1 of node-tar (just tar on npm). The latest version of node-tar is 6.1.0 and appears to include many of the features that tar-pack at the time implemented. For example, tar 6.1.0 includes support to unzip a tgz file before untarring it and also includes features to ensure no unreadable files are created. I think it probably makes sense to consider replacing tar-pack with a direct use of node-tar. I tried this in my environment by changing the extractStream function in createReactApp.js to look as follows:

function extractStream(stream, dest) {
  return new Promise((resolve, reject) => {
    stream
      .pipe(tar.x({ cwd: dest, strip: 1 }))
      .on('error', err => {
        reject(err);
      })
      .on('end', resolve(dest));
  });
}

This seems to work well, but I have not yet tested this in environments beyond my own primary (see below for environment details). If this approach sounds feasible I would be happy to do more testing and submit a pull request.

Did you try recovering your dependencies?

Not applicable, bug happens during project creation

Which terms did you search for in User Guide?

Not really relevant, but I tried searching for tar and package.json.

Environment

Environment Info:

current version of create-react-app: 4.0.3 running from C:\Users\prijks\AppData\Local\npm-cache_npx\c67e74de0542c87c\node_modules\create-react-app

System: OS: Windows 10 10.0.18363 CPU: (4) x64 Intel(R) Core(TM) i7-7500U CPU @ 2.70GHz Binaries: Node: 14.16.1 - C:\Program Files\nodejs\node.EXE Yarn: Not Found npm: 7.8.0 - C:\Program Files\nodejs\npm.CMD Browsers: Chrome: 90.0.4430.212 Edge: Spartan (44.18362.1533.0) Internet Explorer: 11.0.18362.1 npmPackages: react: Not Found react-dom: Not Found react-scripts: Not Found npmGlobalPackages: create-react-app: Not Found

Steps to reproduce

With node 14 or later installed, do the following:

1. Download a cra template (e.g. cra-template-typescript) to a local path
2. Run npx create-react-app test-app c:\path\to\cra-template-typescript-1.1.2.tgz

I have reproduced this on two separate Windows machines.

Expected behavior

Project is created

Actual behavior

create-react-app fails with the following error:

Could not extract the package name from the archive: Cannot find module 'C:\Users\prijks\AppData\Local\Temp\tmp-26504QtrZqwVdlRb4\package.json'
Require stack:
- C:\Users\prijks\AppData\Local\npm-cache\_npx\a489907dd8abe499\node_modules\create-react-app\createReactApp.js
- C:\Users\prijks\AppData\Local\npm-cache\_npx\a489907dd8abe499\node_modules\create-react-app\index.js

Aborting installation.
Unexpected error. Please report it as a bug:
TypeError: Cannot read property '1' of null
    at C:\Users\prijks\AppData\Local\npm-cache\_npx\a489907dd8abe499\node_modules\create-react-app\createReactApp.js:735:10
    at processTicksAndRejections (internal/process/task_queues.js:93:5)
    at async Promise.all (index 1)

Reproducible demo

Follows steps to reproduce to replicate