A framework for building native applications using React

Related tags

App react-native
Overview

React Native

Learn once, write anywhere:
Build mobile apps with React.

React Native is released under the MIT license. Current CircleCI build status. Current npm package version. PRs welcome! Follow @reactnative

Getting Started · Learn the Basics · Showcase · Contribute · Community · Support

React Native brings React's declarative UI framework to iOS and Android. With React Native, you use native UI controls and have full access to the native platform.

  • Declarative. React makes it painless to create interactive UIs. Declarative views make your code more predictable and easier to debug.
  • Component-Based. Build encapsulated components that manage their state, then compose them to make complex UIs.
  • Developer Velocity. See local changes in seconds. Changes to JavaScript code can be live reloaded without rebuilding the native app.
  • Portability. Reuse code across iOS, Android, and other platforms.

React Native is developed and supported by many companies and individual core contributors. Find out more in our ecosystem overview.

Contents

📋 Requirements

React Native apps may target iOS 11.0 and Android 5.0 (API 21) or newer. You may use Windows, macOS, or Linux as your development operating system, though building and running iOS apps is limited to macOS. Tools like Expo can be used to work around this.

🎉 Building your first React Native app

Follow the Getting Started guide. The recommended way to install React Native depends on your project. Here you can find short guides for the most common scenarios:

📖 Documentation

The full documentation for React Native can be found on our website.

The React Native documentation discusses components, APIs, and topics that are specific to React Native. For further documentation on the React API that is shared between React Native and React DOM, refer to the React documentation.

The source for the React Native documentation and website is hosted on a separate repo, @facebook/react-native-website.

🚀 Upgrading

Upgrading to new versions of React Native may give you access to more APIs, views, developer tools, and other goodies. See the Upgrading Guide for instructions.

React Native releases are discussed in this discussion repo.

👏 How to Contribute

The main purpose of this repository is to continue evolving React Native core. We want to make contributing to this project as easy and transparent as possible, and we are grateful to the community for contributing bug fixes and improvements. Read below to learn how you can take part in improving React Native.

Code of Conduct

Facebook has adopted a Code of Conduct that we expect project participants to adhere to. Please read the full text so that you can understand what actions will and will not be tolerated.

Contributing Guide

Read our Contributing Guide to learn about our development process, how to propose bugfixes and improvements, and how to build and test your changes to React Native.

Open Source Roadmap

You can learn more about our vision for React Native in the Roadmap.

Good First Issues

We have a list of good first issues that contain bugs which have a relatively limited scope. This is a great place to get started, gain experience, and get familiar with our contribution process.

Discussions

Larger discussions and proposals are discussed in @react-native-community/discussions-and-proposals.

📄 License

React Native is MIT licensed, as found in the LICENSE file.

React Native documentation is Creative Commons licensed, as found in the LICENSE-docs file.

Comments
  • [Workarounds] Packager unable to resolve module from /Users/node_modules/

    [Workarounds] Packager unable to resolve module from /Users/node_modules/

    There are various issues scattered around the repo related to this issue. Basically what happens is, for some packages, when you try to require some-module in a file, for example,

    var someModule = require('some-module');
    

    It is unable to resolve the package and the following error appears,

    Unable to resolve module some-module from /Users/username/projectname/AwesomeProject/index.js: Invalid directory /Users/node_modules/some-module
    

    This error message is a symptom of the packager not being able to find some-module. It'll walk up the directory tree until it finds node_modules/some-module. It just so happens that /Users is the last directory to try, hence the weird /Users/node_modules directory in the error message (h/t @philikon).

    Workarounds

    Currently, the workarounds seem to be,

    • Delete the node_modules folder - rm -rf node_modules && npm install
    • Reset packager cache - rm -fr $TMPDIR/react-* or node_modules/react-native/packager/packager.sh --reset-cache
    • Clear watchman watches - watchman watch-del-all
    • Recreate the project from scratch
    JavaScript Help Wanted :octocat: Tech: Bundler 📦 Resolution: Locked 📮Known Issues Bug 
    opened by satya164 498
  • NullPointerException:tempt to invoke virtual method 'android.graphics.drawable.Drawable android.graphics.drawable.Drawable$ConstantState.newDrawable(android.content.res.Resources)'

    NullPointerException:tempt to invoke virtual method 'android.graphics.drawable.Drawable android.graphics.drawable.Drawable$ConstantState.newDrawable(android.content.res.Resources)'

    Is this a bug report?

    yes

    Have you read the Contributing Guidelines?

    yes, I am sorry that I cant offer more information about this exception except for this stack trace because the crash report was collected from google analytics, I have no idea to reappear this exception.

    Environment

    Environment: OS: macOS Sierra 10.12.6 Node: 8.4.0 Yarn: 0.27.5 npm: 5.4.0 Android Studio: 3.0

    Packages: (wanted => installed) react-native: 0.51.0 => 0.51.0 react: 16.0.0-alpha.12 => 16.0.0-alpha.12

    Target Platform: Android (7.1.1) mobile:MIX 2 android:7.1.1 java.lang.NullPointerException:
    tempt to invoke virtual method 'android.graphics.drawable.Drawable android.graphics.drawable.Drawable$ConstantState.newDrawable(android.content.res.Resources)' on a null object reference at android.graphics.drawable.DrawableContainer$DrawableContainerState.getChild(DrawableContainer.java:888) at android.graphics.drawable.DrawableContainer.selectDrawable(DrawableContainer.java:466) at android.graphics.drawable.StateListDrawable.onStateChange(StateListDrawable.java:104) at android.graphics.drawable.Drawable.setState(Drawable.java:735) at android.graphics.drawable.DrawableWrapper.onStateChange(DrawableWrapper.java:331) at android.graphics.drawable.Drawable.setState(Drawable.java:735) at android.graphics.drawable.LayerDrawable.onStateChange(LayerDrawable.java:1488) at android.graphics.drawable.Drawable.setState(Drawable.java:735) at android.view.View.drawableStateChanged(View.java:18002) at android.widget.TextView.drawableStateChanged(TextView.java:4097) at android.view.View.refreshDrawableState(View.java:18071) at android.view.View.setPressed(View.java:8543) at android.view.View.setPressed(View.java:8521) at android.view.View.onTouchEvent(View.java:11218) at android.widget.TextView.onTouchEvent(TextView.java:8467) at com.facebook.react.views.textinput.ReactEditText.onTouchEvent(ReactEditText.java:150)

    Ran Commands Platform: Android Bug 
    opened by wxjer 405
  • UnableToResolveError: Unable to resolve module `AccessibilityInfo`

    UnableToResolveError: Unable to resolve module `AccessibilityInfo`

    Description

    I basically just cloned an existing project with a minimal setup, did yarn install and node node_modules/react-native/local-cli/cli.js run-ios. It started but the packer failed with:

    error: bundling: UnableToResolveError: Unable to resolve module `AccessibilityInfo` from `/Users/phillipp/Work/***/***/node_modules/react-native/Libraries/react-native/react-native-implementation.js`: Module does not exist in the module map or in these directories:
      /Users/phillipp/Work/***/***/node_modules/react-native/node_modules
    ,   /Users/phillipp/Work/***/***/node_modules
    

    I found get AccessibilityInfo() { return require('AccessibilityInfo'); }, in the /Users/phillipp/Work/***/***/node_modules/react-native/Libraries/react-native/react-native-implementation.js file but I have no clue where it wants to require that from. It seems to be a RN core thing.

    Here is the package.json for those who are curious:

    
    {
      "name": "***",
      "version": "0.0.1",
      "private": true,
      "scripts": {
        "start": "node node_modules/react-native/local-cli/cli.js start",
        "test": "jest"
      },
      "dependencies": {
        "base64-js": "^1.2.0",
        "react": "^16.0.0-alpha.6",
        "react-native": "^0.44.0",
        "react-native-ble-manager": "^3.2.0",
        "react-native-checkbox": "^1.1.0",
        "react-native-color-picker": "^0.2.1",
        "react-native-drawer": "^2.3.0",
        "react-native-dropdown": "0.0.6",
        "react-native-image-picker": "^0.25.5",
        "react-native-list-popover": "^1.0.5",
        "react-native-modal-picker": "0.0.16",
        "react-native-orientation": "^1.17.0",
        "react-native-router-flux": "^3.37.0",
        "react-native-selectbox": "^0.1.0",
        "react-native-selection": "^1.3.5",
        "react-native-selectme": "^1.2.3",
        "react-native-sound": "^0.9.1",
        "react-native-vector-icons": "^4.0.1"
      },
      "devDependencies": {
        "babel-jest": "18.0.0",
        "babel-preset-react-native": "1.9.1",
        "jest": "18.1.0",
        "react-test-renderer": "~15.4.0"
      },
      "jest": {
        "preset": "react-native"
      }
    }
    
    

    I already tried everything I found on the internet (reinstalling node modules, cleaning npm, yarn and watchman caches, deleting react files from temp dir, etc.)

    Additional Information

    • React Native version: ^0.44.0
    • Platform: ios
    • Development Operating System: OSX
    • Dev tools: XCode Version 8.0 (8A218a)
    Ran Commands Resolution: Locked 
    opened by PhillippOhlandt 321
  • React Native 0.62.* [TypeError: Network request failed] on file upload

    React Native 0.62.* [TypeError: Network request failed] on file upload

    Please provide all the information requested. Issues that do not follow this format are likely to stall.

    Description

    After upgrading from 0.61.4 to 0.62.0 the app will not upload files anymore from Android (all other requests are working fine)

    React Native version:

    0.62.0

    Steps To Reproduce

    1. Install a fresh ReactNative app via CLI
    2. Upload a file to the emulator
    3. Try to upload a file using fetch
    
    import Picker from "react-native-image-picker"
    import {request, PERMISSIONS, RESULTS} from 'react-native-permissions';
    
    class App extends React.Component {
    
      async componentDidMount() {
    
        try {
          await request(PERMISSIONS.ANDROID.WRITE_EXTERNAL_STORAGE)
          await Picker.launchImageLibrary({noData: true}, async (file) => {
            try {
               const body = new FormData()
               body.append("file", { type: file.type, size: file.fileSize, uri: `file://${file.path}`, name: file.fileName })
               const headers = { "content-type": "multipart/form-data", "accept": "application/json" }
    
              const req = await fetch("ANY_SERVER/upload/image", {
                method: "POST",
                headers,
                body
              })
              console.log(req.status)
            }  catch (e) {
              console.log(e)
            }
          })
        } catch (e) {
          console.log(e)
        }
      }
    
      render(){
        return <View/>
      }
    }
    

    Expected Results

    The request should reach the server to upload the file

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

    https://snack.expo.io/01W!bybf_ [Mon Apr 06 2020 21:29:18.704] LOG [TypeError: Network request failed]

    Platform: Android Resolution: Locked Tool: Flipper Needs: React Native Team Attention 
    opened by abumostafa 308
  • Latest react-native app doesn't work

    Latest react-native app doesn't work ":CFBundleIdentifier", Does Not Exist

    On OS X El Capitan v10.11.4

    node --version v6.0.0 npm --v 3.8.8 react-native-cli: 0.2.0 react-native: 0.24.1 watchman --v 4.4.0 xcode 7.3

    $ react-native init AwesomeProject $ cd AwesomeProject $ react-native run-ios

    ** BUILD FAILED **
    
    
    The following build commands failed:
        PhaseScriptExecution Run\ Script /development/misc/react/AwesomeProject/ios/build/Build/Intermediates/React.build/Debug-iphonesimulator/React.build/Script-006B79A01A781F38006873D1.sh
    (1 failure)
    Installing build/Build/Products/Debug-iphonesimulator/AwesomeProject.app
    An error was encountered processing the command (domain=NSPOSIXErrorDomain, code=2):
    Failed to install the requested application
    An application bundle was not found at the provided path.
    Provide a valid path to the desired application bundle.
    Print: Entry, ":CFBundleIdentifier", Does Not Exist
    /development/misc/react/AwesomeProject/node_modules/promise/lib/done.js:10
          throw err;
          ^
    
    Error: Command failed: /usr/libexec/PlistBuddy -c Print:CFBundleIdentifier build/Build/Products/Debug-iphonesimulator/AwesomeProject.app/Info.plist
    Print: Entry, ":CFBundleIdentifier", Does Not Exist
    
        at checkExecSyncError (child_process.js:470:13)
        at Object.execFileSync (child_process.js:490:13)
        at _runIOS (runIOS.js:91:34)
        at runIOS.js:24:5
        at tryCallTwo (/development/misc/react/AwesomeProject/node_modules/promise/lib/core.js:45:5)
        at doResolve (/development/misc/react/AwesomeProject/node_modules/promise/lib/core.js:200:13)
        at new Promise (/development/misc/react/AwesomeProject/node_modules/promise/lib/core.js:66:3)
        at Array.runIOS (runIOS.js:23:10)
        at Object.run (/development/misc/react/AwesomeProject/node_modules/react-native/local-cli/cli.js:86:13)
        at Object.<anonymous> (/usr/local/lib/node_modules/react-native-cli/index.js:88:7)
    
    Resolution: Locked 
    opened by arun0009 294
  • Android build failed: 'Failed to list versions for com.facebook.react:react-native.'

    Android build failed: 'Failed to list versions for com.facebook.react:react-native.'

    Description

    • What went wrong: Could not determine the dependencies of task ':app:compileDebugKotlin'.

    Could not resolve all files for configuration ':app:debugRuntimeClasspath'. Could not resolve com.facebook.react:react-native:+. Required by: project :app project :app > project :react-native-push-notification project :app > project :react-native-code-push project :app > project :react-native-async-storage_async-storage project :app > project :react-native-community_blur project :app > project :react-native-community_clipboard project :app > project :react-native-community_datetimepicker project :app > project :react-native-community_masked-view project :app > project :react-native-community_netinfo project :app > project :react-native-community_picker project :app > project :react-native-firebase_analytics project :app > project :react-native-firebase_app project :app > project :react-native-firebase_crashlytics project :app > project :sumsub_react-native-mobilesdk-module project :app > project :react-native-action-sheet project :app > project :react-native-appsflyer project :app > project :react-native-camera project :app > project :react-native-config project :app > project :react-native-device-info project :app > project :react-native-fbsdk-next project :app > project :react-native-file-viewer project :app > project :react-native-fs project :app > project :react-native-geolocation-service project :app > project :react-native-gesture-handler project :app > project :react-native-get-random-values project :app > project :react-native-haptic-feedback project :app > project :react-native-idfa project :app > project :react-native-image-crop-picker project :app > project :react-native-image-picker project :app > project :react-native-maps project :app > project :react-native-permissions project :app > project :react-native-safe-area-context project :app > project :react-native-screens project :app > project :react-native-set-soft-input-mode project :app > project :react-native-share project :app > project :react-native-shared-element project :app > project :react-native-sms-retriever project :app > project :react-native-splash-screen project :app > project :react-native-svg project :app > project :react-native-text-input-mask project :app > project :react-native-vector-icons project :app > project :react-native-version-number project :app > project :react-native-webview project :app > project :react-native-yamap > Failed to list versions for com.facebook.react:react-native. > Unable to load Maven meta-data from https://jcenter.bintray.com/com/facebook/react/react-native/maven-metadata.xml. > Could not HEAD 'https://jcenter.bintray.com/com/facebook/react/react-native/maven-metadata.xml'. > Read timed out

    Version

    0.65.1

    Output of npx react-native info

    System: OS: macOS 13.0 CPU: (12) x64 Intel(R) Core(TM) i7-9750H CPU @ 2.60GHz Memory: 55.72 MB / 16.00 GB Shell: 5.8.1 - /bin/zsh Binaries: Node: 16.17.1 - ~/.nvm/versions/node/v16.17.1/bin/node Yarn: 3.1.1 - /usr/local/bin/yarn npm: 8.16.0 - ~/WebstormProjects/mono-front/node_modules/.bin/npm Watchman: 2022.08.15.00 - /usr/local/bin/watchman Managers: CocoaPods: 1.11.3 - /Users/magdaaa/.rvm/gems/ruby-2.7.4/bin/pod SDKs: iOS SDK: Platforms: DriverKit 21.4, iOS 16.0, macOS 12.3, tvOS 16.0, watchOS 9.0 Android SDK: Not Found IDEs: Android Studio: Not Found Xcode: 14.0.1/14A400 - /usr/bin/xcodebuild Languages: Java: 11.0.16 - /usr/bin/javac npmPackages: @react-native-community/cli: Not Found react: 17.0.2 => 17.0.2 react-native: 0.65.1 => 0.65.1 react-native-macos: Not Found npmGlobalPackages: react-native: Not Found

    Steps to reproduce

    start to build android app

    • react-native run-android

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

    build.gradle

    dependencies { ... implementation "com.facebook.react:react-native:+" ... }

    Platform: Android Resolution: Duplicate 
    opened by aamagda 272
  • Geolocation 'enableHighAccuracy' on Android always times out

    Geolocation 'enableHighAccuracy' on Android always times out

    Developing an Android app, whilst debugging on my Android Device running on 6.1, the geolocation api always returns an error callback with the message Location request timed out.

    navigator.geolocation.getCurrentPosition(
          (position) => {
            console.log(position);
           },
           (error) => {
            console.log(error)
          },
          {enableHighAccuracy: true, timeout: 20000, maximumAge: 10000}
    );
    

    If I toggle enableHighAccuracy option to false, the api works fine. In high accuracy mode, the timeout always takes as long as I specify in the timeout option i.e. 20 seconds.

    I've tried running with dev mode turned off.

    Should high accuracy mode work in Android?

    Help Wanted :octocat: Ran Commands Platform: Android Resolution: Locked API: Geolocation Bug 
    opened by Findiglay 239
  • [FlatList] Rows aren't rendered until scroll

    [FlatList] Rows aren't rendered until scroll

    Hi, I have list view which displays partially local and partially remote data. Local data are initial for ListView.DataSource. This datasource is set in state of my custom component which wraps ListView and passed in render method to ListView. When are remote data received, new datasource is cloned by cloneWithRowsAndSections method and set to state of custom component. Problem is that are re-rendered only already displayed rows and new rows are rendered after scroll.

    renderbug

    Is it bug or how I should to force rendering of ListView? With react-native 0.5 it worked but after upgrade to 0.6 it behaves as described above.

    Resolution: Locked 
    opened by michalraska 223
  • [FIXED] Android build failures `No matching variant of com.facebook.react:react-native:0.71.0-rc.0 was found.`

    [FIXED] Android build failures `No matching variant of com.facebook.react:react-native:0.71.0-rc.0 was found.`

    Description

    Hey all, I'd like to share an update on a series of build failures React Native & Expo users have been experiencing when building Android apps starting from November 4th 2022.

    We'd like to apologize for the disruption this caused to your developer workflows. The React team is fully committed to delivering a smooth developer experience, and we take this type of issues extremely seriously.

    📢 Patches for >= 0.63

    We have prepared releases for all the main versions of react-native with an hotfix:

    🛳 0.70.5: https://github.com/facebook/react-native/releases/tag/v0.70.5 🛳️ 0.69.7: https://github.com/facebook/react-native/releases/tag/v0.69.7 🛳 0.68.5: https://github.com/facebook/react-native/releases/tag/v0.68.5 🛳️ 0.67.5: https://github.com/facebook/react-native/releases/tag/v0.67.5 🛳️ 0.66.5: https://github.com/facebook/react-native/releases/tag/v0.66.5 🛳️ 0.65.3: https://github.com/facebook/react-native/releases/tag/v0.65.3 🛳️ 0.64.4: https://github.com/facebook/react-native/releases/tag/v0.64.4 🛳️ 0.63.5: https://github.com/facebook/react-native/releases/tag/v0.63.5

    By updating to these patch versions, your Android build should start working again.

    To do so, in your package.json change react-native's version to the relevant new patch (ex. if you are on 0.64.3, change to 0.64.4) and run yarn install. No other changes should be necessary, but you might want to clean your android artifacts with a cd android && ./gradlew clean before trying to re-run your Android app.

    Fix for older react-native (< 0.63)

    The fix above only works on gradle 6.2 and higher. Older react-native used older gradle.

    You may determine your gradle version by looking in your /android/gradle/wrapper/gradle-wrapper.properties file.

    If you are on an older version of react-native (for example 0.63 or earlier) that uses gradle version 6.1 or below, you must use a different workaround as gradle 6.1 does not support exclusiveContent.

    Add this in the allprojects area of your android/buld.gradle file.

    def REACT_NATIVE_VERSION = new File(['node', '--print',"JSON.parse(require('fs').readFileSync(require.resolve('react-native/package.json'), 'utf-8')).version"].execute(null, rootDir).text.trim())
    
    allprojects {
        configurations.all {
            resolutionStrategy {
                // Remove this override in 0.65+, as a proper fix is included in react-native itself.
                force "com.facebook.react:react-native:" + REACT_NATIVE_VERSION
            }
        }
    

    Instead of using exclusiveContent, the hotfix must force the version of React Native. The recommended hotfix shells out to node to read your current version of react-native. If you hard code the version of react-native, when you upgrade your project in the future, your build will fail if you forget to remove this hotfix.

    Note that this fix is fragile as the location of your package.json could be different if you are in a monorepo, and node might not be available if you use a node package manager like nvm.

    Thank you @mikehardy for finding and providing this fix in your comment.

    Technical Details

    The issue

    On November 4th 2022 we published the React Native version 0.71.0-rc0, the first release candidate for the 71 release series, on several public repositories. Specifically, this version was also published on Maven Central as we're updating our artifacts distribution strategy (technical details are explained below).

    This event resulted in build failures for Android on several users as they ended up downloading the wrong React Native version (0.71.0-rc0 instead of the version they were using in their project, say 0.68.0).

    The build error looks something like this:

    Error: Command failed: gradlew.bat app:installDebug -PreactNativeDevServerPort=8081
    
    FAILURE: Build failed with an exception.
    
    * What went wrong:
    A problem occurred configuring root project 'My Project'.
    Could not determine the dependencies of null.
    Could not resolve all task dependencies for configuration ':classpath'.
        > Could not resolve com.facebook.react:react-native:+.
          Required by:
              project :
        > No matching variant of com.facebook.react:react-native:0.71.0-rc.0 was found. 
          The consumer was configured to find a runtime of a library compatible with Java 11, 
          packaged as a jar, and its dependencies declared externally, as well 
          as attribute 'org.gradle.plugin.api-version' with value '7.3.3' but:
    

    Sadly, due to how older projects of React Native were created in the past, we couldn't simply re-publish older versions, and we're asking users to update their template using the fix suggested below.

    Why this happened

    Historically, the React Native template provided build.gradle files that contain a dependency on the React Native Android library as follows: implementation("com.facebook.react:react-native:+").

    Specifically, the + part of this dependency declaration is causing Gradle to pick the highest version among all the declared repositories (often referred as Gradle Dynamic versions). Till React Native version 0.70, we were shipping a Maven Repository inside the NPM package (inside the ./android folder). Starting from 0.71, we moved such folder and uploaded it to Maven Central.

    Using Gradle Dynamic versions (i.e. a + dependency) is considered an antipattern (see the various warnings and notes on this page), specifically as it can lead to scenarios like this one and generally exposes users to less-reproducible builds. This is exactly what happened in this scenario, as builds started failing without any changes to user projects.

    In 0.71 we cleaned up the new app template and removed all the + dependencies (see here) and we moved the template to use the React Native Gradle Plugin, which will allow us to prevent scenarios like this from happening in the future.

    Sadly, users on older versions, say 0.66.0, were still using a + version. This caused their build to query all the repositories for the highest available versions of the React Native. While the node_modules/react-native/android folder contained a valid 0.66.0 version, Gradle honoured the + version and fetched version 0.71.0-rc0 from Maven Central as it's higher from the semantic versioning ordering.

    The resolutionStrategy block in the fix is forcing the version of com.facebook.react:react-native to all the projects to the one provided by the version of React Native you're effectively using.

    Who is affected?

    All the React Native users on versions till 0.66.x are affected.

    React Native users on versions from 0.67 till 0.70 could be affected, based on which third-party library they're using.

    We verified that empty projects created on versions from 0.67 till 0.70 are not affected.

    However, some of your dependencies might end up causing a wrong resolution of the React Native Android library, resulting in build failures. For instance, we verified that a project on React Native 0.68.4 works well with Reanimated 2.12.0 but fails with Reanimated 2.10.0.

    We also worked with Expo to make sure that users on eas build received the aforementioned fix, so those users should not be affected.

    Why React Native Android was published on Maven Central?

    As mentioned, this was done as part of the implementation of the RFC #580.

    The summary of that RFC is to allow us to overcome the limitation of NPM in terms of package size. Moving to Maven Central will allow us to reduce the build time for our users and distribute more granular artifacts which will end up benefitting the overall developer experience. We'll be able to share information on this in the near future.

    In the initial Github Issue, several users suggest to remove the publishing from Maven Central or re-publish older artifacts to overcome the build failure without requesting a fix.

    This is sadly not an option as:

    1. Maven Central is an immutable artifacts storage and doesn't allow deletion.
    2. The publishing on 0.71.0-rc0 was effectively correct. We believe this episode is essentially a "mis-configuration" in user projects, and we believe the better solution is to distribute this fix to our users.

    How could this have been prevented

    We were already aware of the risk of having Gradle dynamic dependencies, so since React Native 0.67 we introduced an exclude rule on the Maven Central dependency inside the default template (see here for more context):

            mavenCentral {
                content {
                    excludeGroup("com.facebook.react")
                }
            }
    

    React Native used to be published on Maven Central till version 0.20.1 (published in 2016). We had users in the past accidentally fetching older versions of React from Maven Central, causing their build to fail.

    This exclude directive assured that you won't ever download React Native from Maven Central. However, third party libraries could declare repositories inside their repositories{} block which might not contain the exclude directive, resulting in potentially broken dependency resolution.

    React Native version 0.71.0 will ship with an updated template that relies on React Native Gradle Plugin. This new integration will allow us to protect us against future distributed build failures like this one, by allowing to re-distribute updated build logic across the whole ecosystem if needed (this should protect us also against similar outages like the JCenter outage happened last year).


    I'd like to thank everyone for your patience and understanding and I'd like to call out some members our our community, specifically @mikehardy, @Titozzz, @brentvatne, @inckie and all the other folks involved in the initial investigation and fix for this issue.

    We'll follow up with more updates in the future if needed.

    Nicola On behalf of the React team

    Platform: Android Resolution: Fixed RN Team 
    opened by cortinico 220
  • [e2e-testing][Appium] Adding support for android:id

    [e2e-testing][Appium] Adding support for android:id

    • Calling view.setId() with the matching resource-id of an id found in R.class when BaseViewManager.setTestId is called.
    • Adding TestIdUtil in common to store mappings for testID with attributed views and their original react tag value.
    • Changing the signature for Event Classes to require the View instead of the viewTag. This reduces the number of locations where TestIdUtil.getOriginalReactTag is called.
    • Overriding BaseViewManager.onDropViewInstance to perform TestIdUtil mapping cleanup.
    • This closes #9777.
    • In order for this to work properly, an id resource needs to be manually added to android/app/src/main/res/values/ids.xml. Here's the contents of that file:
    <?xml version="1.0" encoding="utf-8"?>
    <resources>
    <item name="something" type="id"/>
    </resources>
    
    CLA Signed 
    opened by jsdevel 209
  • Image cannot show image in iOS 14

    Image cannot show image in iOS 14

    Image cannot show image in iOS 14, but can show location, like: <Image source={ require('./images/add_scan_images.png') } />

    Environment: Xcode Version 12.0 beta (12A6159) Simulator: IPhone SE - 2nd generation - 14.0 "react": "16.11.0", "react-native": "0.62.2"

    Platform: iOS Resolution: Locked Component: Image Needs: Author Feedback Needs: Issue Template iOS 14 
    opened by caofeng 205
  • Align USE_FRAMEWORKS usage between RNTester and the Template

    Align USE_FRAMEWORKS usage between RNTester and the Template

    Summary: This diff apply to RNTester the same logic we have in the template to control the use_framework! setting

    This is a preliminary change to solve the use_frameworks! problems in the New Architecture for both the Template and RNTester.

    Changelog:

    [iOS][Changed] - Align RNTester usage of the USE_FRAMEWORKS flag to the template

    Reviewed By: cortinico

    Differential Revision: D42387701

    CLA Signed Platform: iOS p: Facebook Partner fb-exported 
    opened by cipolleschi 2
  • Prepare Fabric for use_frameworks! changes

    Prepare Fabric for use_frameworks! changes

    Summary: This diff prepares the React-Fabric podspec to support use_frameworks!

    To fix the issues we currently have with use_framework, without renaming any file, we have to split the Fabric subspecs in different pods only when use_frameworks! is turned on.

    Changelog:

    [internal] - Add guard to prepare theFabric pod to be split in different pods.

    Differential Revision: D42388541

    CLA Signed p: Facebook Partner fb-exported 
    opened by cipolleschi 2
  • chore(babel,flow): realign version bumps

    chore(babel,flow): realign version bumps

    Summary

    While working on https://github.com/facebook/react-native/pull/35786 I noticed some inconsistencies in the versioning for Babel and Flow across the monorepo. So in this PR I wanted to address that so that for 0.72 we'll have the codebase in a more consistent shape.

    Happy to split in multiple PRs if needed.

    Changelog

    [GENERAL] [CHANGED] - Bump Babel packages to ^7.20.0 (or closest latest release), bump flow parser to 0.196.3 in a few places that were left out from latest bump

    Test Plan

    CI is green.

    CLA Signed p: Microsoft Partner Contributor 
    opened by kelset 3
  • [LOCAL] fix(cli,metro,babel): bump cli and metro and babel to fix Windows+Metro issue

    [LOCAL] fix(cli,metro,babel): bump cli and metro and babel to fix Windows+Metro issue

    Summary

    Local 71 PR to bump necessary packages to address an issue we found on Windows with Metro.

    Basically, the issue is as follows (from @robhogan's great report)

    Git Bash users on Windows who don't have Watchman installed will experience "Unable to resolve" red boxes, because Metro silently doesn't discover any files. This will affect both new and existing projects with default settings.

    This has been addressed via patch release of Metro 0.73.7, which requires a bump of CLI too. So this PR was made https://github.com/react-native-community/cli/pull/1787 that led to this CLI release: https://github.com/react-native-community/cli/releases/tag/v10.1.0

    Problem is that if we only bump Metro and CLI to these new versions in 0.71 branch, yarn install gets thrown into an infinite loop that errors out with a OOM error.

    The root cause seems to be related to the fact that between 0.73.5 and 0.73.7, babel was bumped to 7.20, as you can see here https://github.com/facebook/metro/compare/v0.73.5...v0.73.7#files_bucket

    By doing the minimal amount of babel bumps (we need a more well done babel-deps alignment in main branch), this is addressed and yarn install works correctly. This PR is it.

    Opening as a PR and not a straight commit because I want to make sure we can discuss if we want to merge this before 0.71.0 or since it's more work than expected, it'd be better to wait for 0.71.1 when we can test things more carefully.

    Changelog

    [GENERAL] [CHANGED] - Bump CLI to 10.1.0, Metro to 0.73.7, Babel to ^7.20.0

    Test Plan

    CI is green.

    CLA Signed p: Microsoft Partner Contributor 
    opened by kelset 2
  • Image Pipeline has not initialized

    Image Pipeline has not initialized

    Description

    So I installed a library and since then I kept getting this error, I have tried for hours to fix it but it wouldn't work.

    Version

    0.70.6

    Output of npx react-native info

    System: OS: Windows 10 10.0.19045 CPU: (16) x64 AMD Ryzen 7 5700G with Radeon Graphics Memory: 1.39 GB / 15.87 GB Binaries: Node: 16.15.0 - C:\Program Files\nodejs\node.EXE Yarn: 1.22.19 - ~\AppData\Roaming\npm\yarn.CMD npm: 8.10.0 - C:\Program Files\nodejs\npm.CMD Watchman: Not Found SDKs: Android SDK: Not Found Windows SDK: AllowDevelopmentWithoutDevLicense: Enabled Versions: 10.0.19041.0 IDEs: Android Studio: Version 2021.1.0.0 AI-211.7628.21.2111.8309675 Visual Studio: 17.1.32414.318 (Visual Studio Community 2022) Languages: Java: 11.0.12 npmPackages: @react-native-community/cli: Not Found react: 18.1.0 => 18.1.0 react-native: 0.70.6 => 0.70.6 react-native-windows: Not Found npmGlobalPackages: react-native: Not Found

    Steps to reproduce

    1. Download from the repo provided below
    2. Install the packages
    3. And run the command: npx react-native run-android (Only configured for android)

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

    https://github.com/koen1711/react-native-ble-scala/tree/unstable

    Component: Image Needs: Triage :mag: 
    opened by koen1711 0
  • undefined reference to `facebook::react::AppSpec_ModuleProvider IN 0.70.6 ANDROID

    undefined reference to `facebook::react::AppSpec_ModuleProvider IN 0.70.6 ANDROID

    Description

    CMakeLists.txt

    `cmake_minimum_required(VERSION 3.13)

    project(plobalapps_appmodules) include(${REACT_ANDROID_DIR}/cmake-utils/ReactNative-application.cmake)`

    MainApplicationModuleProvider.cpp

    `#include "MainApplicationModuleProvider.h"

    #include <rncli.h> #include <rncore.h> #include <AppSpec.h>

    namespace facebook { namespace react {

    std::shared_ptr MainApplicationModuleProvider( const std::string &moduleName, const JavaTurboModule::InitParams &params) { // Here you can provide your own module provider for TurboModules coming from // either your application or from external libraries. The approach to follow // is similar to the following (for a library called samplelibrary: // auto module = AppSpec_ModuleProvider(moduleName, params); if (module != nullptr) { return module; } //return rncore_ModuleProvider(moduleName, params);

    // Module providers autolinked by RN CLI auto rncli_module = rncli_ModuleProvider(moduleName, params); if (rncli_module != nullptr) { return rncli_module; }

    return rncore_ModuleProvider(moduleName, params); }

    } // namespace react } // namespace facebook`

    Not able include #include <AppSpec.h>, Codegen is working fine and I am able to locate AppSpec.h file in build/generated/source/codegen/jni

    Version

    0.70.6

    Output of npx react-native info

    System: OS: macOS 13.0.1 CPU: (10) arm64 Apple M1 Pro Memory: 282.55 MB / 16.00 GB Shell: 5.8.1 - /bin/zsh Binaries: Node: 19.1.0 - /opt/homebrew/bin/node Yarn: 1.22.19 - /opt/homebrew/bin/yarn npm: 8.19.3 - /opt/homebrew/bin/npm Watchman: Not Found Managers: CocoaPods: 1.11.3 - /opt/homebrew/bin/pod SDKs: iOS SDK: Platforms: DriverKit 22.2, iOS 16.2, macOS 13.1, tvOS 16.1, watchOS 9.1 Android SDK: Android NDK: 22.1.7171670 IDEs: Android Studio: 2021.2 AI-212.5712.43.2112.8609683 Xcode: 14.2/14C18 - /usr/bin/xcodebuild Languages: Java: 18.0.2.1 - /usr/bin/javac 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

    Configuration issue

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

    Screenshot 2023-01-06 at 12 13 34 AM Platform: Android Needs: Triage :mag: Type: New Architecture 
    opened by umeshcydv 0
Releases(v0.71.0-rc.5)
Owner
Meta
We are working to build community through open source technology. NB: members must have two-factor auth.
Meta
React-native-user-interface - Change React Native userinterface at runtime

react-native-user-interface change RN userinterface at runtime. Installation npm

Ahmed Eid 0 Jan 11, 2022
An Animated Scrolling View for React Native applications, supported on both iOS and Android

react-native-focused-scroll An Animated Scrolling View for React Native applications, supported on both iOS and Android Preview react-native-focus-scr

Fatemeh Marzoughi (Saba) 3 Aug 12, 2022
Matomo wrapper for React-Native. Supports Android and iOS. Fixed issues for native platforms build that are present in the official package.

@mccsoft/react-native-matomo Matomo wrapper for React-Native. Supports Android and iOS. Fixed issues for native platforms build that are present in th

MCC Soft 4 Dec 29, 2022
Practising React by building Netflix Clone

Netflix-Clone-React Practising React by building Netflix Clone Requirements TMDB api key : Add TMDB API key to AppApi.kt Learning Resourcce Build Netf

Chetan Gupta 61 Nov 13, 2022
A react native interface for integrating payments using PayPal

react-native-paypal Getting started Installation npm install react-native-paypal Android Specific Add this to your build.gradle maven { url "https:

eKreative 14 Sep 25, 2022
Make SIP calls from react-native using Linphone SDK

react-native-sip Make SIP calls from react-native using Linphone SDK Installation npm install react-native-sip Usage import { multiply } from "react-n

Woonivers 2 Jun 30, 2022
Initiate immediate phone call for React Native on iOS and Android.

react-native-immediate-call-library Initiate immediate phone call for React Native on iOS and Android. Getting started Using npm: npm install react-na

null 7 Sep 7, 2022
Simple library to decompress files .zip, .rar, .cbz, .cbr in React Native.

Uncompress React Native Simple library to decompress files .zip, .rar, .cbz and .cbr in React Native. Installation yarn add uncompress-react-native o

Adriano Souza Costa 40 Nov 24, 2022
A 2020s compatible React Native keyboard avoiding view for Android and iOS that just works.

react-native-keyboard-shift Example Snack coming soon Until then: Clone this repo: git clone https://github.com/FullStackCraft/react-native-keyboard-s

Full Stack Craft 66 Aug 16, 2022
A demo for Android font typeface support in React Native!

A Step-by-step Guide to a Consistent Multi-Platform Font Typeface Experience in React Native Goal Be able to use font typeface modifiers such as fontW

Jules Sam. Randolph 53 Dec 23, 2022
NativeScript empowers you to access native platform APIs from JavaScript directly. Angular, Capacitor, Ionic, React, Svelte, Vue and you name it compatible.

NativeScript empowers you to access native APIs from JavaScript directly. The framework currently provides iOS and Android runtimes for rich mobile de

NativeScript 22k Dec 31, 2022
Wrapper for Kustomer SDK v2.0 for react native

This is a wrapper for Kustomer v2 Sdk for react native. This implements the kust

Shivam Rawat 2 Dec 30, 2021
🚀 React Native Segmented Control, Pure Javascript for iOS and Android

Installation Add the dependency: npm i react-native-segmented-control-2 Peer Dependencies Zero Dependency ?? Usage Import import SegmentedControl from

FreakyCoder 11 Nov 10, 2022
Library to read incoming SMS in Android for Expo (React Native)

react-native-expo-read-sms Maintainers maniac-tech Active maintainer Installation Install this in your managed Expo project by running this command: $

Abhishek Jain 15 Jan 2, 2023
React Native Stone SDK Implementation (Support for both Mobile and POS versions)

react-native-stone-pos Stone Android POS Native Module Installation Stone has a private packageCloud repository, so we need to have your token before

8Sistemas 9 Dec 10, 2022
A music picker library for React Native. Provides access to the system's UI for selecting songs from the phone's music library.

Expo Music Picker A music picker library for React Native. Provides access to the system's UI for selecting songs from the phone's music library. Supp

Bartłomiej Klocek 60 Dec 29, 2022
GeckoView implementation on android for React Native.

react-native-geckoview A fully functional implementation of GeckoView on android for react native. The component supports two-way messaging similar to

Ammar Ahmed 7 Nov 24, 2022
A powerful cross-platform UI toolkit for building native-quality iOS, Android, and Progressive Web Apps with HTML, CSS, and JavaScript.

Ionic Ionic is an open source app development toolkit for building modern, fast, top-quality cross-platform native and Progressive Web Apps from a sin

Ionic 48.4k Jan 3, 2023
KotlinSample - Template project for building a GTK3 Kotlin/Native app against the elementary Flatpak runtime

GTK3 Kotlin/Native Sample This is a working example of how to write and build a

David Hewitt 10 Dec 5, 2022