Krell is a new, minimalist system for interfacing ClojureScript and React Native. Taking advantage of the new ClojureScript support for Webpack makes interfacing with existing RN/NPM packages easier and building for the finicking Metro bundler less of a pain.

Recently, support was added to programmatically build projects in Krell. This makes it possible to easily connect nREPL and Piggieback to interact with your React Native project from an Emacs REPL. Here is how you do that.

First, follow the instructions for setting up a Krell project on its wiki. In your deps.edn, make sure you are using the most recent commit SHA for Krell. Ensure your project builds and runs on its own.

Next, add the following to a file called .dir-locals.el at the root of your project:

((nil . ((cider-default-cljs-repl . custom)
         (cider-custom-cljs-repl-init-form . "(require '[clojure.java.io :as io]
         '[clojure.edn :as edn]
         '[cider.piggieback]
         '[krell.api :as krell]
         '[krell.repl])
(def config (edn/read-string (slurp (io/file \"build.edn\"))))
(krell/build config)
(apply cider.piggieback/cljs-repl (krell.repl/repl-env) (mapcat identity config))"))))

Now, run M-x cider-jack-in-cljs in your project. Once everything finishes l oading, you can run react-native start to get the bundler running, and start your app via react-native run-ios or -android or however you boot it. The REPL prompt will change to cljs.user and you’ll be connected to React Native from Emacs.

Thanks to David Nolen for adding the necessary build support to Krell and to dotemacs for getting most of the Emacs work done. If you have questions, hop into #cljsrn on Clojurians Slack.