Welcome to the Reactotron Contributing Guide
Thank you for investing your time in contributing to our project!
Please start by reading the other docs in this folder to understand how the monorepo folder structure and plugin architecture work.
Making changes to the Reactotron App
Step 1: Get the development version of reactotron running
- Fork the repo and then clone it to your local machine:
git clone git@github.com:YOUR_USER_NAME/reactotron.git
- Install dependencies:
yarn
- Start the
reactotron-app
in development mode:yarn start
You should see the reactotron electron app open on your machine with the development menu open.
Step 2: Use the example react-native app to test your changes
- Start the example app with
yarn start:example
- Launch the app in the simulator of your choice.
- You should see output in the reactotron app.
Step 3: Making changes
Changes made to the main reactotron electron app in ./apps/reactotron-app
will be reflected in the reactotron app that you started in step 1. You may need to kill the app and restart it to see your changes.
Remember to reload the example app from step 2 or other connected application(s) to reconnect the app to reactotron.
Changes made to the client packages will be reflected in the example application immediately.
Bring Your Own Application
Let's say that you want to develop features using your own application instead of the example app. If you make changes to the non-electron app packages in this monorepo like reactotron-react-native
or reactotron-core-client
, you will need to build the packages and then link them to your react-native app. Luckily, we have a script that will do this for you.
You can run yarn build
to build all reactotron packages, or yarn build:watch
to watch and rebuild changes automatically.
If your app was located in the ~/Code/PizzaApp
folder, to link the packages to your react-native app run:
npx zx scripts/install-workspace-packages-in-target.mjs ~/Code/PizzaApp
or if you want to watch for rebuilds and automatically link them:
npx nx watch --all -- "npx zx scripts/install-workspace-packages-in-target.mjs ~/Code/PizzaApp
Make sure that the path to your app is an absolute path and not a relative one (i.e. ~/Code/PizzaApp
instead of ../PizzaApp
)
You must have already run yarn
in your app folder (e.g. ~/Code/PizzaApp
) before running this script because is copies over the built js files from each reactotron library into the app's node_modules
folder.
Adding a new Reactotron plugin to ./lib
If you have a new plugin to contribute to the Reactotron ecosystem, you can start a new workspace by running the generate plugin script:
yarn generate:plugin my-plugin
This will create the necessary directory in ./lib
and get you started with a template. You'll want to implement your configuration and plugin in ./lib/reactotron-my-plugin/reactotron-my-plugin.ts
.
Keep in mind this won't add the workspace to .circleci/config.yml
, that must still be done manually when ready.
Prepare for a pull request
Before you open a pull request, please ensure that the following command runs without errors:
yarn build-and-test:local
Once you've made your changes and verified your local codebase passes all tests and linters, you'll need to commit them and push them to your fork. Then, you can open a pull request to the main repo.