Use React NativeBuild native iOS, Android, Windows and Mac apps with React and JavaScript
Menu
Collapse

React Native September 2018 (v0.57.0) released

Posted

v0.57.0 on GitHub (npm)

Changelog

Welcome to the 0.57 release of React Native! This release addresses a number of issues and has some exciting improvements. We again skipped a monthly release, focused on quality by extending the release candidate phase, and let some upstream packages reach stable for inclusion.

This release includes 599 commits by 73 different contributors! In response to feedback, we've prepared a changelog that contains only user-impacting changes. Please share your input and let us know how we can make this even more useful, and as always let us know if you have any feedback on this process.

Highlights

New features

  • Accessibility APIs now support accessibility hints, inverted colors, and easier usage of defining the element's role and states; read more at @ziqichen6's excellent blog post
  • On iOS, WKWebView can now be used within the WebView component; read more at @rsnara's awesome blog post
  • Better support for out-of-tree platforms. For details, please refer to the discussion that the community used to get this up and running (there will be a new page in the docs dedicated to it too) - huge props to @empyrical for working on this!

Tooling updates

  • Android tooling has been updated to match newer configuration requirements (SDK 27, gradle 4.4, and support library 27); building with Android plugin 3.2 doesn't work due to the gradle scripts, so please stay on Android Studio 3.1 for now
  • Support Babel 7 stable landed! Be sure to read here about using TypeScript and check out the Babel 7 migration guide for help migrating.
  • Metro has been upgraded (with Babel 7 and better transformer support), and in the next major release we plan on having two new features (ram bundles and inline requires) optional for you all to use - you can read how it will happen here; moreover, if you have a custom packager config, we recommend you read also the "updating to this version" section.
  • Flow, React, and related packages have also been updated; this includes working support for the React Profiler.

The Slimmening is happening

As mentioned a few times in the past, the core team is reviewing the repository to trim it to the base React Native features in order to make the whole ecosystem more maintainable (by using a dividi-et-impera approach, the community will move faster and enable pull requests to be reviewed and merged quicker). This change requires extracting some components into their own separate repos and removing old, unused code (details here).

0.57 is not directly effected by any changes, but we want you to know that:

  • WebView will be moved to its own repo at react-native-community/react-native-webview. There is already a base implementation there. Help us out by giving that a try, and expect that WebView will be deprecated soon
  • NavigatorIOS will be fully removed from the main codebase starting 0.58.0 (via this commit); it is now deprecated

Updating to this version

  1. Upgrade the version of React Native in the package.json from 0.56.0 to 0.57.0, and the React version to 16.5

  2. Change the babel-preset dependency from "babel-preset-react-native": "^5", to "metro-react-native-babel-preset": "^0.45.0",, then change the .babelrc configuration to:

    JSON { "presets": ["module:metro-react-native-babel-preset"] }

  3. Ensure that you have all the babel dependencies to version ^7.0.0 (you may also need to add babel-core": "7.0.0-bridge.0" as a yarn resolution to ensure retro-compatibility)

  4. If you have a custom packager configuration via rn-cli.config.js, you probably need to update it to work with the updated Metro configuration structure (for full detail refer to Metro's documentation); here are some commonly encountered changes to rn-cli.config.js:

    ```diff -const blacklist = require('metro/src/blacklist') +const blacklist = require('metro-config/src/defaults/blacklist')

    // ...

    module.exports = {

    • watchFolders: alternateRoots,
    • resolver: {
    • blacklistRE: blacklist
    • },
    • transformer: {
    • babelTransformerPath: require.resolve('./scripts/transformer.js'),
    • },
    • getProjectRoots() {
    • return [
    • path.resolve(__dirname),
    • ].concat(alternateRoots)
    • },
    • getBlacklistRE() {
    • return blacklist;
    • },
    • transformModulePath: require.resolve('./scripts/transformer.js'), } ```

  5. Run yarn to ensure that all the new dependencies have been installed

Added: new features

Android specific additions

iOS specific additions

Changes: existing functionality that is now different

Android specific changes

Fixed: bugs that have been resolved

Android specific fixes

  • Fix issue with AsyncStorage not behaving properly on Android 7+ (1b09bd7)
  • Fixed extreme <TextInput> slowness (5017b86 by @gnprice)
  • Fixed <TextInput> placeholder not being completely visible (8402232 and 86f24cc by @jainkuniya)
  • Fix Horizontal <ScrollView>'s scroll position during layout changes with RTL content (de57327)
  • Fix Horizontal <ScrollView> overflow issue (d5465a9)
  • Fixing crash on SDK 15 on ReactTextInputLocalData (1bb2bea)
  • Fix Drawing Rect for ReactScrollView (6a16bec by @yungsters)
  • Fixed NoSuchKeyException Thrown From ReadableNativeMap bysafely unwrapping ReadableMap by defaulting to 0 if key not present (1a6666a by @Bhavik-P)
  • Fixed runAndroid to enable the use of a package on port <> 8081 for Windows (3cd0737 by @ihenshaw)
  • Don't crash on upload retry when trying to fetch on a varying quality network (7a246e4 by @dryganets)

iOS specific fixes

  • Fix TextInput.clear() and TextInput.setNativeProps({text: ''}) to work (057d3ef by @magicien)
  • Correct fishhook import in RCTReconnectingWebSocket (75a0273)
  • Change in RCTImagePickerManager to handle crashes if height/width is nil (82af7c9 by @abhi06276)
  • Fix controlled <TextInput> on iOS when inputting in Chinese/Japanese (892212b by @mmmulani)
  • Fixed <ScrollView> bug encountered with brownfield apps (fab5fff by @PeteTheHeat)
  • Fixed missing selection indicator lines on <PickerIOS> (e592d6f by @VSchlattinger)
  • Fix crash in RCTImagePicker on iOS (934c50f by @mmmulani)
  • Fix undefined_arch error received when building in Xcode 10 beta (e131fff by @futuun)
  • Add support for connecting to the Packager when running the iOS app on device when using custom Debug configuration (079bf3f)
  • Fixed RCTAnimation import for integrating with cocoapods (7525f38 by @LukeDurrant)

Removed: features that have been removed; these are breaking

  • [BREAKING] Removed ScrollView.propTypes; use flow or typescript for verifying correct prop usage instead (5b6ff01 by @sahrens)

Android specific removals

  • ReactInstancePackage is now deprecated; use @link ReactPackage or @link LazyReactPackage (b938cd5 by @axe-fb)
© Copyright Use React Native, all rights reserved.
React, React Native and Logos are a Facebook Copyright.
This page is not affiliated with Facebook.