btholt/complete-intro-to-react-v5

Parcel auto installs packages with yarn not npm causing errors

plinnegan opened this issue · 0 comments

Up to this point 'Calling the pet api' commit 0f7977 is using npm only, however in this part of the video where Brian imports "@frontendmasters/pet" and hits save, parcel now uses yarn to install the package, even though there is a package-lock.json (not your fault I realise 😅).

Steps to reproduce:

(have yarn installed on your system)

  1. git clone https://github.com/btholt/complete-intro-to-react-v5.git
  2. cd complete-intro-to-react-v5/
  3. git checkout 0f7977a
  4. npm install
  5. npm run dev
  6. cd src
  7. touch SearchParams.js
  8. Add content of SearchParams file from video up till this point
  9. Open App.js and import SearchParams
  10. Hit save when parcel is running
  11. I got the attached logs
    err.log

If there is some way to specify that parcel should use npm if it finds a package-lock.json that would be great, but I realise that's out of your control! It seems stupid to me to use yarn when parcel can clearly see there is a package-lock.json and no yarn.lock.

Fix:
Delete the yarn.lock, then install the package manually using:
npm i @frontendmasters/pet

Related parcel issue: parcel-bundler/parcel#2117

It seems because I have yarn installed it uses that, even though it can see I have a package-lock.json in my project. So it assumed based on me having yarn installed rather than my specific project config, which seems wrong to me.