geolessel / react-phoenix

Make rendering React.js components in Phoenix easy
http://reactphoenix.com
MIT License
504 stars 38 forks source link

npm "no such file or directory", ansi-regex related #35

Closed danpizz closed 6 years ago

danpizz commented 6 years ago

I'm using npm 6.1.0, trying to install {:react_phoenix, "~> 0.6"} but get this error:

npm WARN assets No description

npm ERR! path [...]/assets/node_modules/.staging/react-phoenix-9fe48a1f/node_modules/ansi-regex
npm ERR! code ENOENT
npm ERR! errno -2
npm ERR! syscall rename
npm ERR! enoent ENOENT: no such file or directory, rename '[...]/assets/node_modules/.staging/react-phoenix-9fe48a1f/node_modules/ansi-regex' -> '[...]/assets/node_modules/.staging/ansi-regex-174fca70'
npm ERR! enoent This is related to npm not being able to find a file.
npm ERR! enoent 

npm ERR! A complete log of this run can be found in:
npm ERR!     /[...]/.npm/_logs/2018-06-06T10_23_11_585Z-debug.log

updated npm, cleaned caches etc. with no success. Maybe related to #23

danpizz commented 6 years ago

Resolved somehow fiddling with package.json and npm

anthonylebrun commented 6 years ago

I'm still having this issue as well, #23 is spot on :(

geolessel commented 6 years ago

I'm using npm verson 5.6.0 and all seemed to work. 🤔

@anthonylebrun would you mind posting the contents of your assets/package.json file?

anthonylebrun commented 6 years ago

Sure thing. One thing to note is that I'm using an older react version (because I need react-grid-layout and it build properly with React 16), but I don't think that's related...

I was able to get past the issue by using @sickill's symlink suggestion in the #23 discussion.

{
  "repository": {},
  "license": "MIT",
  "scripts": {
    "deploy": "brunch build --production",
    "watch": "brunch watch --stdin"
  },
  "dependencies": {
    "@khanacademy/react-multi-select": "^0.2.6",
    "@navjobs/upload": "^3.1.3",
    "animate.css": "^3.6.1",
    "axios": "^0.17.1",
    "bulma": "0.6.1",
    "currency-formatter": "^1.4.2",
    "lodash": "^4.17.4",
    "microlinkjs": "^2.1.0",
    "moment": "^2.20.1",
    "phoenix": "file:../deps/phoenix",
    "phoenix_html": "file:../deps/phoenix_html",
    "pretty-checkbox": "^3.0.3",
    "react": "^15.6.2",
    "react-contenteditable": "^2.1.0",
    "react-currency-input": "^1.3.6",
    "react-day-picker": "^7.1.9",
    "react-dom": "^15.6.2",
    "react-form": "^3.5.5",
    "react-grid-layout": "^0.16.6",
    "react-modal": "^3.4.4",
    "react-pell": "^0.4.0",
    "react-phoenix": "file:deps/react_phoenix",
    "sass-brunch": "^2.10.4",
    "uuid": "^3.2.1",
    "wolfy87-eventemitter": "^5.2.4"
  },
  "devDependencies": {
    "babel": "^6.23.0",
    "babel-brunch": "6.1.1",
    "babel-preset-es2015": "^6.24.1",
    "babel-preset-react": "^6.24.1",
    "babel-preset-stage-3": "^6.24.1",
    "brunch": "2.10.12",
    "clean-css-brunch": "2.10.0",
    "copycat-brunch": "^1.1.0",
    "uglify-js-brunch": "2.10.0"
  }
}
buildWithSoul commented 5 years ago

i just ran into this, and I removed the node-modules, package.json, as well as deps- reinstalled everything and it worked

tmorton commented 5 years ago

I also struggled with this issue. No amount of re-installing things fixed the problem, but I have both a work-around, and a theory on why this is happening.

@geolessel Would you be open to a README paragraph about this problem? I can prep an MR later this week.

The work-around

This is based on @sickill's comment: https://github.com/geolessel/react-phoenix/issues/23#issuecomment-346944988. It works for me, both locally and on Heroku, with NPM 6.4.1

From your assets directory: ln -s ../deps/react_phoenix link_to_react_phoenix

Then in package.json, change the dependency for react_phoenix to:

"react-phoenix": "file:link_to_react_phoenix",

Then remove and re-install everything:

rm -rf node_modules
npm install

Speculation on why this happens

This package includes a package-lock.json, which "normal" NPM packages will not include. NPM is supposed to ignore it, according to their docs, anywhere other than a "toplevel package".

I think NPM is not ignoring that file. There is probably a bug in NPM, related to the use of file:../ paths, so it treats the react-phoenix package-lock.json as a toplevel file. So it's looking for the files specified there, which your app probably doesn't have.

Using the symlink, and not a .. path, seems to fix the problem, so NPM does not try to use the react-phoenix dependencies from its package-lock.json

gopala000 commented 5 years ago

Deleting the package-lock.json file and "npm install" again fixed the problem for me.

Shadam commented 4 years ago

Same thing here...

Run npm shrinkwrap and then npm install

And all be good 👍