Cli: `npx react-native init AwesomeProject` not working
➜ npx react-native init AwesomeProject2
###### ######
### #### #### ###
## ### ### ##
## #### ##
## #### ##
## ## ## ##
## ### ### ##
## ######################## ##
###### ### ### ######
### ## ## ## ## ###
### ## ### #### ### ## ###
## #### ######## #### ##
## ### ########## ### ##
## #### ######## #### ##
### ## ### #### ### ## ###
### ## ## ## ## ###
###### ### ### ######
## ######################## ##
## ### ### ##
## ## ## ##
## #### ##
## #### ##
## ### ### ##
### #### #### ###
###### ######
Welcome to React Native!
Learn once, write anywhere
✔ Downloading template
✖ Copying template
error Error: Couldn't find the "/var/folders/w5/bsw5vt490q78cyx2_h42ldtw0000gn/T/rncli-init-template-nzsCCY/node_modules/react-native/template.config.js file inside "react-native" template. Please make sure the template is valid. Read more: https://github.com/react-native-community/cli/blob/master/docs/init.md#creating-custom-template
I'm on Mac OS and don't have the react-native cli installed globally.
peterp
All 34 comments
Maybe it's something with permissions? We've seen a few users having similar issues and reasons were varying. We can't really reproduce it ourselves. If you could debug this (clone this repo and follow CONTRIBUTING.md instructions), we'd be thankful for your help
thymikee
on 19 Mar 2020
Running sudo npx react-native init AwesomeProject2 made it work. The download too way longer than before, so I'm guessing that it could not stream the download into the destination correctly.
Obviously running as sudo has implications, but writing down my stream of thoughts as I debug this may be helpful to others.
peterp
on 19 Mar 2020
Awesome, that's something! I suspect we swallow an important error, which should surface earlier. Also, ideas why you would need sudo to make it work? Do you have Node.js installed globally (with sudo) and not as a user?
thymikee
on 19 Mar 2020
I can't really think of a reason why this would fail, most npx/ yarn create scripts don't.
~/Personal/cli (master)
➜ which node
/usr/local/bin/node
~/Personal/cli (master)
➜ ll /usr/local/bin/node
lrwxr-xr-x 1 peterp admin 30B Feb 24 14:19 /usr/local/bin/node -> ../Cellar/node/13.8.0/bin/node
It appears to have something to do with both yarn and npm not wanting to run in the os.tmpdir(),
as an example:
➜ pwd
/var/folders/w5/bsw5vt490q78cyx2_h42ldtw0000gn/T/x
➜ ll .
total 0
drwxr-xr-x 2 peterp staff 64B Mar 19 15:55 .
drwx------@ 3838 peterp staff 120K Mar 19 16:11 ..
➜ yarn add react-native@latest
yarn add v1.22.0
warning package.json: No license field
warning package-lock.json found. Your project contains lock files generated by tools other than Yarn. It is advised not to mix package managers in order to avoid resolution inconsistencies caused by unsynchronized lock files. To clear this warning, remove package-lock.json.
warning No license field
[1/4] 🔍 Resolving packages...
[2/4] 🚚 Fetching packages...
[3/4] 🔗 Linking dependencies...
warning "react-native > [email protected]" has unmet peer dependency "@babel/core@*".
warning " > [email protected]" has unmet peer dependency "[email protected]".
[4/4] 🔨 Building fresh packages...
warning No license field
success Saved 1 new dependency.
info Direct dependencies
└─ [email protected]
info All dependencies
└─ [email protected]
✨ Done in 1.90s.
➜ ll .
total 0
drwxr-xr-x 2 peterp staff 64B Mar 19 15:55 .
drwx------@ 3838 peterp staff 120K Mar 19 16:11 ..
Bone dry! Running yarn add react-native@latest works in any other directory.
peterp
on 19 Mar 2020
Um, but did you create a package.json? And a directory inside $TMP?
What if you try:
mkdir rncli-tmp
cd rncli-tmp
yarn init -y
yarn add react-native
ls -al
This succeeds on my end and creates
drwxr-xr-x 5 thymikee x 160 Mar 19 16:39 .
drwx------@ 275 thymikee x 8800 Mar 19 16:39 ..
drwxr-xr-x 467 thymikee x 14944 Mar 19 16:39 node_modules
-rw-r--r-- 1 thymikee x 145 Mar 19 16:39 package.json
-rw-r--r-- 1 thymikee x 204778 Mar 19 16:39 yarn.lock
$ cat package.json
{
"name": "rncli-tmp",
"version": "1.0.0",
"main": "index.js",
"license": "MIT",
"dependencies": {
"react-native": "^0.61.5"
}
}
I'm tracing the commands that react-native's cli executes, I did not create a package.json, since the cli doesn't do that and I created a directory within the same temporary folder that the cli uses.
peterp
on 19 Mar 2020
Yea, CLI doesn't "create" a package.json, it's copied over from the template.
thymikee
on 19 Mar 2020
The step I'm referencing is run before the package.json is copied. The package.json is copied after yarn add react-native@latest
I believe that yarn init -y needs to be run before running yarn add
Would you want to jump on a call, or something, so that I can show you?
peterp
on 19 Mar 2020
The line that is failing is the step that creates the template. The step that creates the template runs: yarn add react-native@latest
peterp
on 19 Mar 2020
On my end it yarn add works with or without package.json in a temporary directory. Does it work in any case for you, without sudo?
I can see that you have the same permissions set on tmp dir as mine, so that seems fine.
Another thing that comes to my mind is that this call
https://github.com/react-native-community/cli/blob/4dbfc7751aee90c5e9c78286b3825796a4d332ab/packages/cli/src/commands/init/init.ts#L92-L94
creates a directory with permissions that prevent you from installing. But even so, Yarn would throw EACCES then. Let me know if you find out more about it
thymikee
on 19 Mar 2020
On my end it yarn add works with or without package.json in a temporary directory. Does it work in any case for you, without sudo?
It does not work in the temporary directory.
This line does create the directory with the correct permissions, but running yarn add does not work in the tmp directory it created.
Interestingly enough other yarn create commands that work in the tmp directory works fine.
My yarn is installed via homebrew.
peterp
on 19 Mar 2020
Steps that do work in the temporary folders is to run yarn init -y before running yarn add react-native
peterp
on 19 Mar 2020
Steps that do work in the temporary folders is to run
yarn init -ybefore runningyarn add react-native
Cc @Esemesek. I think we could do init, just need to figure out something that works with yarn and npm :)
thymikee
on 19 Mar 2020
So is there a temporary workaround here? Can this be avoided by just using a different version of the cli?
mdgilene
on 22 Mar 2020
Basically I got similar issues when using npm. This depends on how node.js is installed. When using NVM it is using the home directory to cache npx stuff. With system installation, I got into the same problem as above on mac.
As my target was to design workshops I always tell people to install yarn as there are numerous issues that are related to the way that packages are installed with npm that introduce strange errors while for yarn all things work.
wtrocki
on 25 Mar 2020
The alternative is to follow NPM create-x to get templates. This is very common and I found some people trying to do it without checking if that is actually supported.
wtrocki
on 25 Mar 2020
To add also I found people doing also trying npx react-native-cli create which is not going to work
wtrocki
on 25 Mar 2020
I honestly have no idea where people get these from. Official docs are clear:
thymikee
on 25 Mar 2020
Since I already have been using cli extensively I have tested it on mac:
npx react-native init AwesomeProject
MacOS Catalina
Nvm versions:
lts/dubnium -> v10.19.0
lts/erbium -> v12.16.1
In all cases finished successfully:
Downloading template
✔ Copying template
✔ Processing template
✔ Installing CocoaPods dependencies (this may take a few minutes)
Run instructions for iOS:
• cd "react-native/MyApp" && npx react-native run-ios
- or -
• Open MyApp/ios/MyApp.xcworkspace in Xcode or run "xed -b ios"
• Hit the Run button
Run instructions for Android:
• Have an Android emulator running (quickest way to get started), or a device connected.
• cd "/react-native/MyApp" && npx react-native run-android
In Windows 10 doesn't work.
victorwpbastos
on 27 Mar 2020
@victorwpbastos Does it work with sudo?
thymikee
on 27 Mar 2020
@victorwpbastos Does it work with
sudo?
I'm on a Windows 10 machine. I don't have sudo. I did try with Powershell in administrator mode but it doesn't work either.
victorwpbastos
on 27 Mar 2020
Right, made a shortcut, sorry about that. Can I ask you to try debugging it? There's an instruction in CONTRIBUTING.md on how to use the CLI locally. You could comment out this line:
https://github.com/react-native-community/cli/blob/d21c21ee133e2b03489414051cccf84d6d470003/packages/cli/src/commands/init/init.ts#L137
cd into this tmp directory and see what's there, why is there no template.config.js in node_modules/react-native
thymikee
on 27 Mar 2020
The folder is empty:
victorwpbastos
on 27 Mar 2020
What happens if you run yarn add react-native there? Or npm install --save react-native? Does it work? If not, does it work if you run yarn init -y / create package.json first? Maybe you run into the same issue as https://github.com/react-native-community/cli/issues/1063#issuecomment-601320363 ?
thymikee
on 27 Mar 2020
yarn add react-native did nothing. But yarn init -y and yarn add react-native works.
victorwpbastos
on 27 Mar 2020
Then we need to run yarn init -y/npm init -y prior that. Do you fancy contribute this change and make a PR? 🙂
thymikee
on 27 Mar 2020
Done. PR #1077. It's my first PR to this project! I'm very happy to contribute.
victorwpbastos
on 27 Mar 2020
Well in my case it was not working today with all latest version of npm and node. I uninstalled the node and npm. Then I install the nvm and using nvm I install node. After this I use npx react-native init MyApp it works.
badarshahzad
on 5 May 2020
I found a great work around for this frustrating and soul crushing problem with initializing for react-native.
I'm a windows user (of course the documentation is Mac centric another problem which keeps so many windows users frustrated with the complex react-native learning curve).
I do have both Yarn and NPM and didn't want to start the terrible consequences of removing one or both and reinstalling. THIS IS A PROBLEM WITH THE TEMP DIRECTORIES!!! (As stated above).
I edited my windows environment variables for my self as the user....
TEMP = C:\Users\bcanin01\tmp was changed to TEMP = d:\tmp (make sure to create the directory!)
TMP was changed to d:\temp2.
ran npx react-native init Test99
and.... FOR THE FIRST TIME EVER I was able to create a react-native project without an hour of manual labor and headaches!!!
THIS WORKS! Just change your temp directories, it affects nothing (that I can see) and worked.
p.s. don't know if it was important (probably not) but when i opened my command shell in windows make sure to open it with admin permissions...
cyphire
on 5 May 2020
@cyphire So the problem seems is with lack of permissions, I don't think we can do anything about it. Maybe throw a better error if we have enough information?
thymikee
on 5 May 2020
That make sense, but instead of using the temp directories, couldn't
react-native init create temp directories in the newly created directory
and then just erase them??? Maybe take the environment out of the picture?
cyphire
on 5 May 2020
Worth exploring that path
thymikee
on 5 May 2020
Related issues
mauricioscotton
·
3Comments
jchook
·
4Comments
lucasbento
·
3Comments
tallpants
·
4Comments
sophister
·
4Comments
Most helpful comment
Running
sudo npx react-native init AwesomeProject2made it work. The download too way longer than before, so I'm guessing that it could not stream the download into the destination correctly.Obviously running as sudo has implications, but writing down my stream of thoughts as I debug this may be helpful to others.