| 1 | This is the source code for the React DevTools browser extension. |
| 2 | |
| 3 | ## Installation |
| 4 | |
| 5 | The easiest way to install this extension is as a browser add-on: |
| 6 | * [Chrome web store](https://chrome.google.com/webstore/detail/react-developer-tools/fmkadmapgofadopljbjfkapdkoienihi?hl=en) |
| 7 | * [Firefox Add-ons](https://addons.mozilla.org/en-US/firefox/addon/react-devtools/) |
| 8 | * [Edge Add-ons](https://microsoftedge.microsoft.com/addons/detail/react-developer-tools/gpphkfbcpidddadnkolkpfckpihlkkil) |
| 9 | |
| 10 | ## Local development |
| 11 | You can also build and install this extension from source. |
| 12 | |
| 13 | ### Prerequisite steps |
| 14 | DevTools depends on local versions of several NPM packages<sup>1</sup> also in this workspace. You'll need to either build or download those packages first. |
| 15 | |
| 16 | <sup>1</sup> Note that at this time, an _experimental_ build is required because DevTools depends on the `createRoot` API. |
| 17 | |
| 18 | To install all necessary dependencies, run the following command from the root of the repository: |
| 19 | |
| 20 | ```sh |
| 21 | yarn install |
| 22 | ``` |
| 23 | |
| 24 | #### Build from source |
| 25 | To build dependencies from source, run the following command from the root of the repository: |
| 26 | ```sh |
| 27 | yarn build-for-devtools |
| 28 | ``` |
| 29 | #### Download from CI |
| 30 | To use the latest build from CI, run the following commands starting from the root of the repository: |
| 31 | ```sh |
| 32 | cd scripts/release |
| 33 | yarn install |
| 34 | ./download-experimental-build.js |
| 35 | ``` |
| 36 | ### Build steps |
| 37 | Once the above packages have been built or downloaded, you can build the extension by running: |
| 38 | ```sh |
| 39 | cd packages/react-devtools-extensions/ |
| 40 | |
| 41 | yarn build:chrome # => packages/react-devtools-extensions/chrome/build |
| 42 | yarn run test:chrome # Test Chrome extension |
| 43 | |
| 44 | yarn build:firefox # => packages/react-devtools-extensions/firefox/build |
| 45 | yarn run test:firefox # Test Firefox extension |
| 46 | |
| 47 | yarn build:edge # => packages/react-devtools-extensions/edge/build |
| 48 | yarn run test:edge # Test Edge extension |
| 49 | ``` |