Switch to Nx (#1152)

* Nx

* Updates

* Format

* fetch-depth

* Update

* Fix

.github/workflows/CI.yml

@@ -12,16 +12,23 @@ jobs:
 
     steps:
       - uses: actions/checkout@v3
+        with:
+          fetch-depth: 0
+      - uses: nrwl/nx-set-shas@v2
       - uses: pnpm/action-setup@v2
       - uses: actions/setup-node@v3
         with:
           node-version: 'lts/*'
           cache: 'pnpm'
-      - run: pnpm install
+      - name: Install dependencies
-      - run: pnpm run format:check
+        run: pnpm install
-      - run: pnpm run build:all
+      - name: Check formatting
-      - run: pnpm run lint:all
+        run: pnpm run format:check
-      - name: Run pnpm test:all
+      - name: Build
+        run: pnpm exec nx affected --target=build --parallel=3
+      - name: Lint
+        run: pnpm exec nx affected --target=lint --parallel=3
+      - name: Test
         uses: GabrielBB/xvfb-action@v1
         with:
-          run: pnpm run test:all
+          run: pnpm exec nx affected --target=test --parallel=3

README.md

@@ -22,6 +22,10 @@ It can be used as a browser extension (for [Chrome](https://chrome.google.com/we
 - [Recipes](https://github.com/reduxjs/redux-devtools/blob/main/extension/docs/Recipes.md)
 - [FAQ](https://github.com/reduxjs/redux-devtools/blob/main/extension/docs/FAQ.md)
 
+## Development
+
+This is a monorepo powered by [pnpm](https://pnpm.io/) and [Nx](https://nx.dev/). [Install pnpm](https://pnpm.io/installation) and run `pnpm install` to get started. Each package's dependencies need to be built before the package itself can be built. You can either build all the packages (i.e., `pnpm run build:all`) or use Nx commands to build only the packages necessary for the packages you're working on (i.e., `pnpm nx build remotedev-redux-devtools-extension`).
+
 ## Backers
 
 Support us with a monthly donation and help us continue our activities. [[Become a backer](https://opencollective.com/redux-devtools-extension#backer)]

lerna.json

@@ -1,22 +0,0 @@
-{
-  "version": "independent",
-  "npmClient": "pnpm",
-  "packages": [
-    "extension",
-    "packages/*",
-    "packages/d3-state-visualizer/examples/tree",
-    "packages/react-dock/demo",
-    "packages/react-json-tree/examples",
-    "packages/redux-devtools/examples/counter",
-    "packages/redux-devtools/examples/todomvc",
-    "packages/redux-devtools-inspector-monitor/demo",
-    "packages/redux-devtools-inspector-monitor-test-tab/demo",
-    "packages/redux-devtools-rtk-query-monitor/demo",
-    "packages/redux-devtools-slider-monitor/examples/todomvc"
-  ],
-  "command": {
-    "publish": {
-      "allowBranch": "main"
-    }
-  }
-}

nx.json

@@ -0,0 +1,40 @@
+{
+  "extends": "nx/presets/npm.json",
+  "npmScope": "undetermined",
+  "tasksRunnerOptions": {
+    "default": {
+      "runner": "nx/tasks-runners/default",
+      "options": {
+        "cacheableOperations": ["build", "test", "lint", "package", "prepare"]
+      }
+    }
+  },
+  "targetDependencies": {
+    "build": [
+      {
+        "target": "build",
+        "projects": "dependencies"
+      }
+    ],
+    "prepare": [
+      {
+        "target": "prepare",
+        "projects": "dependencies"
+      }
+    ],
+    "package": [
+      {
+        "target": "package",
+        "projects": "dependencies"
+      }
+    ]
+  },
+  "affected": {
+    "defaultBase": "main"
+  },
+  "pluginsConfig": {
+    "@nrwl/js": {
+      "analyzeSourceFiles": false
+    }
+  }
+}

package.json

@@ -12,19 +12,33 @@
     "eslint-plugin-react": "~7.28.0",
     "eslint-plugin-react-hooks": "^4.5.0",
     "jest": "^27.5.1",
-    "lerna": "^4.0.0",
     "prettier": "2.6.2",
-    "typescript": "~4.5.5"
+    "typescript": "~4.5.5",
+    "nx": "^14.1.4",
+    "@nrwl/nx-cloud": "^14.0.3"
   },
   "scripts": {
     "format": "prettier --write .",
-    "build:all": "lerna run build",
-    "lint:all": "lerna run lint",
-    "test:all": "lerna run test",
     "format:check": "prettier --check .",
+    "build:all": "nx run-many --target=build --all",
+    "lint:all": "nx run-many --target=lint --all",
+    "test:all": "nx run-many --target=test --all",
     "release": "pnpm build:all && changeset publish"
   },
-  "packageManager": "pnpm@7.0.1",
+  "workspaces": [
+    "extension",
+    "packages/*",
+    "packages/d3-state-visualizer/examples/tree",
+    "packages/react-dock/demo",
+    "packages/react-json-tree/examples",
+    "packages/redux-devtools/examples/counter",
+    "packages/redux-devtools/examples/todomvc",
+    "packages/redux-devtools-inspector-monitor/demo",
+    "packages/redux-devtools-inspector-monitor-test-tab/demo",
+    "packages/redux-devtools-rtk-query-monitor/demo",
+    "packages/redux-devtools-slider-monitor/examples/todomvc"
+  ],
+  "packageManager": "pnpm@6.32.12",
   "pnpm": {
     "overrides": {
       "@babel/highlight>chalk": "Methuselah96/chalk#v2-without-process"

packages/redux-devtools-rtk-query-monitor/README.md

@@ -91,7 +91,7 @@ Alternatively, you can use it together with [`DockMonitor`](https://github.com/r
 #### Start Demo
 
 ```bash
-yarn lerna run start --stream --scope @redux-devtools/rtk-query-monitor
+pnpm nx start rtk-query-demo
 ```
 
 <br/>