facebook / create-react-app

Set up a modern web app by running one command.
https://create-react-app.dev
MIT License
102.26k stars 26.7k forks source link

v3.0.0 with Node v12/NPM 6.9.0 gives "TypeError: fsevents is not a constructor" #6891

Closed sekoyo closed 4 years ago

sekoyo commented 5 years ago

Is this a bug report?

Yes

Did you try recovering your dependencies?

Yes, tried clean install use Node v12 and NPM 6.9.0

Which terms did you search for in User Guide?

Anything about fsevents errors.

Environment

System: OS: macOS 10.14.4 CPU: x64 Intel(R) Core(TM) i7-4960HQ CPU @ 2.60GHz Binaries: Node: 12.0.0 - /usr/local/bin/node Yarn: 1.15.2 - ~/.npm-global/bin/yarn npm: 6.9.0 - ~/.npm-global/bin/npm Browsers: Chrome: 73.0.3683.103 Safari: 12.1 npmPackages: react: ^16.8.6 => 16.8.6 react-dom: ^16.8.6 => 16.8.6 react-scripts: 3.0.0 => 3.0.0 npmGlobalPackages: create-react-app: 2.1.8

Don't know why it says create-react-app: 2.1.8, if I do npm show create-react-app version it echos 3.0.0.

Steps to Reproduce

Install with NPM 6.9.0

Expected Behavior

npm start starts the server

Actual Behavior

fsevents throws:

/Users/.../node_modules/chokidar/lib/fsevents-handler.js:28
  return (new fsevents(path)).on('fsevent', callback).start();
          ^

TypeError: fsevents is not a constructor
    at createFSEventsInstance (/Users/.../Projects/fileflow/app/node_modules/chokidar/lib/fsevents-handler.js:28:11)
    at setFSEventsListener (/Users/.../Projects/fileflow/app/node_modules/chokidar/lib/fsevents-handler.js:82:16)
    at FSWatcher.FsEventsHandler._watchWithFsEvents (/Users/.../Projects/fileflow/app/node_modules/chokidar/lib/fsevents-handler.js:252:16)
    at FSWatcher.<anonymous> (/Users/.../Projects/fileflow/app/node_modules/chokidar/lib/fsevents-handler.js:386:25)
    at LOOP (fs.js:1622:14)
    at processTicksAndRejections (internal/process/task_queues.js:81:9)

Because even though chockidar depends on fsevents 1.2.8, it doesn't get installed, possibly due to chockidar declaring it as an optional dependency: https://github.com/paulmillr/chokidar/blob/master/package.json#L24

Screenshot 2019-04-24 at 22 20 03

Instead fsevents v2 gets installed which has a different API which exports a plain object (new keyword breaks on it).

⚠️ Works using yarn. (and older NPM versions as it worked on Node v11 I was using yesterday)

Reproducible Demo

Do create-create-app using NPM 6.9.0 and try to run it.

ghost commented 5 years ago

I had the same issue. How did you solve it?

fsepulveda commented 5 years ago

Same issue... TypeError: fsevents is not a constructor

node: v12.0.0 npm: 6.9.0 create-react-app: 3.0.0

ghost commented 5 years ago

I had the same issue. How did you solve it?

Updated 22:30 This worked for me:

  1. I deleted my react app because I realized I did not have yarn installed.
  2. So I installed yarn.
  3. Then, again I did npx create-react-app my-app, and it worked. The issue disappeared.

Other things I did:

sekoyo commented 5 years ago

For now you can downgrade Node, or remove node_modules and package-lock.json and do yarn install instead. Author of chokidar package said it will be fixed in upcoming v3.

nathan-charrois commented 5 years ago

This issue is very common.

See #6657 (reported by me), #2558, #3588, #4308.

Unfortunately all these threads lead to dead-ends. I've reproduced this error on a fresh, brand new iMac and on my Windows PC. For some reason it's never drawn any attention.

joshunger commented 5 years ago

It looks like Node.js v12 removed v8::Handle which fsevents@1.2.8 uses. See https://electronjs.org/blog/nodejs-native-addons-and-electron-5.

You can reproduce:

nvm use 12
yarn init
yarn add fsevents@1.2.8

Output:

  SOLINK_MODULE(target) Release/.node
  CXX(target) Release/obj.target/fse/fsevents.o
../fsevents.cc:43:32: error: no template named 'Handle' in namespace 'v8'
    static void Initialize(v8::Handle<v8::Object> exports);
sam-github commented 5 years ago

Fix in https://github.com/fsevents/fsevents/pull/271, waiting on https://github.com/nodejs/nan/issues/849

amitpatil321 commented 5 years ago

Giving up npm and using yarn helped me. I removed node_modules package.lock yarn.lock and then cleared npm cache with --force.

and then yarn install and yarn run...and its working!

ls-jonathan-jouret commented 5 years ago

FYI:

For me, removing node_module and yarn.lock then running yarn fixed the issue

galohernandez commented 5 years ago

I solved installing yarn and then sudo forever npm and node_modules. Try this https://timonweb.com/posts/install-npm-packages-without-sudo/ for permission issues. After that I created a new project and finally i go the dev server on

faustorenier commented 5 years ago

I had the same issue. How did you solve it?

Updated 22:30 This worked for me:

  1. I deleted my react app because I realized I did not have yarn installed.
  2. So I installed yarn.
  3. Then, again I did npx create-react-app my-app, and it worked. The issue disappeared.

Other things I did:

  • Installed node globally
  • Cleared the node caché

Worked for me, thanks mate!

george-afrah commented 5 years ago

For now you can downgrade Node, or remove node_modules and package-lock.json and do yarn install instead. Author of chokidar package said it will be fixed in upcoming v3.

This worked for me so well that I would recommend to any one in my situation, this morning. what happen to me: I've cloned react app() from github to local machine with:

Shahor commented 5 years ago
"resolutions": {
    "fsevents": "
}

Resolved the issue temporarily by adding this to my package.json.

Until chokidar releases their next version, the api is fully compatible with latest version so it should work just fine 👍

yairEO commented 5 years ago

@Shahor - Did as suggested but still not working :/

fr0zenK commented 5 years ago

all my problems i've got is from fsevents why so terrible :(

alan345 commented 5 years ago
rm -rf node_modules
rm -f yarn.lock 
yarn

Solve the issue

majda commented 5 years ago

Downgrading node version solves the issue.

Please note that I have uninstalled all versions of the Node on my machine (and yarn as well), and then, instead of installing Node manually, installed nvm. This allows you to switch between different versions of Node easily.

Once nvm is installed run nvm install node to install the specific version (I have installed 10.15.3)

To change Node version run nvm use <version>

Check you're set up correctly by running node -v

udhayakumaran commented 5 years ago

Giving up npm and using yarn helped me. I removed node_modules package.lock cleared npm cache with --force.

and then yarn install and yarn run...and its working!

This solution from @amitpatil321 worked for me. 👍

klimsava commented 5 years ago

very good way, thanks @majda

paigen11 commented 5 years ago

Same issue using node v11.10.0 and npm v6.9.0, my issue was solved as well by deleting the yarn.lock and node_modules and running yarn again. I hope this gets fixed soon - it's very annoying to do a fresh install and have it break immediately when I try to launch the app

diegodesouza commented 5 years ago

@DominicTobias What version of node works for you? I have tried several and yet no luck

sekoyo commented 5 years ago

@DominicTobias What version of node works for you? I have tried several and yet no luck

The LTS version works (10.6.0), I have 10.5.3

matthewstitt42959 commented 5 years ago

I was recently able to resolve this issue by going into the Node_module folder and finding fsevents folder. I changed the name of the folder to fsevent_old. I was then able to run React without an issue.

mattrafalko commented 5 years ago

I was able to resolve the issue with npm i -S fsevents. I did not have any luck with @Shahor 's fix, and I didn't try any solutions involving yarn as I don't use yarn.

vjpr commented 5 years ago

So chokidar@2 seems broken as pointed out in this comment.

We should use chokidar@3.

From OP's stack trace we can't see which package uses chokidar because its run async from a callback.

Go to the earliest line we have in the stack trace, and place a console.trace() outside the callback. For me it was fsevents-handler.js:333. This let me see that it was watchpack that depended on chokidar@2.

When using pnpm in a monorepo...

In a pnpm monorepo we can search for usages like so: pnpm ls --depth=100 --filter my-package chokidar, which also showed me:

└─┬ react-scripts@3.0.1
  ├─┬ react-dev-utils@9.0.1
  │ └─┬ fork-ts-checker-webpack-plugin@1.1.1
  │   └── chokidar@2.1.6
  ├─┬ webpack@4.29.6_webpack@4.29.6
  │ └─┬ watchpack@1.6.0
  │   └── chokidar@3.0.1
  └─┬ webpack-dev-server@3.2.1_webpack@4.29.6
    └── chokidar@3.0.1

Using pnpm and pnpmfile.js it can be patched like so:

if (pkg.name === 'watchpack') {
  pkg.dependencies['chokidar'] = '3.0.1'
}
// and webpack-dev-server and fork-ts...

Then trigger a reinstall like so:

pnpm up --depth=100 --filter my-package

This fixed it for me.

Garbuzov commented 5 years ago

I fix this issue using this command npm install -g chokidar

r742davis commented 5 years ago

I agree with @mattrafalko, the npm i fsevents solution worked for me. I also made sure to run npm i react-scripts since I was having an issue with npm start

drcmda commented 5 years ago

i tried everything except messing with with my node install, and unfortunately nothing worked. does anyone have a solution that works with yarn?

kroksys commented 5 years ago

I had the same problem because I created new project using sudo what caused permission conflict. $ sudo npx create-react-app my-app // Did not work

$ npx create-react-app my-app $ cd my-app && npm start // Work like a charm`

I hope this help someone to resolve this issue.

yalegria commented 5 years ago

Installing yarn fixed it for me.

frknasir commented 5 years ago

I was able to resolve the issue with npm i -S fsevents. I did not have any luck with @Shahor 's fix, and I didn't try any solutions involving yarn as I don't use yarn.

This did it for me. Thanks!!!

mvermadev commented 4 years ago

I had the same issue. How did you solve it?

Updated 22:30 This worked for me:

  1. I deleted my react app because I realized I did not have yarn installed.
  2. So I installed yarn.
  3. Then, again I did npx create-react-app my-app, and it worked. The issue disappeared.

Other things I did:

  • Installed node globally
  • Cleared the node caché

Worked for me, thanks mate!

Yes, Its work but unfortunately we did not found the actual error to resolve that permanently.

rathnak commented 4 years ago

It may seem weird, but I was able to get it working after running: $sudo npm install npm@latest -g

Parthan-Akon commented 4 years ago

I also had the same issue though am using MacOS the issue is kind of bug. I solved this issue by repeatedly running the commands,

One time it did not worked but when I repeatedly cleaned the cache and after uninstalling npm, reinstalled npm, the error went off. Am using Angular 8 and this issue is common

ronanmockett commented 4 years ago

I had the same problem because I created new project using sudo what caused permission conflict. $ sudo npx create-react-app my-app // Did not work

$ npx create-react-app my-app $ cd my-app && npm start // Work like a charm`

I hope this help someone to resolve this issue.

Thank you this worked for me!

mvermadev commented 4 years ago

Hello Ronan, if you are using 'npx' to create react app then you didn't need to add sudo command at the beginning. If you are using 'npm' then you need (if system want super user permission) to add at the beginning.

I hope you got it.

Regards, MANISH VERMA.

On Sat, 3 Aug 2019, 8:33 pm Ronan Mockett, notifications@github.com wrote:

I had the same problem because I created new project using sudo what caused permission conflict. $ sudo npx create-react-app my-app // Did not work

$ npx create-react-app my-app $ cd my-app && npm start // Work like a charm`

I hope this help someone to resolve this issue.

Thank you this worked for me!

— You are receiving this because you commented. Reply to this email directly, view it on GitHub https://github.com/facebook/create-react-app/issues/6891?email_source=notifications&email_token=AHTB43X5YKCKLDFEGOH4JFLQCWM3LA5CNFSM4HIIC3JKYY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGOD3PP7UQ#issuecomment-517930962, or mute the thread https://github.com/notifications/unsubscribe-auth/AHTB43SWARCISEUSMDECNYTQCWM3LANCNFSM4HIIC3JA .

marcosaimola commented 4 years ago

You need to install the yarn before creating your app

sudo npm i -g yarn npx create-react-app my-app cd my-app npm start

It have worked for me. ;)

mvermadev commented 4 years ago

Yes yarn is a good method to create react app.

On Mon, 5 Aug 2019, 9:48 pm marcosaimola, notifications@github.com wrote:

You need to install the yarn before creating your app

sudo npm i -g yarn npx create-react-app my-app cd my-app npm start

It have worked for me. ;)

— You are receiving this because you commented. Reply to this email directly, view it on GitHub https://github.com/facebook/create-react-app/issues/6891?email_source=notifications&email_token=AHTB43QHO734B3PK2CX6MZTQDBHFNA5CNFSM4HIIC3JKYY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGOD3SKGFI#issuecomment-518300437, or mute the thread https://github.com/notifications/unsubscribe-auth/AHTB43UFS7AFGJCXXVUCBH3QDBHFNANCNFSM4HIIC3JA .

Luke-Markham commented 4 years ago

sudo n 10.16.0 npx create-react-app my-app cd my-app npm install npm start

my fix above

mvermadev commented 4 years ago

If you want to use 'npx' then you must have npm 5.2+ version in your system.

On Tue, 6 Aug 2019, 8:59 am Luke Markham, notifications@github.com wrote:

sudo n 10.16.0 npx create-react-app my-app cd my-app npm install npm start

my fix above

— You are receiving this because you commented. Reply to this email directly, view it on GitHub https://github.com/facebook/create-react-app/issues/6891?email_source=notifications&email_token=AHTB43S2B2QFODJJADGGRMTQDDVZLA5CNFSM4HIIC3JKYY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGOD3TWXMA#issuecomment-518482864, or mute the thread https://github.com/notifications/unsubscribe-auth/AHTB43TMDTNDA3RMBL7AQJLQDDVZLANCNFSM4HIIC3JA .

sanalpanicker-zz commented 4 years ago

use npx create-react-app my-app --use-npm

lucassacheto commented 4 years ago

This worked for me:

npm audit fix --force

jasonfb commented 4 years ago

I had this problem on macOS 10.13 too while using yarn, on a brand new create-react-app. I do not have a node version set in my package.json file, but for reference here is the rest of my package.json

{
  "name": "star-ratings-basic",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "react": "^16.9.0",
    "react-dom": "^16.9.0",
    "react-scripts": "3.1.0"
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  },
  "eslintConfig": {
    "extends": "react-app"
  },
  "browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"
    ]
  }
}

this happened to me while using NVM (node version manager) and had these versions of node & npm active respectively

$ npm -v
node 6.10.2
$ node -v
v12.8.0

deleting my yarn.lock file & deleting the node_modules folder and then running yarn worked immediately.

interestingly, I was able to get a diff on the regenerated yarn lock file compared to the old one. as seen by git diff ( note minus and plus symbols )

-"@babel/code-frame@7.5.5", "@babel/code-frame@^7.5.5":
+"@babel/code-frame@7.5.5", "@babel/code-frame@^7.0.0", "@babel/code-frame@^7.5.5":
   version "7.5.5"
   resolved "https://registry.yarnpkg.com/@babel/code-frame/-/code-frame-7.5.5.tgz#bc0782f6d69f7b7d49531219699b988f669a8f9d"
   integrity sha512-27d4lZoomVyo51VegxI20xZPuSHusqbQag/ztrBC7wegWoQ1nLREPVSKSW8byhTlzTKyNE4ifaTA6lCp7JjpFw==
   dependencies:
     "@babel/highlight" "^7.0.0"

-"@babel/code-frame@^7.0.0":
-  version "7.0.0"
-  resolved "https://registry.yarnpkg.com/@babel/code-frame/-/code-frame-7.0.0.tgz#06e2ab19bdb535385559aabb5ba59729482800f8"
-  integrity sha512-OfC2uemaknXr87bdLUkWog7nYuliM9Ij5HUcajsVcMCpQrcLmtxRbVFTIqmcSkSeYRBFBRxs2FiUqFJDLdiebA==
-  dependencies:
-    "@babel/highlight" "^7.0.0"
-
 "@babel/core@7.5.5", "@babel/core@^7.1.0", "@babel/core@^7.4.5":
   version "7.5.5"
   resolved "https://registry.yarnpkg.com/@babel/core/-/core-7.5.5.tgz#17b2686ef0d6bc58f963dddd68ab669755582c30"
@@ -36,17 +29,6 @@
     semver "^5.4.1"
     source-map "^0.5.0"

-"@babel/generator@^7.1.3":
-  version "7.1.3"
-  resolved "https://registry.yarnpkg.com/@babel/generator/-/generator-7.1.3.tgz#2103ec9c42d9bdad9190a6ad5ff2d456fd7b8673"
-  integrity sha512-ZoCZGcfIJFJuZBqxcY9OjC1KW2lWK64qrX1o4UYL3yshVhwKFYgzpWZ0vvtGMNJdTlvkw0W+HR1VnYN8q3QPFQ==
-  dependencies:
-    "@babel/types" "^7.1.3"
-    jsesc "^2.5.1"
:
mvermadev commented 4 years ago

First update your nodejs in your system. And then if they're any issue then please demonstrate that to us.

On Sat, 10 Aug 2019, 11:44 pm Jason Fleetwood-Boldt, < notifications@github.com> wrote:

I had this problem on macOS 10.13 too while using yarn, on a brand new create-react-app. I do not have a node version set in my package.json file:

{ "name": "star-ratings-basic", "version": "0.1.0", "private": true, "dependencies": { "react": "^16.9.0", "react-dom": "^16.9.0", "react-scripts": "3.1.0" }, "scripts": { "start": "react-scripts start", "build": "react-scripts build", "test": "react-scripts test", "eject": "react-scripts eject" }, "eslintConfig": { "extends": "react-app" }, "browserslist": { "production": [ ">0.2%", "not dead", "not op_mini all" ], "development": [ "last 1 chrome version", "last 1 firefox version", "last 1 safari version" ] } }

this happened to me while using NVM (node version manager) and had these versions of node & npm active respectively

$ npm -v node 6.10.2 $ node -v v12.8.0

deleting my yarn.lock file & deleting the node_modules folder and then running yarn worked immediately.

interestingly, I was able to get a diff on the regenerated yarn lock file compared to the old one. as seen by git diff ( note minus and plus symbols )

-"@babel/code-frame@7.5.5", "@babel/code-frame@^7.5.5": +"@babel/code-frame@7.5.5", "@babel/code-frame@^7.0.0", "@babel/code-frame@^7.5.5": version "7.5.5" resolved "https://registry.yarnpkg.com/@babel/code-frame/-/code-frame-7.5.5.tgz#bc0782f6d69f7b7d49531219699b988f669a8f9d" integrity sha512-27d4lZoomVyo51VegxI20xZPuSHusqbQag/ztrBC7wegWoQ1nLREPVSKSW8byhTlzTKyNE4ifaTA6lCp7JjpFw== dependencies: "@babel/highlight" "^7.0.0"

-"@babel/code-frame@^7.0.0":

-"@babel/generator@^7.1.3":

— You are receiving this because you commented. Reply to this email directly, view it on GitHub https://github.com/facebook/create-react-app/issues/6891?email_source=notifications&email_token=AHTB43T2IWUIS5AWJFDFYCLQD4AQFA5CNFSM4HIIC3JKYY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGOD4ASOBA#issuecomment-520169220, or mute the thread https://github.com/notifications/unsubscribe-auth/AHTB43QG2QDKFLW4FD56OZ3QD4AQFANCNFSM4HIIC3JA .

jasonfb commented 4 years ago

seems like I can reproduce it…

$ node -v
v12.8.0
$ npm -v
6.10.2
$ create-react-app test-app

(normal create-react-app output truncated)

$ yarn start

the server starts, it clears the console and then the app crashes with this. at the same time Chrome opens to 127.0.0.1:3000 but to a "This site can’t be reached" page as the server is crashed

Starting the development server...

/Users/jason/Work/LEARNING/React_JS/testapp/node_modules/chokidar/lib/fsevents-handler.js:28
  return (new fsevents(path)).on('fsevent', callback).start();
          ^

TypeError: fsevents is not a constructor
    at createFSEventsInstance (/Users/jason/Work/LEARNING/React_JS/testapp/node_modules/chokidar/lib/fsevents-handler.js:28:11)
    at setFSEventsListener (/Users/jason/Work/LEARNING/React_JS/testapp/node_modules/chokidar/lib/fsevents-handler.js:82:16)
    at FSWatcher.FsEventsHandler._watchWithFsEvents (/Users/jason/Work/LEARNING/React_JS/testapp/node_modules/chokidar/lib/fsevents-handler.js:252:16)
    at FSWatcher.<anonymous> (/Users/jason/Work/LEARNING/React_JS/testapp/node_modules/chokidar/lib/fsevents-handler.js:386:25)
    at LOOP (fs.js:1576:14)
    at processTicksAndRejections (internal/process/task_queues.js:75:11)
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
$ 

I'm using nvm, and I have node 12.8.0 activated. should I do something else to update npm or node in my system? I'm not sure I understand if there's any steps I'm missing when you say "First update your nodejs in your system". am I not using the latest versions?

jasonfb commented 4 years ago

it appears to do this for me on every create-react-app I make

mvermadev commented 4 years ago

I also faced that situation in my system, so I researched alot about it then I got that, first Clean your yarn then I Cleaned my apt using 'sudo apt clean' then 'sudo apt update' for repair and updating packages then 'sudo apt upgrade' for require upgrades to my packages. Then create a new react app.

It might be work in your system.

On Sun, 11 Aug 2019, 8:35 am Jason Fleetwood-Boldt, < notifications@github.com> wrote:

it appears to do this for me on every create-react-app I make

— You are receiving this because you commented. Reply to this email directly, view it on GitHub https://github.com/facebook/create-react-app/issues/6891?email_source=notifications&email_token=AHTB43WWDNHDWMYC4MMCFRDQD56Y3A5CNFSM4HIIC3JKYY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGOD4AZBQY#issuecomment-520196291, or mute the thread https://github.com/notifications/unsubscribe-auth/AHTB43TKXK22WHSENSGKD4LQD56Y3ANCNFSM4HIIC3JA .

Yanzoo88 commented 4 years ago

I had the same problem because I created new project using sudo what caused permission conflict. $ sudo npx create-react-app my-app // Did not work

$ npx create-react-app my-app $ cd my-app && npm start // Work like a charm`

I hope this help someone to resolve this issue.

This worked for me too :) Cheers!

jasonfb commented 4 years ago

hmm sudo apt update does not work for me

$ sudo apt update
 Unable to locate an executable at "/Library/Java/JavaVirtualMachines/jdk1.8.0_152.jdk/Contents/Home/bin/apt" (-1)
jasonfb commented 4 years ago

incidentally I am on mac OS 10.13.6 using Xcode 9.4.1 with gcc clang version clang-902.0.39.2

I wonder if there's a way to blow away my yarn binary to clear the problem?