Create-react-app: "create-react-app hello-world" fails on Vagrant Ubuntu 12.04

Created on 2 Mar 2017 · 29Comments · Source: facebook/create-react-app

If you are reporting a bug, please fill in below. Otherwise feel free to remove this template entirely.

Can you reproduce the problem with latest npm?

I am using npm version 4.3.0

Description

I can't use create-react-app hello-world on Vagrant Ubuntu . It fails with the error "Aborting installation", then deletes the files it previously installed.

Actual behavior

root@precise64:/code/React# create-react-app hello-world
Creating a new React app in /code/React/hello-world.

Installing packages. This might take a couple minutes.
Installing react, react-dom, and react-scripts...

npm WARN prefer global [email protected] should be installed with -g
[email protected] /code/React/hello-world
+-- [email protected]
| +-- [email protected]
| | +-- [email protected]
| | +-- [email protected]
| | | `-- [email protected]
| | |   +-- [email protected]
...
...
| +-- [email protected]
  | `-- [email protected]
  |   +-- [email protected]
  |   `-- [email protected]
  +-- [email protected]
  `-- [email protected]

npm WARN optional SKIPPING OPTIONAL DEPENDENCY: [email protected] (node_modules/react-scripts/node_modules/fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for [email protected]: wanted {"os":"darwin","arch":"any"} (current: {"os":"linux","arch":"x64"})
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@^1.0.0 (node_modules/chokidar/node_modules/fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for [email protected]: wanted {"os":"darwin","arch":"any"} (current: {"os":"linux","arch":"x64"})

Aborting installation.

Deleting generated file... node_modules
Deleting generated file... package.json
Deleting hello-world/ from /code/React
Done.

Environment

Run these commands in the project folder and fill in their results:

npm ls react-scripts (if you haven’t ejected):

/code/React
`-- (empty)

node -v: 6.9.1
npm -v: 4.3.0

Then, specify:

Operating system: Vagrant virtual machine running Ubuntu 12.04 LTS
Browser and version: n/a

Source

tgig

Most helpful comment

I'll try the good 'ol remove everything, reboot, reinstall, reboot, try again method and see if that makes any difference.

Thanks a lot for your help, could not have gotten nearly this far w/o you.

Will get back soon.

tgig on 2 Mar 2017

👍3

All 29 comments

Can you please find which create-react-app and then edit the script to replace

      if (reason.command) {
        console.log('  ' + chalk.cyan(reason.command), 'has failed.')
      }

here with this:

      if (reason.command) {
        console.log('  ' + chalk.cyan(reason.command), 'has failed.')
      } else {
        console.log(chalk.red('  Unexpected error. Please report it as a bug:'));
        console.log(reason);
      }

and then try again and paste the output here? (I’d also appreciate a PR adding this diagnostic code to the tool, we should’ve done this before releasing.)

gaearon on 2 Mar 2017

Thanks for the super fast response.

Created the PR and here is the output:

Aborting installation.
  Unexpected error. Please report it as a bug:
/code/react/hello-world/node_modules/graceful-fs/graceful-fs.js:58
�$
^
SyntaxError: Invalid or unexpected token
    at Object.exports.runInThisContext (vm.js:76:16)
    at Module._compile (module.js:542:28)
    at Object.Module._extensions..js (module.js:579:10)
    at Module.load (module.js:487:32)
    at tryModuleLoad (module.js:446:12)
    at Function.Module._load (module.js:438:3)
    at Module.require (module.js:497:17)
    at require (internal/module.js:20:19)
    at Object.<anonymous> (/code/react/hello-world/node_modules/fs-extra/lib/index.js:4:11)
    at Module._compile (module.js:570:32)

Deleting generated file... node_modules
Deleting generated file... package.json
Deleting hello-world/ from /code/react
Done.

tgig on 2 Mar 2017

This is kinda weird:

/code/react/hello-world/node_modules/graceful-fs/graceful-fs.js:58
�$

Can you show the contents of this file around this line?

gaearon on 2 Mar 2017

Nothing looks out of place on the surface of it. Same as other copies of this library on my computer. This is what I'm seeing:

vim /usr/lib/node_modules/create-react-app/node_modules/graceful-fs/graceful-fs.js

function patch (fs) {
  // Everything that references the open() function needs to be in here
  polyfills(fs) //THIS IS LINE 58
  fs.gracefulify = patch
  fs.FileReadStream = ReadStream;  // Legacy name.
  fs.FileWriteStream = WriteStream;  // Legacy name.

tgig on 2 Mar 2017

Why did it point to /code/react/hello-world/ in the original stack trace?
Can you check there too?

gaearon on 2 Mar 2017

I would love to check there, but the program deletes the files in the cleanup process as it is aborting.

tgig on 2 Mar 2017

Oh well, you obviously can’t, it was deleted 😄
Can you comment the deletion out?

gaearon on 2 Mar 2017

Sure, I'll give it a shot

tgig on 2 Mar 2017

Should be a matter of commenting this section.

gaearon on 2 Mar 2017

Interesting!

The hello-world/node_modules/graceful-fs/graceful-fs.js file is definitely not happy. I can't seem to copy/paste the corrupted text. It looks different in vim and Sublime Text. Screenshots instead:

vim

Sublime

tgig on 2 Mar 2017

Can you install npm i -g [email protected] and try again? Maybe some weird bug in 4.x.

gaearon on 2 Mar 2017

No love. I actually had a previous version of npm and upgraded to the latest before submitting this bug. I did go back to 3.10.9 and still get an error.

Not sure if this is relevant, since the deleting code is still commented, but I'm getting a different error (but similar corruption) now:

Aborting installation.
  Unexpected error. Please report it as a bug:
/code/react/hello-world/node_modules/react-scripts/scripts/init.js:47
  } else {

SyntaxError: Invalid or unexpected token
    at Object.exports.runInThisContext (vm.js:76:16)
    at Module._compile (module.js:542:28)
    at Object.Module._extensions..js (module.js:579:10)
    at Module.load (module.js:487:32)
    at tryModuleLoad (module.js:446:12)
    at Function.Module._load (module.js:438:3)
    at Module.require (module.js:497:17)
    at require (internal/module.js:20:19)
    at /usr/lib/node_modules/create-react-app/index.js:235:18
    at process._tickCallback (internal/process/next_tick.js:103:7)

Done.

tgig on 2 Mar 2017

Are you behind a proxy, or using a non-standard npm registry by any chance?

gaearon on 2 Mar 2017

No, sorry, neither of those things.

tgig on 2 Mar 2017

Can you run npm ls graceful-fs in that folder, check the version, and then run npm install [email protected] (your version) in another separate folder to verify this is reproducible with npm alone?

gaearon on 2 Mar 2017

Not exactly sure what you're looking for, so may be doing this wrong, but:

root@precise64:/code/react/hello-world# npm ls graceful-fs
[email protected] /code/react/hello-world
`-- [email protected]
  `-- [email protected]
    `-- [email protected]

Then:

root@precise64:/code/react/tempdir# npm install [email protected]
/code/react/tempdir
`-- [email protected]

npm WARN enoent ENOENT: no such file or directory, open '/code/react/tempdir/package.json'
npm WARN tempdir No description
npm WARN tempdir No repository field.
npm WARN tempdir No README data
npm WARN tempdir No license field.

No apparent corruption in the file:

tgig on 2 Mar 2017

While I empathize with your problem, those screenshots are beautiful in a way.

gaearon on 2 Mar 2017

❤3

Thanks, this is even more interesting.
Let's try this in a separate folder now: npm install [email protected].

gaearon on 2 Mar 2017

Seems to have completed successfully:

root@precise64:/code/react/tempdir2# npm i --save [email protected]
npm WARN saveError ENOENT: no such file or directory, open '/code/react/tempdir2/package.json'
/code/react/tempdir2
`-- [email protected]
  +-- [email protected]
  | +-- [email protected]
  | | `-- [email protected]
  | +-- [email protected]
  | +-- [email protected]
  | +-- [email protected]
  | +-- [email protected]
  | | `-- [email protected]
  | `-- [email protected]
  +-- [email protected]
  | +-- [email protected]
...
...
  | | `-- [email protected]
  | +-- [email protected]
  | | `-- [email protected]
  | +-- [email protected]
  | `-- [email protected]
  |   +-- [email protected]
  |   `-- [email protected]
  +-- [email protected]
  `-- [email protected]

npm WARN optional SKIPPING OPTIONAL DEPENDENCY: [email protected] (node_modules/react-scripts/node_modules/fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for [email protected]: wanted {"os":"darwin","arch":"any"} (current: {"os":"linux","arch":"x64"})
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@^1.0.0 (node_modules/chokidar/node_modules/fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for [email protected]: wanted {"os":"darwin","arch":"any"} (current: {"os":"linux","arch":"x64"})
npm WARN enoent ENOENT: no such file or directory, open '/code/react/tempdir2/package.json'
npm WARN tempdir2 No description
npm WARN tempdir2 No repository field.
npm WARN tempdir2 No README data
npm WARN tempdir2 No license field.
root@precise64:/code/react/tempdir2# ls
node_modules

tgig on 2 Mar 2017

Does /code/react/tempdir2/node_modules/graceful-fs/graceful-fs.js look normal?

gaearon on 2 Mar 2017

@tgig What kind of network adapter are you using?

adamdicarlo on 2 Mar 2017

I've seen my Anker USB 3 -> Ethernet adapter (part of a USB 3 hub) corrupt data. Seems to happen when the machine has slept and reawoken. (I've seen this happen on macOS; not sure if you're directly in Linux or in a VM/container...)

adamdicarlo on 2 Mar 2017

I don’t know what’s causing this, but it’s clearly some sort of data corruption. Whether it happens on the disk, or during fetching, I can’t tell.

gaearon on 2 Mar 2017

Yes, the file in tempdir2 looks completely normal.

And, I'm on a Macbook Pro, running Vagrant virtual machines, with a wireless connection. I've never seen this kind of behavior before...

root@precise64:/code/react/tempdir2# lspci
00:00.0 Host bridge: Intel Corporation 440FX - 82441FX PMC [Natoma] (rev 02)
00:01.0 ISA bridge: Intel Corporation 82371SB PIIX3 ISA [Natoma/Triton II]
00:01.1 IDE interface: Intel Corporation 82371AB/EB/MB PIIX4 IDE (rev 01)
00:02.0 VGA compatible controller: InnoTek Systemberatung GmbH VirtualBox Graphics Adapter
00:03.0 Ethernet controller: Intel Corporation 82540EM Gigabit Ethernet Controller (rev 02)
00:04.0 System peripheral: InnoTek Systemberatung GmbH VirtualBox Guest Service
00:07.0 Bridge: Intel Corporation 82371AB/EB/MB PIIX4 ACPI (rev 08)
00:0d.0 SATA controller: Intel Corporation 82801HM/HEM (ICH8M/ICH8M-E) SATA Controller [AHCI mode] (rev 02)

tgig on 2 Mar 2017

I'll try the good 'ol remove everything, reboot, reinstall, reboot, try again method and see if that makes any difference.

Thanks a lot for your help, could not have gotten nearly this far w/o you.

Will get back soon.

tgig on 2 Mar 2017

👍3

I’d also suggest installing Yarn. CRA will use it automatically if it’s installed on the system. Not saying Yarn would fix it, but would give us another data point.

gaearon on 2 Mar 2017

Hey, it worked! Not sure if it was the uninstall/reinstall, or having Yarn do the magic. But... here we go.

Unfortunately, now experiencing another weird issue:

I'm running this inside of a Vagrant box. When I edit the file in my Sublime Text editor from my local machine, the development server does not recognize the change, and does not re-load the files. When I use vim inside the vagrant machine, everything works as expected.

I'm happy to research this on my own or open a new issue. Maybe it's an easy fix and you can point me in the right direction?

tgig on 2 Mar 2017

👍1

When I edit the file in my Sublime Text editor from my local machine, the development server does not recognize the change, and does not re-load the files.

Can you try creating an .env file in the project root and adding CHOKIDAR_USEPOLLING=true to it? Then restart the server.

gaearon on 2 Mar 2017

🎉1 👍1

Worked. Thanks again! I'm good to go.

tgig on 2 Mar 2017

Was this page helpful?

0 / 5 - 0 ratings

Related issues

Allow importing assets from parent folder

fson · 3Comments

allow setting of coverage reporters (or other jest config options)

onelson · 3Comments

Support for Webpack 2

alleroux · 3Comments

Bundle react-scripts package

fson · 3Comments

Question about pre-loading image files

alleroux · 3Comments