React Native with Nix

README.md

This was based on content found at https://programsareproofs.com/articles/react_native_nix.html. It was a great starting point, but didn't work for me. I run PopOS with Nix managed by home-manager. Sometimes, things that work great out of the box for NixOS users don't always work for me, but this is what did. (I'm not sure if the original author uses NixOS)

I am using devenv as well.

I needed to bump the inotify values on my machine to make watchman run without bailing with an error immediately.

# appease watchman
# info from https://www.suse.com/support/kb/doc/?id=000020048
sudo sysctl fs.inotify.max_user_instances=8192
sudo sysctl fs.inotify.max_user_watches=524288
sudo sysctl -p

I also needed to "cold boot" the emulator after creating it by running create-avd once I started a devenv shell session. That means I needed to start the emulator and let it boot up to the phone's dashboard before I started the app with npm run start-android.

I was able to init a new project with npx [email protected] init AwesomeProject --version 0.72.3 --npm. Specifically, I needed the version and npm source override for .... reasons.

I then start react native with npm start

devenv.nix

{ inputs, pkgs, ... }:

let
  # Configure which Android tools we'll need (mostly the recommended ones)
  sdk = (import inputs.android-nixpkgs { channel = "stable"; }).sdk (sdkPkgs:
    with sdkPkgs; [
      build-tools-30-0-3
      build-tools-33-0-0
      cmdline-tools-latest
      emulator
      patcher-v4
      platform-tools
      platforms-android-33
      system-images-android-32-google-apis-x86-64
    ]);
in {
  packages = with pkgs; [
    android-studio
    watchman
  ];

  enterShell = ''
    export ANDROID_AVD_HOME="/home/jon/.config/.android/avd"
    export PATH="${sdk}/bin:$PATH"
    ${(builtins.readFile "${sdk}/nix-support/setup-hook")}
  '';

  languages.java.enable = true;
  languages.javascript = {
    enable = true;
    corepack.enable = true;
  };

  # Create the initial AVD that's needed by the emulator
  scripts.create-avd.exec = "avdmanager create avd --force --name phone --package 'system-images;android-32;google_apis;x86_64'";

  # These processes will all run whenever we run `devenv run`. These were copy/pasted from the original post and I haven't
  # used these much so <abbr title="your milaeage may vary">YMMV</abbr>.
  processes.emulator.exec = "emulator -avd phone -skin 720x1280";
  processes.react-native.exec = "npx react-native start";
}

devenv.yaml

allowUnfree: true
inputs:
  nixpkgs:
    url: github:NixOS/nixpkgs/nixpkgs-unstable
  android-nixpkgs: # Use a repository that makes Android configuration easy
    url: github:tadfisher/android-nixpkgs/stable