facebook / react-native

A framework for building native applications using React
https://reactnative.dev
MIT License
117.27k stars 24.1k forks source link

iOS Build Error with `npx react-native` | UPDATE: Potential $CDPATH collision #35747

Closed devophyte closed 1 year ago

devophyte commented 1 year ago

Description

Not sure this is a bug. I'm new to React Native and encountered build errors. I switched to using Expo, which worked, but wanted to figure out what it is that is interfering with a vanilla install of React on a hardly used MacBook Air.

Fresh install of Xcode 14.2 and Command Line Tools for Xcode.

node -v  # v18.12.1
yarn -v  # 3.3.1
npx react-native info # 0.70.6

The project creates, yarn start spins up Metro, but yarn ios encounters an error during the build process.

BuildError.log

Version

0.70.6

Output of npx react-native info

info Fetching system and libraries information...
System:
    OS: macOS 13.1
    CPU: (4) x64 Intel(R) Core(TM) i5-8210Y CPU @ 1.60GHz
    Memory: 25.65 MB / 8.00 GB
    Shell: 3.2.57 - /bin/bash
  Binaries:
    Node: 18.12.1 - ~/.nvm/versions/node/v18.12.1/bin/node
    Yarn: 3.3.1 - ~/.nvm/versions/node/v18.12.1/bin/yarn
    npm: 9.2.0 - ~/.nvm/versions/node/v18.12.1/bin/npm
    Watchman: Not Found
  Managers:
    CocoaPods: 1.11.3 - /usr/local/bin/pod
  SDKs:
    iOS SDK:
      Platforms: DriverKit 22.2, iOS 16.2, macOS 13.1, tvOS 16.1, watchOS 9.1
    Android SDK: Not Found
  IDEs:
    Android Studio: Not Found
    Xcode: 14.2/14C18 - /usr/bin/xcodebuild
  Languages:
    Java: Not Found
  npmPackages:
    @react-native-community/cli: Not Found
    react: 18.1.0 => 18.1.0 
    react-native: 0.70.6 => 0.70.6 
    react-native-macos: Not Found
  npmGlobalPackages:
    *react-native*: Not Found

Steps to reproduce

Terminal 1

npx react-native init Test  # success!
cd Test
yarn set version stable
yarn install
yarn add pod-install
yarn pod-install ios
yarn start  # success!

Terminal 2

cd Test
yarn ios # build error!

Snack, code example, screenshot, or link to a repository

None.

Comments / Interesting Discoveries

Something odd (found in the attached log) is an error that seems to be pointing to a .js file in an unrelated node project. On this machine the only reason I can think that it would search there would be due to overloading the CDPATH (i.e.export CDPATH=~/node-apps/sails:$CDPATH) in ~/.bashrc

node:internal/modules/cjs/loader:998
  throw err;
  ^

Error: Cannot find module '/Users/developer/node-apps/sails/scripts/generate-specs-cli.js'
    at Module._resolveFilename (node:internal/modules/cjs/loader:995:15)
    at Module._load (node:internal/modules/cjs/loader:841:27)
    at Function.executeUserEntryPoint [as runMain] (node:internal/modules/run_main:81:12)
    at node:internal/main/run_main_module:23:47 {
  code: 'MODULE_NOT_FOUND',
  requireStack: []
}

Removing that from the equation (unset CDPATH) and a build error still occurs.

Oddly, I ran it again and build error with output too long, so went to redirect to a file (> BuildError.log) then quickly noticed that was going to log standard output, so issued a Command+C to quit the process and (2> BuildError.log) to capture the error messages. What happened? ... it ran successfully?

$ yarn ios 2> BuildError.log

info Found Xcode workspace "Test.xcworkspace"
info Building (using "xcodebuild -workspace Test.xcworkspace -configuration Debug -scheme Test -destination id=EDF41749-5A8C-4B66-80B2-9F5CDC9BB6E2")
success Successfully built the app
info Installing "/Users/developer/Library/Developer/Xcode/DerivedData/Test-dgirdvjytdbuutfcygtogcekjinb/Build/Products/Debug-iphonesimulator/Test.app"
info Launching "org.reactjs.native.example.Test"
success Successfully launched the app on the simulator

I have no idea what's going on.

That's the STDOUT output. The BuildError.log is a bunch of build and expected output, but I don't get why it worked this time after a few failures. I'm going to walk through the steps again.

devophyte commented 1 year ago

Round 2: Re-run

To ensure CDPATH was not a factor I unset it. Now I get an error when initializing a new project:

unset CDPATH
npx react-native init Test2
               ######                ######               
             ###     ####        ####     ###             
            ##          ###    ###          ##            
            ##             ####             ##            
            ##             ####             ##            
            ##           ##    ##           ##            
            ##         ###      ###         ##            
             ##  ########################  ##             
          ######    ###            ###    ######          
      ###     ##    ##              ##    ##     ###      
   ###         ## ###      ####      ### ##         ###   
  ##           ####      ########      ####           ##  
 ##             ###     ##########     ###             ## 
  ##           ####      ########      ####           ##  
   ###         ## ###      ####      ### ##         ###   
      ###     ##    ##              ##    ##     ###      
          ######    ###            ###    ######          
             ##  ########################  ##             
            ##         ###      ###         ##            
            ##           ##    ##           ##            
            ##             ####             ##            
            ##             ####             ##            
            ##          ###    ###          ##            
             ###     ####        ####     ###             
               ######                ######               

                  Welcome to React Native!                
                 Learn once, write anywhere               

✔ Downloading template
✔ Copying template
✔ Processing template
✔ Installing Bundler
✖ Installing CocoaPods dependencies (this may take a few minutes)
error warn Multiple Podfiles were found: ios/Podfile,vendor/bundle/ruby/2.7.0/gems/cocoapods-core-1.11.3/lib/cocoapods-core/Podfile. Choosing ios/Podfile automatically. If you would like to select a different one, you can configure it via "project.ios.sourceDir". You can learn more about it here: https://github.com/react-native-community/cli/blob/master/docs/configuration.md

✖ Installing CocoaPods dependencies (this may take a few minutes)
error Error: Looks like your iOS environment is not properly set. Please go to https://reactnative.dev/docs/next/environment-setup and follow the React Native CLI QuickStart guide for macOS and iOS.
Error: Error: Looks like your iOS environment is not properly set. Please go to https://reactnative.dev/docs/next/environment-setup and follow the React Native CLI QuickStart guide for macOS and iOS.
    at createFromTemplate (/Users/developer/.npm/_npx/7930a8670f922cdb/node_modules/@react-native-community/cli/build/commands/init/init.js:169:11)
    at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
    at async Object.initialize [as func] (/Users/developer/.npm/_npx/7930a8670f922cdb/node_modules/@react-native-community/cli/build/commands/init/init.js:222:3)
    at async Command.handleAction (/Users/developer/.npm/_npx/7930a8670f922cdb/node_modules/@react-native-community/cli/build/index.js:140:9)
info Run CLI with --verbose flag for more details.

Tell me this isn't weird.

So I shutdown the simulator, opened a new shell session keeping the CDPATH, and ran the above code again -- it worked 🥰

So I delete the project (rm -rf Test Test2), unset the CDPATH, and ran again. It also worked. -- weird

After building, I opened a new terminal session and just started everything up with CDPATH (on the project I created without CDPATH) just to see if it would complain. It ran without issue.

Is it common for React (perhaps on lower performing devices) to have init errors?


Final Re-Run

Ran through the whole init/start/build phase one more time, again with CDPATH and the startup passes but the build fails again (like the initial post) pointing to the generate-specs-cli.js in another project directory on the CDPATH. 🤬

Kind of interested to hear if someone has thoughts. I've cleared out the ~/.../DerivedData/* directories and files between builds to ensure that wasn't a conflict.

It seems inconsistent and I haven't narrowed down if the CDPATH matters at all, or if it matters during a particular phase. For instance, maybe it's important not to have it during the react-native init, but then it doesn't matter during the yarn iOS?

Clarification

I modified the full path of the CDPATH above.

Let's say it was failing to find this file:

~/node/projects/sails/scripts/generate-specs-cli.js
  1. the scripts directory doesn't exist
  2. I'd be running the yarn from a directory that looked like this:

    ~/node/projects/temp/react/native/<ProjectName>

    This shouldn't matter much, but shows sails/ is at the same level as native/'s great grandparent and a great-great grandparent from the project:

    pwd  # .../native/Foo
    ls -l ../../../../sails/

    I don't think anything would be using a relative path that deep and I don't think relativity is a factor, since it seems the population of $CDPATH is the big influencer here; again, despite that "scripts" directory not existing on the PATH or CDPATH.

devophyte commented 1 year ago

Final? Thoughts

The issue may have been related to exporting CDPATH. I intentionally exported CDPATH, adding it to my .bashrc many years ago and I'm not sure why. Maybe I did it for csh or maybe out of ignorance I copied the formatting of the PATH export?

General online recommendations are not to export CDPATH as they may interfere with commands on the command line, which is what is occuring. This is the first time after decades that it has interfered with anything.

Also interesting, in the ruby gems that come loaded with react-native project's (i.e. vendor/bundle/ruby/2.7.0/gems) there are many files that intentionally delete or unset CDPATH. I'm guessing something in the react-native ios pipeline also needs to clear out the environment variable as a precaution.

Examples where it's done:

TestProject/vendor/bundle/ruby/2.7.0/gems/cocoapods-1.11.3/lib/cocoapods/installer/pod_source_preparer.rb:62:
ENV.delete('CDPATH')

TestProject/vendor/bundle/ruby/2.7.0/gems/ffi-1.15.5/ext/ffi_c/libffi/man/Makefile.in:76:
am__cd = CDPATH="$${ZSH_VERSION+.}$(PATH_SEPARATOR)" && cd

TestProject/vendor/bundle/ruby/2.7.0/gems/ffi-1.15.5/ext/ffi_c/libffi/ltmain.sh:144:
(unset CDPATH) >/dev/null 2>&1 && unset CDPATH

...

It seems Expo is good about it too:

~/.nvm/versions/node/v18.12.1/lib/node_modules/expo-cli/build/commands/utils/CreateApp.js:184:
const cdPath = path().relative(process.cwd(), projectRoot);

~/.nvm/versions/node/v18.12.1/lib/node_modules/expo-cli/build/commands/utils/CreateApp.js:185:  
if (cdPath.length <= projectRoot.length) {

~/.nvm/versions/node/v18.12.1/lib/node_modules/expo-cli/build/commands/utils/CreateApp.js:186:    
return cdPath;

~/.nvm/versions/node/v18.12.1/lib/node_modules/expo-cli/build/commands/initAsync.js:385:  
const cdPat = CreateApp().getChangeDirectoryPath(projectRoot);

...

I've re-run the creation scripts with CDPATH set, but not exported and I think the issue is resolved.

github-actions[bot] commented 1 year ago

This issue is stale because it has been open 180 days with no activity. Remove stale label or comment or this will be closed in 7 days.

github-actions[bot] commented 1 year ago

This issue was closed because it has been stalled for 7 days with no activity.

r-n-o commented 5 months ago

Oh my. @devophyte you're my hero for the day. I also had set (and forgot about) CDPATH in my .zshrc, causing the same issue.

The fix in my case:

$ unset CDPATH
$ rm -rf ~/Library/Developer/Xcode/DerivedData/
$ rm -rf ios
$ npm run ios
JoseAlban commented 4 months ago

Unbelievable! unset CDPATH did work for me also .-.