Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Support Yarn #896

Closed
cpojer opened this issue Oct 11, 2016 · 30 comments
Closed

Support Yarn #896

cpojer opened this issue Oct 11, 2016 · 30 comments

Comments

@cpojer
Copy link
Contributor

cpojer commented Oct 11, 2016

https://github.com/yarnpkg/yarn

We released Yarn, a faster alternative to the npm client. Can create-react-app detect when yarn is installed (or install yarn?) for faster app creation?

@gaearon
Copy link
Contributor

gaearon commented Oct 11, 2016

Yep. If somebody wants to implement this please comment in this issue so we don't duplicate effort.

@gaearon
Copy link
Contributor

gaearon commented Oct 11, 2016

(Let's not install yarn, but let's detect it.)

@gaearon gaearon mentioned this issue Oct 11, 2016
@fson
Copy link
Contributor

fson commented Oct 11, 2016

I'm going to work on this.

@notahat
Copy link

notahat commented Oct 11, 2016

I just did some quick testing with yarn and create-react-app, and found a problem:

$ create-react-app rhubarb
Creating a new React app in /Users/pete/Desktop/rhubarb.

Installing packages. This might take a couple minutes.
Installing react-scripts from npm...

...

Success! Created rhubarb at /Users/pete/Desktop/rhubarb
Inside that directory, you can run several commands:

  npm start
    Starts the development server.

  npm run build
    Bundles the app into static files for production.

  npm test
    Starts the test runner.

  npm run eject
    Removes this tool and copies build dependencies, configuration files
    and scripts into the app directory. If you do this, you can’t go back!

We suggest that you begin by typing:

  cd rhubarb
  npm start

Happy hacking!

$ cd rhubarb

$ rm -rf node_modules

$ yarn
yarn install v0.15.1
info No lockfile found.
[1/4] 🔍  Resolving packages...
warning react-scripts > jest > jest-cli > istanbul-api > fileset > [email protected]: Please update to minimatch 3.0.2 or higher to avoid a RegExp DoS issue
[2/4] 🚚  Fetching packages...
[3/4] 🔗  Linking dependencies...
[4/4] 📃  Building fresh packages...
success Saved lockfile.
✨  Done in 19.01s.

$ yarn start
yarn start v0.15.1
$ "react-scripts start"
sh: react-scripts start: command not found
error Command failed with exit code 127.
info Visit http://yarnpkg.com/en/docs/cli/start for documentation about this command.

Manually running ./node_modules/react-scripts/bin/react-scripts.js start works just fine.

Yarn does seem to set things up correctly:

$ ls node_modules/.bin
react-scripts

$ ./node_modules/.bin/react-scripts start
Starting the development server...

I added "env": "env" to my scripts in package.json to try to see what was going on with the path:

$ yarn run env
yarn run v0.15.1
$ "env"
...
PATH=/Users/pete/Desktop/rhubarb/node_modules/.bin:...
...

That looks legit to me, so I'm not sure why everything is failing. Smells like either a yarn problem, or something strange in my environment. Either way, I thought it was worth documenting here for folks looking into yarn and create-react-app interactions.

@fson
Copy link
Contributor

fson commented Oct 11, 2016

@notahat For me that works without problems and yarn start starts the development server. I wonder if the problem is somehow specific to your environment (I'm using Node v6.7.0 on macOS).

@notahat
Copy link

notahat commented Oct 11, 2016

@fson Interesting. I'm on Node 4. I'll keep digging and see what I find.

@rdmurphy
Copy link

I can confirm I'm seeing the same exact error, and I did the same exact thing as @notahat (down to the rhubarb 😁 ). But I'm on Node v6.7.0 + macOS 10.12 too.

I tried the other variations like yarn run start and yarn run build and all throw the same command not found errors. Can confirm that npm start and the rest of the gang still work.

@notahat
Copy link

notahat commented Oct 11, 2016

Yep, I just tested on 6.7.0 and had the same problem. Also MacOS 10.12.

@fson
Copy link
Contributor

fson commented Oct 11, 2016

Ok, I tried with a fresh Node installation on another laptop and was able to reproduce the issue with the same commands as @notahat. I'll dig deeper in the morning, unless someone finds out why it doesn't work before then.

@cpojer
Copy link
Contributor Author

cpojer commented Oct 11, 2016

Note you'll need to update the create react app global cli to use yarn instead of npm if available, otherwise cra will keep shelling out to npm and the install time will be slow.

@notahat
Copy link

notahat commented Oct 11, 2016

I can see what's going on, although I'm not sure why yet.

I added this to my scripts: "abracadabra": "react-scripts"

$ yarn run abracadabra
yarn run v0.15.1
$ "react-scripts"
Unknown script "undefined".
Perhaps you need to update react-scripts?
✨  Done in 1.38s.

So that works!

So with yarn start, yarn is trying to use react-scripts start as the command name, rather than react-scripts as the command name, and start as an argument.

@gaearon
Copy link
Contributor

gaearon commented Oct 11, 2016

Please file an issue in Yarn?

@fson
Copy link
Contributor

fson commented Oct 11, 2016

@cpojer Yup, my plan is to check if the yarn command is available and if it is, use that to install the dependencies. We might be even able to check this by just trying to run it and falling back to npm if that fails.

On Wed, 12 Oct 2016 at 02:36 Christoph Pojer

<
mailto:Christoph Pojer [email protected]

wrote:

a, pre, code, a:link, body { word-wrap: break-word !important; }

Note you'll need to update the create react app global cli to use yarn instead of npm if available, otherwise cra will keep shelling out to npm and the install time will be slow.

You are receiving this because you were mentioned.

Reply to this email directly,
#896 (comment)
, or
https://github.com/notifications/unsubscribe-auth/AAeWPlGEjzWnA4nuGS9BLdKkktGq_bayks5qzB2agaJpZM4KT29X
.

@arunoda
Copy link
Contributor

arunoda commented Oct 12, 2016

This is great.
I also add support for our getstorybook tool to use yarn.
Here's how we do it:

Use install getstorybook globally using yarn:

yarn global add getstorybook

Then after that getstorybook uses yarn to install deps.
This is how we detect yarn. It's not elegant, but it's working pretty well.

@cerisier
Copy link

@notahat Why are you running "react-scripts start" as a single command and not as react-scripts start as 1 command and 1 argument ?

Your shell complains about:

sh: react-scripts start: command not found

and not

sh: react-scripts: command not found

Seems the error is on your side.

@ben174
Copy link

ben174 commented Oct 12, 2016

Looks like this got fixed with yarnpkg/yarn#809

@fson fson mentioned this issue Oct 12, 2016
@jcperez-ch
Copy link

jcperez-ch commented Oct 17, 2016

as per today @ben174 it was merged to [email protected] release but I was still having the issue. Then I went to yarnpkg/yarn#809 comments and found that the issue is onlt for those installing yarn via npm install -g yarn, I used the curl command and it works fine. Seems like yarn team is working on it for version 0.15.2. So, confirmed this is not an issue of create-react-app or react-scripts. ;)

@devilleweppenaar
Copy link

devilleweppenaar commented Oct 19, 2016

Not sure if this is the appropriate place, or whether I should create a separate issue, but running tests (via npm t) does not work after installing packages with yarn.

I got the following error:

Determining test suites to run...2016-10-19 16:10 node[43650] (FSEvents.framework) FSEventStreamStart: register_with_server: ERROR: f2d_register_rpc() => (null) (-22)
2016-10-19 16:10 node[43650] (FSEvents.framework) FSEventStreamStart: register_with_server: ERROR: f2d_register_rpc() => (null) (-22)
2016-10-19 16:10 node[43650] (FSEvents.framework) FSEventStreamStart: register_with_server: ERROR: f2d_register_rpc() => (null) (-22)
events.js:160
      throw er; // Unhandled 'error' event
      ^

Error: Error watching file for changes: EMFILE
    at exports._errnoException (util.js:1026:11)
    at FSEvent.FSWatcher._handle.onchange (fs.js:1406:11)
npm ERR! Test failed.  See above for more details.

Setup:

  • Node v6.9.0
  • yarn v0.16.0
  • macOS Sierra v10.12

@ShMcK
Copy link

ShMcK commented Oct 19, 2016

A simple bash detection script might be the easiest solution:

if which yarn > /dev/null; then
  yarn
else
  npm install
fi

@fhelwanger
Copy link

@ShMcK it should work on Windows too.

@ShMcK
Copy link

ShMcK commented Oct 19, 2016

I assumed bash might do, looking at the tasks directory, but now I see that's just for build, release and testing.

You're right. Though I would assume there is an equally simple if/then detection script for windows.

@fson
Copy link
Contributor

fson commented Oct 19, 2016

I implemented the detection by simply trying to start yarn and checking if that fails with ENOENT, in which case npm will be used (see #898). This will also work on Windows because we use cross-spawn to spawn the process.

@abhishekpillai
Copy link

abhishekpillai commented Oct 19, 2016

Just wanted to confirm that homebrew now has yarn v0.16.0, which I wasn't able to do as of yesterday

So, I was able to run brew upgrade yarn and the following issue faced by @notahat, @cerisier, and myself (and likely others) was resolved:

$ yarn start
yarn start v0.15.1
$ "react-scripts start"
sh: react-scripts start: command not found
error Command failed with exit code 127.
info Visit http://yarnpkg.com/en/docs/cli/start for documentation about this command.

Seems like it was fixed by this PR: yarnpkg/yarn#809

@notahat
Copy link

notahat commented Oct 20, 2016

Yep, can confirm that it's solved in 0.16.0 for me.

@gaearon
Copy link
Contributor

gaearon commented Oct 28, 2016

What is the status of fsevents install? Does it get optionally installed as we need on OS X?

@gaearon
Copy link
Contributor

gaearon commented Nov 20, 2016

Fixed by #898.

@gaearon gaearon closed this as completed Nov 20, 2016
@songololo
Copy link

songololo commented Apr 15, 2017

create-react-app does not detect yarn on my system and exits with the npm not found error.

Is this possibly something to do with the mac ports install location at /opt/local/bin?

yarn version 0.22.0
create-react-app version 1.3.0

@fson
Copy link
Contributor

fson commented Apr 15, 2017

@Shongololo could you give the full error message you get from create-react-app and the output of following commands on your system:

which yarn
which yarnpkg
yarnpkg --version

@songololo
Copy link

@fson this is the error message:

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

/bin/sh: npm: command not found
events.js:160
      throw er; // Unhandled 'error' event
      ^

Error: spawn npm ENOENT
    at exports._errnoException (util.js:1018:11)
    at Process.ChildProcess._handle.onexit (internal/child_process.js:193:32)
    at onErrorNT (internal/child_process.js:367:16)
    at _combinedTickCallback (internal/process/next_tick.js:80:11)
    at process._tickCallback (internal/process/next_tick.js:104:9)
    at Module.runMain (module.js:606:11)
    at run (bootstrap_node.js:393:7)
    at startup (bootstrap_node.js:150:9)
    at bootstrap_node.js:508:3

for the versions:

which yarn
/opt/local/bin/yarn

whereas which yarnpkg and yarnpkg --version are not found.

@gaearon
Copy link
Contributor

gaearon commented Apr 15, 2017

Even if you have Yarn I'd still recommend installing npm. As I understand the program crashes when it falls back to npm. Many other programs will assume npm exists.

In your particular case please create a symbolic link from yarnpkg to yarn, and CRA then will pick it up. It comes in the default distribution so you should file an issue (with yarn or whatever distributed yarn on your system) about a missing yarnpkg alias.

@lock lock bot locked and limited conversation to collaborators Jan 22, 2019
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Projects
None yet
Development

No branches or pull requests