React Native CLI 3.1.0 and 4.0.0 - What's New?

What is React Native CLI?

React Native CLI, or simply CLI, is a command line interface that you work with every day while developing React Native applications. It has been part of React Native from its beginning and recently extracted out to a separate project as a part of the Lean Core effort.

Today, it lives in its separate repository with its own roadmap and backlog of features. Our release cycle is separate and async compared to React Native.

In the future, we plan on increasing the velocity of the development and shipping new features to the community even faster, regardless of the underlying React Native version.

What’s new in the React Native CLI 3.1.0?

React Native CLI 3.1.0 is a new version that is available as of today for all React Native developers using 0.61 version. You can look at the full Github changelog here. I have highlighted some of the most important changes below.

New watch mode

The Interactive mode in the CLI has been one of the most awaited features, according to the React Native Community survey done in the past.

We’re happy to inform you that this feature is finally shipping as of this release. You can now trigger the dev menu or reload the app from the command line interface, by pressing either d or r. You can also disable this mode in case it bothers you or you don’t intend on using it.

On that occasion, I would like to thank @thecodrr for his determination and shipping this amazing feature. We have managed to ship his Pull Request that was open for almost a year!It took a while to rebase it on top of the latest master (meanwhile we have converted the codebase from JavaScript to TypeScript), but it was worth it.

Shared cache between CLI and Xcode

Historically, if you were switching between react-native run-ios and Xcode, the builds were taking a lot of time because the cache between these two tools was different.

From this release, thanks to @janicduplessis and his contribution, react-native run-ios will now share cache with Xcode, meaning that the builds will be significantly faster when switching between the tools back and forth.

Better support for monorepos

One of the core principles of the CLI is that we want it to “just work.” In other words, tooling around React Native should be flexible and adapt to the folder structure and other constraints on the fly. That’s why monorepos are first-class citizens in the CLI and it’s extremely important for us to ensure they work flawlessly.

Part of the challenge here is knowing where and at what level in the folder hierarchy the CLI is located. For example, if you’re using Yarn, is the package moved to the root or kept at the package level, due to conflicts?

Historically, we used to overcome this issue by always executing the CLI with npx or yarn from within Android and iOS files. Unfortunately, this has been inconsistent across environments and rather significant group of developers reported the problem.

From this release on, we have replaced npx with good old require.resolve. This should provide more stability and be more predictable across different environments. Support for monorepos is still work in progress and we encourage you to comment and post further ideas around this topic if you run into any problems.

Continuous work on better developer experience

As I mentioned already, the developer experience is our top priority. That’s why we’re always on the lookout for potential performance improvements are happy to see A LOT of contributions from the community that solve actual problems it’s running into.

From this release on, we’re shipping three DX improvements.

Thanks to @sunnylqm contribution, we will now warn you if you try to initialize a new React Native project when you use a reserved Java keyword will result in an error.

Thanks to @thecodrr contribution, the CLI will now print much better errors and do it in more places! In other words, your experience when things go wrong should be much better and give you a better overview of what could be wrong.

Thanks to @jamesgeorge007, the CLI will now suggest a command in case of a typo! It’s all about these tiny little things.

What's new in React Native CLI 4.0.0?

React Native CLI 4.0.0 is a new version that is available for all React Native developers who will be using the upcoming 0.62 version. You can look at the full Github changelog here.

I have highlighted some of the most important changes below.

Improved support for different build flavors on Android

Historically, the CLI assumed that there’s usually debug and release build of your Android app. However, as your application grows and you keep adding new modules, it may happen that there are more flavors and applications present within your Gradle project.

In order to make working in such environments easier, we have optimized the run-android experience by removing --appId and --appIdSuffix from the CLI options, and introducing --flavor instead.

Such solution should be less confusing and promote running the project in a way that you usually do when working with Android studio or Gradle wrapper.

Metro update to 0.58 version

React Native CLI 3.x runs on Metro 0.56. While preparing CLI for the next React Native release, we aligned the version used by the CLI with the one that React Native expects.

In the future, we’re planning to remove Metro dependency from the CLI and move that onto React Native. That way, our updates can ship to a broader audience, regardless of the React Native version. It also makes more sense to be part of React Native, since for the CLI, Metro updates are never breaking and are hard to test.

Version next

As a part of the upcoming 5.0.0 release of the Command Line Interface, labeled as next right now, we’re focusing on removing legacy code, including historical react-native link command and its associated dependencies, which will greatly clean up the codebase and make the CLI even lighter.

Aside from that, we’re also focusing on reducing the number of open issues from ~90 to a smaller number in our backlog. A lot of these tickets are labeled as easy to get started or features that the community wants.

Our roadmap is a living document and we’re open to accepting your feedback and ideas. In that case, please open an issue or comment in the one you’re interested in.

Wrapping up

Overall, extracting Command Line Interface out of the React Native repository has been a really great move and it makes me really happy to see new developers onboarding our community and willing to join us in the move towards making the CLI a better product.

I think this is a really unique opportunity, as it’s very easy to contribute to it (and we can help you, so don’t worry) and your work will ship to every developer in the world that uses React Native CLI to work with their projects.

With that it mind, we would like to thank you for your contributions, feedback and warm words towards all the maintainers. We also invite everyone to join us and work together towards making the CLI developer experience even better!