rnx-kit

repository·main·Indexed 23 days ago

https://github.com/microsoft/rnx-kit

A suite of developer tools by Microsoft designed to optimize the React Native development workflow. It provides solutions for dependency management, cloud-based native builds, and enhanced Metro bundling. The kit includes polyfills for Web APIs (such as Battery Status and Web Storage), a Rust-based Web API usage scanner, and various utility tools for bundle analysis and patching.

Tokens
173.6K
Snippets
368
Records
1.1K
Agent score
80%

What's inside rnx-kit

  1. What is align-deps (formerly dep-check)?

    main

    align-deps (previously known as dep-check) is a dependency manager and linter designed for React Native developers. It helps manage and align package versions across small repositories and large enterprise monorepos.

    It addresses three main challenges:

    1. Package Selection: Recommending the correct, maintained modules for specific React Native versions (e.g., knowing that AsyncStorage moved from core to @react-native-async-storage/async-storage).
    2. Code Alignment: Ensuring all packages within a repository use the same versions of community modules to prevent breakages.
    3. App Alignment: Helping integrating apps determine the correct set of dependencies required to satisfy the peerDependencies of multiple integrated experiences.
  2. Overview of @rnx-kit/rn-changelog-generator

    main

    The @rnx-kit/rn-changelog-generator is an experimental tool designed to generate a markdown-formatted list of changes between two git references (such as tags) for the react-native repository.

    It handles complex release requirements, such as:

    • Author Attribution: Fetches commit metadata from the GitHub API to attribute changes to GitHub handles.
    • Cherry-pick Resolution: Parses 'referential revisions' (added by Facebook's infrastructure) to resolve cherry-picked commits back to their original hashes in the main branch. This prevents duplicate entries in changelogs when commits are moved from main to stable release branches.
  3. Overview of rnx-kit tools

    main

    rnx-kit is a collection of tools designed to optimize the React Native developer experience by filling ecosystem gaps and streamlining workflows.

    Key capabilities include:

    • Dependency management: Use align-deps to ensure consistent dependency versions across large-scale projects.
    • Native builds (experimental): Use the build tool to build Android and iOS apps in the cloud, bypassing the need for heavy local native toolchains.
    • Enhanced bundling: Use metro-serializer to extend Metro with features like TypeScript validation, tree shaking, and detection of duplicate or cyclic dependencies.
    • Tailored defaults: Access Babel presets for Metro that are opinionated for high-scale usage.
  4. Use @rnx-kit/tools-apple for iOS and macOS deployment

    main

    @rnx-kit/tools-apple is a collection of utility functions designed to automate tasks related to deploying applications on iOS or macOS. It provides programmatic access to Xcode build processes, simulator management, device selection, and CocoaPods verification.

    import * as tools from "@rnx-kit/tools-apple";
  5. Query package configuration with @rnx-kit/config

    main
    The @rnx-kit/config package allows you to programmatically query the configuration of a package. This is useful if you are building custom tools that need to behave consistently with the rnx-kit CLI. You can use the provided API to read configuration data and use it as input for your own programmatic tool implementations.
  6. Use @rnx-kit/tools-android for Android app deployment

    main

    @rnx-kit/tools-android is a collection of functions designed to automate the deployment of apps on Android. It provides utilities for interacting with Android devices (physical and emulators), managing Gradle builds, and handling APK installation and execution.

    import * as tools from "@rnx-kit/tools-android";
  7. Use @rnx-kit/babel-plugin-import-path-remapper to remap imports

    main
    The @rnx-kit/babel-plugin-import-path-remapper plugin remaps **/lib/** imports to **/src/**. This is useful for consuming TypeScript files directly from packages that do not correctly export all necessary modules via their index.ts files, allowing you to bypass the transpiled JavaScript in lib and use the source files in src instead.
  8. Configure domain tracking and subdomains

    main

    You can control which domains are active via trackPerformance.

    Enabling domains:

    • All domains: trackPerformance({ strategy: "timing" })
    • Specific domain: trackPerformance({ enable: "metro" })
    • Multiple domains: trackPerformance({ enable: ["resolve", "transform"] })

    Subdomains: Subdomains create a parent-child relationship. Enabling a parent domain automatically enables all its registered subdomains. Use registerSubdomain(parent, child) to establish this link.

    import { registerSubdomain, getDomain } from "@rnx-kit/tools-performance";
    
    // Register "metro:resolver" as a subdomain of "metro"
    registerSubdomain("metro", "resolver");
    
    // Enabling "metro" now also enables "metro:resolver"
    trackPerformance({ enable: "metro", strategy: "timing" });
    
    const domain = getDomain("metro:resolver"); // enabled via parent
  9. Monorepo type-checking behavior in @rnx-kit/cli

    main

    Starting from version 0.9.55, the @rnx-kit/cli supports type-checking across multiple projects within a monorepo with the following behaviors:

    • When bundling: The process will fail if type errors are encountered.
    • When serving: The CLI will print type errors to the console but will continue running without failing.
  10. How parsing backends work in @rnx-kit/tools-babel

    main

    The package provides three parsing backends to optimize the Metro transform stage. parseToAst uses a fallback chain to ensure compatibility while maximizing speed.

    1. OXC (Primary): A fast Rust-based parser. It produces an ESTree AST which is converted to a Babel-compatible format in-place. It is automatically skipped for files that might contain Flow syntax.
    2. Hermes (Secondary): Meta's Hermes parser, used if OXC fails.
    3. Babel (Fallback): The standard Babel parseSync, used as the final fallback to ensure all supported syntax is handled.

    Use TransformerSettings.parseDisableOxc to explicitly disable the OXC parser.

    import { parseToAst } from "@rnx-kit/tools-babel";
    
    // Tries OXC -> Hermes -> Babel
    const ast = parseToAst(args);