diff --git a/.changeset/fresh-walls-impress.md b/.changeset/fresh-walls-impress.md
new file mode 100644
index 0000000000..08ccded75c
--- /dev/null
+++ b/.changeset/fresh-walls-impress.md
@@ -0,0 +1,60 @@
+---
+'@backstage/app-defaults': patch
+'@backstage/core-app-api': patch
+'@backstage/core-components': patch
+'@backstage/core-plugin-api': patch
+'@backstage/dev-utils': patch
+'@backstage/integration-react': patch
+'@backstage/test-utils': patch
+'@backstage/version-bridge': patch
+'@backstage/plugin-allure': patch
+'@backstage/plugin-analytics-module-ga': patch
+'@backstage/plugin-api-docs': patch
+'@backstage/plugin-azure-devops': patch
+'@backstage/plugin-badges': patch
+'@backstage/plugin-bazaar': patch
+'@backstage/plugin-bitrise': patch
+'@backstage/plugin-catalog': patch
+'@backstage/plugin-catalog-graph': patch
+'@backstage/plugin-catalog-import': patch
+'@backstage/plugin-catalog-react': patch
+'@backstage/plugin-circleci': patch
+'@backstage/plugin-cloudbuild': patch
+'@backstage/plugin-code-coverage': patch
+'@backstage/plugin-config-schema': patch
+'@backstage/plugin-cost-insights': patch
+'@backstage/plugin-explore': patch
+'@backstage/plugin-firehydrant': patch
+'@backstage/plugin-fossa': patch
+'@backstage/plugin-gcp-projects': patch
+'@backstage/plugin-git-release-manager': patch
+'@backstage/plugin-github-actions': patch
+'@backstage/plugin-github-deployments': patch
+'@backstage/plugin-gitops-profiles': patch
+'@backstage/plugin-graphiql': patch
+'@backstage/plugin-home': patch
+'@backstage/plugin-ilert': patch
+'@backstage/plugin-jenkins': patch
+'@backstage/plugin-kafka': patch
+'@backstage/plugin-kubernetes': patch
+'@backstage/plugin-lighthouse': patch
+'@backstage/plugin-newrelic': patch
+'@backstage/plugin-org': patch
+'@backstage/plugin-pagerduty': patch
+'@backstage/plugin-permission-react': patch
+'@backstage/plugin-rollbar': patch
+'@backstage/plugin-scaffolder': patch
+'@backstage/plugin-search': patch
+'@backstage/plugin-sentry': patch
+'@backstage/plugin-shortcuts': patch
+'@backstage/plugin-sonarqube': patch
+'@backstage/plugin-splunk-on-call': patch
+'@backstage/plugin-tech-insights': patch
+'@backstage/plugin-tech-radar': patch
+'@backstage/plugin-techdocs': patch
+'@backstage/plugin-todo': patch
+'@backstage/plugin-user-settings': patch
+'@backstage/plugin-xcmetrics': patch
+---
+
+Moved React dependencies to `peerDependencies` and allow both React v16 and v17 to be used.
diff --git a/.changeset/serious-buckets-lay.md b/.changeset/serious-buckets-lay.md
new file mode 100644
index 0000000000..70afc7ae76
--- /dev/null
+++ b/.changeset/serious-buckets-lay.md
@@ -0,0 +1,5 @@
+---
+'@backstage/cli': patch
+---
+
+Updated the frontend plugin template to put React dependencies in `peerDependencies` by default, as well as allowing both React v16 and v17. This change can be applied to existing plugins by running `yarn backstage-cli plugin:diff` within the plugin package directory.
diff --git a/packages/app-defaults/package.json b/packages/app-defaults/package.json
index 695d457455..450db2cca6 100644
--- a/packages/app-defaults/package.json
+++ b/packages/app-defaults/package.json
@@ -35,9 +35,11 @@
     "@backstage/theme": "^0.2.14",
     "@material-ui/core": "^4.12.2",
     "@material-ui/icons": "^4.9.1",
-    "react": "^16.12.0",
     "react-router-dom": "6.0.0-beta.0"
   },
+  "peerDependencies": {
+    "react": "^16.13.1 || ^17.0.0"
+  },
   "devDependencies": {
     "@backstage/cli": "^0.10.0",
     "@backstage/test-utils": "^0.1.22",
@@ -45,7 +47,7 @@
     "@testing-library/react": "^11.2.5",
     "@types/jest": "^26.0.7",
     "@types/node": "^14.14.32",
-    "@types/react": "*"
+    "@types/react": "^16.13.1 || ^17.0.0"
   },
   "files": [
     "dist"
diff --git a/packages/app/package.json b/packages/app/package.json
index 36b811c27d..4d7e7d9a62 100644
--- a/packages/app/package.json
+++ b/packages/app/package.json
@@ -56,8 +56,8 @@
     "@roadiehq/backstage-plugin-travis-ci": "^1.0.11",
     "history": "^5.0.0",
     "prop-types": "^15.7.2",
-    "react": "^16.12.0",
-    "react-dom": "^16.12.0",
+    "react": "^16.13.1",
+    "react-dom": "^16.13.1",
     "react-hot-loader": "^4.12.21",
     "react-router": "6.0.0-beta.0",
     "react-router-dom": "6.0.0-beta.0",
diff --git a/packages/cli/package.json b/packages/cli/package.json
index fe8a529de1..0a6b2b934a 100644
--- a/packages/cli/package.json
+++ b/packages/cli/package.json
@@ -89,7 +89,6 @@
     "ora": "^5.3.0",
     "postcss": "^8.1.0",
     "process": "^0.11.10",
-    "react": "^16.0.0",
     "react-dev-utils": "^12.0.0-next.47",
     "react-hot-loader": "^4.12.21",
     "recursive-readdir": "^2.2.2",
diff --git a/packages/cli/src/lib/diff/handlers.ts b/packages/cli/src/lib/diff/handlers.ts
index f8bbfa09ce..5bd90e3d22 100644
--- a/packages/cli/src/lib/diff/handlers.ts
+++ b/packages/cli/src/lib/diff/handlers.ts
@@ -75,7 +75,9 @@ class PackageJsonHandler {
     await this.syncScripts();
     await this.syncPublishConfig();
     await this.syncDependencies('dependencies');
+    await this.syncDependencies('peerDependencies', true);
     await this.syncDependencies('devDependencies');
+    await this.syncReactDeps();
   }
 
   // Make sure a field inside package.json is in sync. This mutates the targetObj and writes package.json on change.
@@ -207,12 +209,12 @@ class PackageJsonHandler {
     }
   }
 
-  private async syncDependencies(fieldName: string) {
+  private async syncDependencies(fieldName: string, required: boolean = false) {
     const pkgDeps = this.pkg[fieldName];
     const targetDeps = (this.targetPkg[fieldName] =
       this.targetPkg[fieldName] || {});
 
-    if (!pkgDeps) {
+    if (!pkgDeps && !required) {
       return;
     }
 
@@ -231,10 +233,26 @@ class PackageJsonHandler {
         continue;
       }
 
-      await this.syncField(key, pkgDeps, targetDeps, fieldName, true, true);
+      await this.syncField(
+        key,
+        pkgDeps,
+        targetDeps,
+        fieldName,
+        true,
+        !required,
+      );
     }
   }
 
+  private async syncReactDeps() {
+    const targetDeps = (this.targetPkg.dependencies =
+      this.targetPkg.dependencies || {});
+
+    // Remove these from from deps since they're now in peerDeps
+    await this.syncField('react', {}, targetDeps, 'dependencies');
+    await this.syncField('react-dom', {}, targetDeps, 'dependencies');
+  }
+
   private async write() {
     await this.writeFunc(`${JSON.stringify(this.targetPkg, null, 2)}\n`);
   }
diff --git a/packages/cli/src/lib/version.ts b/packages/cli/src/lib/version.ts
index 3b512b22c3..d65e1e06d6 100644
--- a/packages/cli/src/lib/version.ts
+++ b/packages/cli/src/lib/version.ts
@@ -66,7 +66,7 @@ export const version = findVersion();
 export const isDev = fs.pathExistsSync(paths.resolveOwn('src'));
 
 export function createPackageVersionProvider(lockfile?: Lockfile) {
-  return (name: string, versionHint?: string) => {
+  return (name: string, versionHint?: string): string => {
     const packageVersion = packageVersions[name];
     const targetVersion = versionHint || packageVersion;
     if (!targetVersion) {
@@ -94,6 +94,6 @@ export function createPackageVersionProvider(lockfile?: Lockfile) {
     if (semver.parse(versionHint)?.prerelease.length) {
       return versionHint!;
     }
-    return `^${versionHint}`;
+    return versionHint?.match(/^[\d\.]+$/) ? `^${versionHint}` : versionHint!;
   };
 }
diff --git a/packages/cli/templates/default-plugin/package.json.hbs b/packages/cli/templates/default-plugin/package.json.hbs
index 624302da93..7461b0a57b 100644
--- a/packages/cli/templates/default-plugin/package.json.hbs
+++ b/packages/cli/templates/default-plugin/package.json.hbs
@@ -32,10 +32,11 @@
     "@material-ui/core": "{{versionQuery '@material-ui/core' '4.12.2'}}",
     "@material-ui/icons": "{{versionQuery '@material-ui/icons' '4.9.1'}}",
     "@material-ui/lab": "{{versionQuery '@material-ui/lab' '4.0.0-alpha.57'}}",
-    "react": "{{versionQuery 'react' '16.13.1'}}",
-    "react-dom": "{{versionQuery 'react-dom' '16.13.1'}}",
     "react-use": "{{versionQuery 'react-use' '17.2.4'}}"
   },
+  "peerDependencies": {
+    "react": "{{versionQuery 'react' '^16.13.1 || ^17.0.0'}}"
+  },
   "devDependencies": {
     "@backstage/cli": "{{versionQuery '@backstage/cli'}}",
     "@backstage/core-app-api": "{{versionQuery '@backstage/core-app-api'}}",
diff --git a/packages/core-app-api/package.json b/packages/core-app-api/package.json
index 9ab3e097d1..183f578f5c 100644
--- a/packages/core-app-api/package.json
+++ b/packages/core-app-api/package.json
@@ -38,14 +38,16 @@
     "@backstage/version-bridge": "^0.1.0",
     "@material-ui/core": "^4.12.2",
     "@material-ui/icons": "^4.9.1",
-    "@types/react": "*",
     "@types/prop-types": "^15.7.3",
     "prop-types": "^15.7.2",
-    "react": "^16.12.0",
     "react-router-dom": "6.0.0-beta.0",
     "react-use": "^17.2.4",
     "zen-observable": "^0.8.15"
   },
+  "peerDependencies": {
+    "@types/react": "^16.13.1 || ^17.0.0",
+    "react": "^16.13.1 || ^17.0.0"
+  },
   "devDependencies": {
     "@backstage/cli": "^0.10.0",
     "@backstage/test-utils": "^0.1.23",
diff --git a/packages/core-components/package.json b/packages/core-components/package.json
index 80bfe64629..1b04173c40 100644
--- a/packages/core-components/package.json
+++ b/packages/core-components/package.json
@@ -37,7 +37,6 @@
     "@material-ui/core": "^4.12.2",
     "@material-ui/icons": "^4.9.1",
     "@material-ui/lab": "4.0.0-alpha.57",
-    "@types/react": "*",
     "@types/react-sparklines": "^1.7.0",
     "@types/react-text-truncate": "^0.14.0",
     "classnames": "^2.2.6",
@@ -53,8 +52,6 @@
     "prop-types": "^15.7.2",
     "qs": "^6.9.4",
     "rc-progress": "^3.0.0",
-    "react": "^16.12.0",
-    "react-dom": "^16.12.0",
     "react-helmet": "6.1.0",
     "react-hook-form": "^7.12.2",
     "react-markdown": "^7.0.1",
@@ -67,6 +64,11 @@
     "remark-gfm": "^2.0.0",
     "zen-observable": "^0.8.15"
   },
+  "peerDependencies": {
+    "@types/react": "^16.13.1 || ^17.0.0",
+    "react": "^16.13.1 || ^17.0.0",
+    "react-dom": "^16.13.1 || ^17.0.0"
+  },
   "devDependencies": {
     "@backstage/core-app-api": "^0.1.24",
     "@backstage/cli": "^0.10.0",
diff --git a/packages/core-components/src/components/CopyTextButton/CopyTextButton.test.tsx b/packages/core-components/src/components/CopyTextButton/CopyTextButton.test.tsx
index a9532dd79b..ecb784f951 100644
--- a/packages/core-components/src/components/CopyTextButton/CopyTextButton.test.tsx
+++ b/packages/core-components/src/components/CopyTextButton/CopyTextButton.test.tsx
@@ -15,8 +15,7 @@
  */
 
 import React from 'react';
-import { fireEvent } from '@testing-library/react';
-import { act } from 'react-dom/test-utils';
+import { act, fireEvent } from '@testing-library/react';
 import { renderInTestApp, TestApiProvider } from '@backstage/test-utils';
 import { CopyTextButton } from './CopyTextButton';
 import { errorApiRef } from '@backstage/core-plugin-api';
diff --git a/packages/core-components/src/components/Progress/Progress.test.tsx b/packages/core-components/src/components/Progress/Progress.test.tsx
index 4f4e74ce08..d4057c1675 100644
--- a/packages/core-components/src/components/Progress/Progress.test.tsx
+++ b/packages/core-components/src/components/Progress/Progress.test.tsx
@@ -16,7 +16,7 @@
 
 import React from 'react';
 import { renderInTestApp } from '@backstage/test-utils';
-import { act } from 'react-dom/test-utils';
+import { act } from '@testing-library/react';
 
 import { Progress } from './Progress';
 
diff --git a/packages/core-components/src/components/TabbedLayout/RoutedTabs.test.tsx b/packages/core-components/src/components/TabbedLayout/RoutedTabs.test.tsx
index bbd48c127c..f76524fe50 100644
--- a/packages/core-components/src/components/TabbedLayout/RoutedTabs.test.tsx
+++ b/packages/core-components/src/components/TabbedLayout/RoutedTabs.test.tsx
@@ -14,9 +14,8 @@
  * limitations under the License.
  */
 import { renderInTestApp } from '@backstage/test-utils';
-import { fireEvent } from '@testing-library/react';
+import { act, fireEvent } from '@testing-library/react';
 import React from 'react';
-import { act } from 'react-dom/test-utils';
 import { Route, Routes } from 'react-router';
 import { RoutedTabs } from './RoutedTabs';
 
diff --git a/packages/core-components/src/components/TabbedLayout/TabbedLayout.test.tsx b/packages/core-components/src/components/TabbedLayout/TabbedLayout.test.tsx
index 2bc60783d7..55422faffc 100644
--- a/packages/core-components/src/components/TabbedLayout/TabbedLayout.test.tsx
+++ b/packages/core-components/src/components/TabbedLayout/TabbedLayout.test.tsx
@@ -14,9 +14,8 @@
  * limitations under the License.
  */
 import { renderInTestApp, withLogCollector } from '@backstage/test-utils';
-import { fireEvent } from '@testing-library/react';
+import { act, fireEvent } from '@testing-library/react';
 import React from 'react';
-import { act } from 'react-dom/test-utils';
 import { Route, Routes } from 'react-router';
 import { TabbedLayout } from './TabbedLayout';
 
diff --git a/packages/core-plugin-api/package.json b/packages/core-plugin-api/package.json
index 3e07207c9d..d950a75ab4 100644
--- a/packages/core-plugin-api/package.json
+++ b/packages/core-plugin-api/package.json
@@ -34,14 +34,16 @@
     "@backstage/types": "^0.1.1",
     "@backstage/version-bridge": "^0.1.0",
     "@material-ui/core": "^4.12.2",
-    "@types/react": "*",
     "history": "^5.0.0",
     "prop-types": "^15.7.2",
-    "react": "^16.12.0",
     "react-router-dom": "6.0.0-beta.0",
     "react-use": "^17.2.4",
     "zen-observable": "^0.8.15"
   },
+  "peerDependencies": {
+    "@types/react": "^16.13.1 || ^17.0.0",
+    "react": "^16.13.1 || ^17.0.0"
+  },
   "devDependencies": {
     "@backstage/cli": "^0.10.0",
     "@backstage/core-app-api": "^0.1.24",
diff --git a/packages/dev-utils/package.json b/packages/dev-utils/package.json
index 110d774777..0c8bf8e3a0 100644
--- a/packages/dev-utils/package.json
+++ b/packages/dev-utils/package.json
@@ -43,15 +43,17 @@
     "@testing-library/jest-dom": "^5.10.1",
     "@testing-library/react": "^11.2.5",
     "@testing-library/user-event": "^13.1.8",
-    "@types/react": "*",
-    "react": "^16.12.0",
     "react-use": "^17.2.4",
-    "react-dom": "^16.12.0",
     "react-hot-loader": "^4.12.21",
     "react-router": "6.0.0-beta.0",
     "react-router-dom": "6.0.0-beta.0",
     "zen-observable": "^0.8.15"
   },
+  "peerDependencies": {
+    "@types/react": "^16.13.1 || ^17.0.0",
+    "react": "^16.13.1 || ^17.0.0",
+    "react-dom": "^16.13.1 || ^17.0.0"
+  },
   "devDependencies": {
     "@backstage/cli": "^0.10.0",
     "@types/jest": "^26.0.7",
diff --git a/packages/integration-react/package.json b/packages/integration-react/package.json
index be38d92b64..9dcd0fdb2e 100644
--- a/packages/integration-react/package.json
+++ b/packages/integration-react/package.json
@@ -29,10 +29,11 @@
     "@material-ui/core": "^4.12.2",
     "@material-ui/icons": "^4.9.1",
     "@material-ui/lab": "4.0.0-alpha.57",
-    "react": "^16.13.1",
-    "react-dom": "^16.13.1",
     "react-use": "^17.2.4"
   },
+  "peerDependencies": {
+    "react": "^16.13.1 || ^17.0.0"
+  },
   "devDependencies": {
     "@backstage/cli": "^0.10.0",
     "@backstage/dev-utils": "^0.2.13",
diff --git a/packages/storybook/package.json b/packages/storybook/package.json
index 736afbb8d8..5df0c06632 100644
--- a/packages/storybook/package.json
+++ b/packages/storybook/package.json
@@ -9,8 +9,8 @@
   },
   "dependencies": {
     "@backstage/theme": "^0.2.0",
-    "react": "^16.12.0",
-    "react-dom": "^16.12.0"
+    "react": "^16.13.1",
+    "react-dom": "^16.13.1"
   },
   "devDependencies": {
     "@storybook/addon-a11y": "^6.3.4",
diff --git a/packages/test-utils/package.json b/packages/test-utils/package.json
index 87c5b346f6..c4e850838a 100644
--- a/packages/test-utils/package.json
+++ b/packages/test-utils/package.json
@@ -38,13 +38,14 @@
     "@testing-library/jest-dom": "^5.10.1",
     "@testing-library/react": "^11.2.5",
     "@testing-library/user-event": "^13.1.8",
-    "@types/react": "*",
-    "react": "^16.12.0",
-    "react-dom": "^16.12.0",
     "react-router": "6.0.0-beta.0",
     "react-router-dom": "6.0.0-beta.0",
     "zen-observable": "^0.8.15"
   },
+  "peerDependencies": {
+    "@types/react": "^16.13.1 || ^17.0.0",
+    "react": "^16.13.1 || ^17.0.0"
+  },
   "devDependencies": {
     "@backstage/cli": "^0.10.0",
     "@types/jest": "^26.0.7",
diff --git a/packages/test-utils/src/testUtils/testingLibrary.ts b/packages/test-utils/src/testUtils/testingLibrary.ts
index 44ea20a4cc..9fb47cbc90 100644
--- a/packages/test-utils/src/testUtils/testingLibrary.ts
+++ b/packages/test-utils/src/testUtils/testingLibrary.ts
@@ -15,8 +15,7 @@
  */
 
 import { ReactElement } from 'react';
-import { act } from 'react-dom/test-utils';
-import { render, RenderResult } from '@testing-library/react';
+import { act, render, RenderResult } from '@testing-library/react';
 
 /**
  * @public
diff --git a/packages/version-bridge/package.json b/packages/version-bridge/package.json
index 89baaea2f5..82846e1393 100644
--- a/packages/version-bridge/package.json
+++ b/packages/version-bridge/package.json
@@ -28,9 +28,9 @@
     "postpack": "backstage-cli postpack",
     "clean": "backstage-cli clean"
   },
-  "dependencies": {
-    "@types/react": "*",
-    "react": "^16.12.0"
+  "peerDependencies": {
+    "@types/react": "^16.13.1 || ^17.0.0",
+    "react": "^16.13.1 || ^17.0.0"
   },
   "devDependencies": {
     "@backstage/cli": "^0.10.0",
diff --git a/plugins/allure/package.json b/plugins/allure/package.json
index 5c795e919f..f4e8ba1c1d 100644
--- a/plugins/allure/package.json
+++ b/plugins/allure/package.json
@@ -30,11 +30,12 @@
     "@material-ui/core": "^4.12.2",
     "@material-ui/icons": "^4.9.1",
     "@material-ui/lab": "4.0.0-alpha.57",
-    "react": "^16.13.1",
-    "react-dom": "^16.13.1",
     "react-router-dom": "6.0.0-beta.0",
     "react-use": "^17.2.4"
   },
+  "peerDependencies": {
+    "react": "^16.13.1 || ^17.0.0"
+  },
   "devDependencies": {
     "@backstage/cli": "^0.10.0",
     "@backstage/core-app-api": "^0.1.24",
diff --git a/plugins/analytics-module-ga/package.json b/plugins/analytics-module-ga/package.json
index e3a3c74111..8e36c7225e 100644
--- a/plugins/analytics-module-ga/package.json
+++ b/plugins/analytics-module-ga/package.json
@@ -28,11 +28,12 @@
     "@material-ui/core": "^4.12.2",
     "@material-ui/icons": "^4.9.1",
     "@material-ui/lab": "4.0.0-alpha.57",
-    "react": "^16.13.1",
-    "react-dom": "^16.13.1",
     "react-ga": "^3.3.0",
     "react-use": "^17.2.4"
   },
+  "peerDependencies": {
+    "react": "^16.13.1 || ^17.0.0"
+  },
   "devDependencies": {
     "@backstage/cli": "^0.10.0",
     "@backstage/core-app-api": "^0.1.24",
diff --git a/plugins/api-docs/package.json b/plugins/api-docs/package.json
index 984b534850..7ab2eb7f06 100644
--- a/plugins/api-docs/package.json
+++ b/plugins/api-docs/package.json
@@ -40,18 +40,19 @@
     "@material-ui/core": "^4.12.2",
     "@material-ui/icons": "^4.9.1",
     "@material-ui/lab": "4.0.0-alpha.57",
-    "@types/react": "*",
     "graphiql": "^1.5.12",
     "graphql": "^16.0.0",
     "isomorphic-form-data": "^2.0.0",
-    "react": "^16.13.1",
-    "react-dom": "^16.13.1",
     "react-router": "6.0.0-beta.0",
     "react-router-dom": "6.0.0-beta.0",
     "react-use": "^17.2.4",
     "swagger-client": "3.16.1",
     "swagger-ui-react": "^4.0.0-rc.3"
   },
+  "peerDependencies": {
+    "@types/react": "^16.13.1 || ^17.0.0",
+    "react": "^16.13.1 || ^17.0.0"
+  },
   "devDependencies": {
     "@backstage/cli": "^0.10.0",
     "@backstage/core-app-api": "^0.1.24",
diff --git a/plugins/azure-devops/package.json b/plugins/azure-devops/package.json
index 29f133ab5b..05c64c9b76 100644
--- a/plugins/azure-devops/package.json
+++ b/plugins/azure-devops/package.json
@@ -39,11 +39,12 @@
     "@material-ui/lab": "4.0.0-alpha.57",
     "humanize-duration": "^3.27.0",
     "luxon": "^2.0.2",
-    "react": "^16.13.1",
-    "react-dom": "^16.13.1",
     "react-router": "6.0.0-beta.0",
     "react-use": "^17.2.4"
   },
+  "peerDependencies": {
+    "react": "^16.13.1 || ^17.0.0"
+  },
   "devDependencies": {
     "@backstage/cli": "^0.10.0",
     "@backstage/core-app-api": "^0.1.24",
diff --git a/plugins/badges/package.json b/plugins/badges/package.json
index 7c478c0a26..a75f3c3b85 100644
--- a/plugins/badges/package.json
+++ b/plugins/badges/package.json
@@ -36,11 +36,12 @@
     "@material-ui/core": "^4.12.2",
     "@material-ui/icons": "^4.9.1",
     "@material-ui/lab": "4.0.0-alpha.57",
-    "react": "^16.13.1",
-    "react-dom": "^16.13.1",
     "react-router": "6.0.0-beta.0",
     "react-use": "^17.2.4"
   },
+  "peerDependencies": {
+    "react": "^16.13.1 || ^17.0.0"
+  },
   "devDependencies": {
     "@backstage/cli": "^0.10.0",
     "@backstage/core-app-api": "^0.1.24",
diff --git a/plugins/bazaar/package.json b/plugins/bazaar/package.json
index 2defba5cca..9cefc6c2dd 100644
--- a/plugins/bazaar/package.json
+++ b/plugins/bazaar/package.json
@@ -34,12 +34,13 @@
     "@material-ui/pickers": "^3.3.10",
     "@testing-library/jest-dom": "^5.10.1",
     "luxon": "^2.0.2",
-    "react": "^16.13.1",
-    "react-dom": "^16.13.1",
     "react-hook-form": "^7.13.0",
     "react-router-dom": "6.0.0-beta.0",
     "react-use": "^17.2.4"
   },
+  "peerDependencies": {
+    "react": "^16.13.1 || ^17.0.0"
+  },
   "devDependencies": {
     "@backstage/cli": "^0.10.0",
     "@backstage/dev-utils": "^0.2.13",
diff --git a/plugins/bitrise/package.json b/plugins/bitrise/package.json
index b036610f0a..71af8abf83 100644
--- a/plugins/bitrise/package.json
+++ b/plugins/bitrise/package.json
@@ -33,11 +33,12 @@
     "lodash": "^4.17.21",
     "luxon": "^2.0.2",
     "qs": "^6.9.6",
-    "react": "^16.13.1",
-    "react-dom": "^16.13.1",
     "react-use": "^17.2.4",
     "recharts": "^1.8.5"
   },
+  "peerDependencies": {
+    "react": "^16.13.1 || ^17.0.0"
+  },
   "devDependencies": {
     "@backstage/cli": "^0.10.0",
     "@backstage/core-app-api": "^0.1.24",
diff --git a/plugins/catalog-graph/package.json b/plugins/catalog-graph/package.json
index 2a44593a4a..edd187eddb 100644
--- a/plugins/catalog-graph/package.json
+++ b/plugins/catalog-graph/package.json
@@ -30,16 +30,17 @@
     "@material-ui/core": "^4.12.2",
     "@material-ui/icons": "^4.9.1",
     "@material-ui/lab": "4.0.0-alpha.57",
-    "@types/react": "*",
     "classnames": "^2.3.1",
     "lodash": "^4.17.15",
     "p-limit": "^3.1.0",
     "qs": "^6.9.4",
-    "react": "^16.13.1",
-    "react-dom": "^16.13.1",
     "react-router": "6.0.0-beta.0",
     "react-use": "^17.2.4"
   },
+  "peerDependencies": {
+    "@types/react": "^16.13.1 || ^17.0.0",
+    "react": "^16.13.1 || ^17.0.0"
+  },
   "devDependencies": {
     "@backstage/cli": "^0.10.0",
     "@backstage/core-app-api": "^0.1.24",
diff --git a/plugins/catalog-import/package.json b/plugins/catalog-import/package.json
index b370c9fa33..cadb50a6af 100644
--- a/plugins/catalog-import/package.json
+++ b/plugins/catalog-import/package.json
@@ -43,17 +43,18 @@
     "@material-ui/icons": "^4.9.1",
     "@material-ui/lab": "4.0.0-alpha.57",
     "@octokit/rest": "^18.5.3",
-    "@types/react": "*",
     "git-url-parse": "^11.6.0",
     "js-base64": "^3.6.0",
     "lodash": "^4.17.21",
-    "react": "^16.13.1",
-    "react-dom": "^16.13.1",
     "react-hook-form": "^7.12.2",
     "react-router": "6.0.0-beta.0",
     "react-use": "^17.2.4",
     "yaml": "^1.10.0"
   },
+  "peerDependencies": {
+    "@types/react": "^16.13.1 || ^17.0.0",
+    "react": "^16.13.1 || ^17.0.0"
+  },
   "devDependencies": {
     "@backstage/cli": "^0.10.0",
     "@backstage/core-app-api": "^0.1.24",
diff --git a/plugins/catalog-react/package.json b/plugins/catalog-react/package.json
index 799c6d0ce6..d100e03dde 100644
--- a/plugins/catalog-react/package.json
+++ b/plugins/catalog-react/package.json
@@ -41,15 +41,17 @@
     "@material-ui/core": "^4.12.2",
     "@material-ui/icons": "^4.9.1",
     "@material-ui/lab": "4.0.0-alpha.57",
-    "@types/react": "*",
     "jwt-decode": "^3.1.0",
     "lodash": "^4.17.21",
     "qs": "^6.9.4",
-    "react": "^16.13.1",
     "react-router": "6.0.0-beta.0",
     "react-use": "^17.2.4",
     "zen-observable": "^0.8.15"
   },
+  "peerDependencies": {
+    "@types/react": "^16.13.1 || ^17.0.0",
+    "react": "^16.13.1 || ^17.0.0"
+  },
   "devDependencies": {
     "@backstage/cli": "^0.10.0",
     "@backstage/test-utils": "^0.1.22",
diff --git a/plugins/catalog/package.json b/plugins/catalog/package.json
index 6caadb7b42..6fd875249e 100644
--- a/plugins/catalog/package.json
+++ b/plugins/catalog/package.json
@@ -42,15 +42,16 @@
     "@material-ui/core": "^4.12.2",
     "@material-ui/icons": "^4.9.1",
     "@material-ui/lab": "4.0.0-alpha.57",
-    "@types/react": "*",
     "history": "^5.0.0",
     "lodash": "^4.17.21",
-    "react": "^16.13.1",
-    "react-dom": "^16.13.1",
     "react-helmet": "6.1.0",
     "react-router": "6.0.0-beta.0",
     "react-use": "^17.2.4"
   },
+  "peerDependencies": {
+    "@types/react": "^16.13.1 || ^17.0.0",
+    "react": "^16.13.1 || ^17.0.0"
+  },
   "devDependencies": {
     "@backstage/cli": "^0.10.0",
     "@backstage/core-app-api": "^0.1.24",
diff --git a/plugins/catalog/src/components/EntityLayout/EntityLayout.test.tsx b/plugins/catalog/src/components/EntityLayout/EntityLayout.test.tsx
index 3f3fc804e1..a45afe6e02 100644
--- a/plugins/catalog/src/components/EntityLayout/EntityLayout.test.tsx
+++ b/plugins/catalog/src/components/EntityLayout/EntityLayout.test.tsx
@@ -31,9 +31,8 @@ import {
   renderInTestApp,
   TestApiRegistry,
 } from '@backstage/test-utils';
-import { fireEvent } from '@testing-library/react';
+import { act, fireEvent } from '@testing-library/react';
 import React from 'react';
-import { act } from 'react-dom/test-utils';
 import { Route, Routes } from 'react-router';
 import { EntityLayout } from './EntityLayout';
 
diff --git a/plugins/catalog/src/components/EntityPageLayout/Tabbed/Tabbed.test.tsx b/plugins/catalog/src/components/EntityPageLayout/Tabbed/Tabbed.test.tsx
index 9681420e1c..ad111380f8 100644
--- a/plugins/catalog/src/components/EntityPageLayout/Tabbed/Tabbed.test.tsx
+++ b/plugins/catalog/src/components/EntityPageLayout/Tabbed/Tabbed.test.tsx
@@ -16,8 +16,7 @@
 import React from 'react';
 import { Tabbed } from './Tabbed';
 import { renderInTestApp } from '@backstage/test-utils';
-import { fireEvent } from '@testing-library/react';
-import { act } from 'react-dom/test-utils';
+import { act, fireEvent } from '@testing-library/react';
 import { Routes, Route } from 'react-router';
 
 describe('Tabbed layout', () => {
diff --git a/plugins/circleci/package.json b/plugins/circleci/package.json
index 45579ab82b..9d94d61dcd 100644
--- a/plugins/circleci/package.json
+++ b/plugins/circleci/package.json
@@ -44,13 +44,14 @@
     "humanize-duration": "^3.27.0",
     "lodash": "^4.17.21",
     "luxon": "^2.0.2",
-    "react": "^16.13.1",
-    "react-dom": "^16.13.1",
     "react-lazylog": "^4.5.2",
     "react-router": "6.0.0-beta.0",
     "react-router-dom": "6.0.0-beta.0",
     "react-use": "^17.2.4"
   },
+  "peerDependencies": {
+    "react": "^16.13.1 || ^17.0.0"
+  },
   "devDependencies": {
     "@backstage/cli": "^0.10.0",
     "@backstage/core-app-api": "^0.1.24",
diff --git a/plugins/cloudbuild/package.json b/plugins/cloudbuild/package.json
index 3c9e14c9e7..6fab2b8d35 100644
--- a/plugins/cloudbuild/package.json
+++ b/plugins/cloudbuild/package.json
@@ -41,13 +41,14 @@
     "@material-ui/lab": "4.0.0-alpha.57",
     "luxon": "^2.0.2",
     "qs": "^6.9.4",
-    "react": "^16.13.1",
-    "react-dom": "^16.13.1",
     "react-lazylog": "^4.5.3",
     "react-router": "6.0.0-beta.0",
     "react-router-dom": "6.0.0-beta.0",
     "react-use": "^17.2.4"
   },
+  "peerDependencies": {
+    "react": "^16.13.1 || ^17.0.0"
+  },
   "devDependencies": {
     "@backstage/cli": "^0.10.0",
     "@backstage/core-app-api": "^0.1.24",
diff --git a/plugins/code-coverage/package.json b/plugins/code-coverage/package.json
index 907a0abcd7..d1a7d019bb 100644
--- a/plugins/code-coverage/package.json
+++ b/plugins/code-coverage/package.json
@@ -34,13 +34,14 @@
     "@material-ui/styles": "^4.11.0",
     "highlight.js": "^10.6.0",
     "luxon": "^2.0.2",
-    "react": "^16.13.1",
-    "react-dom": "^16.13.1",
     "react-router": "6.0.0-beta.0",
     "react-router-dom": "6.0.0-beta.0",
     "react-use": "^17.2.4",
     "recharts": "^1.8.5"
   },
+  "peerDependencies": {
+    "react": "^16.13.1 || ^17.0.0"
+  },
   "devDependencies": {
     "@backstage/cli": "^0.10.0",
     "@backstage/core-app-api": "^0.1.24",
diff --git a/plugins/config-schema/package.json b/plugins/config-schema/package.json
index 6b79c5493c..be9fb7fb12 100644
--- a/plugins/config-schema/package.json
+++ b/plugins/config-schema/package.json
@@ -31,11 +31,12 @@
     "@material-ui/icons": "^4.9.1",
     "@material-ui/lab": "4.0.0-alpha.57",
     "jsonschema": "^1.2.6",
-    "react": "^16.13.1",
-    "react-dom": "^16.13.1",
     "react-use": "^17.2.4",
     "zen-observable": "^0.8.15"
   },
+  "peerDependencies": {
+    "react": "^16.13.1 || ^17.0.0"
+  },
   "devDependencies": {
     "@backstage/cli": "^0.10.0",
     "@backstage/core-app-api": "^0.1.24",
diff --git a/plugins/cost-insights/package.json b/plugins/cost-insights/package.json
index 6a2d582d63..6e196fffcb 100644
--- a/plugins/cost-insights/package.json
+++ b/plugins/cost-insights/package.json
@@ -39,21 +39,22 @@
     "@material-ui/icons": "^4.9.1",
     "@material-ui/lab": "4.0.0-alpha.57",
     "@material-ui/styles": "^4.9.6",
-    "@types/react": "*",
     "@types/recharts": "^1.8.14",
     "classnames": "^2.2.6",
     "history": "^5.0.0",
     "luxon": "^2.0.2",
     "pluralize": "^8.0.0",
     "qs": "^6.9.4",
-    "react": "^16.13.1",
-    "react-dom": "^16.13.1",
     "react-router-dom": "6.0.0-beta.0",
     "react-use": "^17.2.4",
     "recharts": "^1.8.5",
     "regression": "^2.0.1",
     "yup": "^0.32.9"
   },
+  "peerDependencies": {
+    "@types/react": "^16.13.1 || ^17.0.0",
+    "react": "^16.13.1 || ^17.0.0"
+  },
   "devDependencies": {
     "@backstage/cli": "^0.10.0",
     "@backstage/core-app-api": "^0.1.24",
diff --git a/plugins/explore/package.json b/plugins/explore/package.json
index b4e08a526f..62a7aae2dc 100644
--- a/plugins/explore/package.json
+++ b/plugins/explore/package.json
@@ -40,14 +40,15 @@
     "@material-ui/core": "^4.12.2",
     "@material-ui/icons": "^4.9.1",
     "@material-ui/lab": "4.0.0-alpha.57",
-    "@types/react": "*",
     "classnames": "^2.2.6",
-    "react": "^16.13.1",
-    "react-dom": "^16.13.1",
     "react-router": "6.0.0-beta.0",
     "react-router-dom": "6.0.0-beta.0",
     "react-use": "^17.2.4"
   },
+  "peerDependencies": {
+    "@types/react": "^16.13.1 || ^17.0.0",
+    "react": "^16.13.1 || ^17.0.0"
+  },
   "devDependencies": {
     "@backstage/cli": "^0.10.0",
     "@backstage/core-app-api": "^0.1.24",
diff --git a/plugins/firehydrant/package.json b/plugins/firehydrant/package.json
index 2b3bf05b1e..e6cb9e8375 100644
--- a/plugins/firehydrant/package.json
+++ b/plugins/firehydrant/package.json
@@ -30,10 +30,11 @@
     "@material-ui/icons": "^4.9.1",
     "@material-ui/lab": "4.0.0-alpha.57",
     "luxon": "^1.27.0",
-    "react": "^16.13.1",
-    "react-dom": "^16.13.1",
     "react-use": "^17.2.4"
   },
+  "peerDependencies": {
+    "react": "^16.13.1 || ^17.0.0"
+  },
   "devDependencies": {
     "@backstage/cli": "^0.10.0",
     "@backstage/core-app-api": "^0.1.24",
diff --git a/plugins/fossa/package.json b/plugins/fossa/package.json
index 7d56fdc333..9c79b14685 100644
--- a/plugins/fossa/package.json
+++ b/plugins/fossa/package.json
@@ -44,10 +44,11 @@
     "cross-fetch": "^3.0.6",
     "luxon": "^2.0.2",
     "p-limit": "^3.0.2",
-    "react": "^16.13.1",
-    "react-dom": "^16.13.1",
     "react-use": "^17.2.4"
   },
+  "peerDependencies": {
+    "react": "^16.13.1 || ^17.0.0"
+  },
   "devDependencies": {
     "@backstage/cli": "^0.10.0",
     "@backstage/core-app-api": "^0.1.24",
diff --git a/plugins/gcp-projects/package.json b/plugins/gcp-projects/package.json
index a3a53b317e..17d43de3d2 100644
--- a/plugins/gcp-projects/package.json
+++ b/plugins/gcp-projects/package.json
@@ -37,11 +37,12 @@
     "@material-ui/core": "^4.12.2",
     "@material-ui/icons": "^4.9.1",
     "@material-ui/lab": "4.0.0-alpha.57",
-    "react": "^16.13.1",
-    "react-dom": "^16.13.1",
     "react-router-dom": "^6.0.0-beta.0",
     "react-use": "^17.2.4"
   },
+  "peerDependencies": {
+    "react": "^16.13.1 || ^17.0.0"
+  },
   "devDependencies": {
     "@backstage/cli": "^0.10.0",
     "@backstage/core-app-api": "^0.1.24",
diff --git a/plugins/git-release-manager/package.json b/plugins/git-release-manager/package.json
index c5ef82ac16..0c19efc211 100644
--- a/plugins/git-release-manager/package.json
+++ b/plugins/git-release-manager/package.json
@@ -29,15 +29,16 @@
     "@material-ui/icons": "^4.9.1",
     "@material-ui/lab": "4.0.0-alpha.57",
     "@octokit/rest": "^18.5.3",
-    "@types/react": "*",
     "luxon": "^2.0.2",
     "qs": "^6.10.1",
-    "react": "^16.13.1",
-    "react-dom": "^16.13.1",
     "react-router": "6.0.0-beta.0",
     "react-use": "^17.2.4",
     "recharts": "^1.8.5"
   },
+  "peerDependencies": {
+    "@types/react": "^16.13.1 || ^17.0.0",
+    "react": "^16.13.1 || ^17.0.0"
+  },
   "devDependencies": {
     "@backstage/cli": "^0.10.0",
     "@backstage/core-app-api": "^0.1.24",
diff --git a/plugins/github-actions/package.json b/plugins/github-actions/package.json
index b0fa469a50..0ea8bbe9f2 100644
--- a/plugins/github-actions/package.json
+++ b/plugins/github-actions/package.json
@@ -44,13 +44,14 @@
     "@material-ui/lab": "4.0.0-alpha.57",
     "@octokit/rest": "^18.5.3",
     "luxon": "^2.0.2",
-    "react": "^16.13.1",
-    "react-dom": "^16.13.1",
     "react-lazylog": "^4.5.3",
     "react-router": "6.0.0-beta.0",
     "react-router-dom": "6.0.0-beta.0",
     "react-use": "^17.2.4"
   },
+  "peerDependencies": {
+    "react": "^16.13.1 || ^17.0.0"
+  },
   "devDependencies": {
     "@backstage/cli": "^0.10.0",
     "@backstage/core-app-api": "^0.1.24",
diff --git a/plugins/github-deployments/package.json b/plugins/github-deployments/package.json
index a1dad4ecca..4836568a1f 100644
--- a/plugins/github-deployments/package.json
+++ b/plugins/github-deployments/package.json
@@ -34,10 +34,11 @@
     "@material-ui/lab": "4.0.0-alpha.57",
     "@octokit/graphql": "^4.5.8",
     "luxon": "^2.0.2",
-    "react": "^16.13.1",
-    "react-dom": "^16.13.1",
     "react-use": "^17.2.4"
   },
+  "peerDependencies": {
+    "react": "^16.13.1 || ^17.0.0"
+  },
   "devDependencies": {
     "@backstage/cli": "^0.10.0",
     "@backstage/core-app-api": "^0.1.24",
diff --git a/plugins/gitops-profiles/package.json b/plugins/gitops-profiles/package.json
index 6b211f59ed..5cc63e43df 100644
--- a/plugins/gitops-profiles/package.json
+++ b/plugins/gitops-profiles/package.json
@@ -38,11 +38,12 @@
     "@material-ui/core": "^4.12.2",
     "@material-ui/icons": "^4.9.1",
     "@material-ui/lab": "4.0.0-alpha.57",
-    "react": "^16.13.1",
-    "react-dom": "^16.13.1",
     "react-router-dom": "6.0.0-beta.0",
     "react-use": "^17.2.4"
   },
+  "peerDependencies": {
+    "react": "^16.13.1 || ^17.0.0"
+  },
   "devDependencies": {
     "@backstage/cli": "^0.10.0",
     "@backstage/core-app-api": "^0.1.24",
diff --git a/plugins/graphiql/package.json b/plugins/graphiql/package.json
index a3aaf7fa69..06dd85aeee 100644
--- a/plugins/graphiql/package.json
+++ b/plugins/graphiql/package.json
@@ -39,10 +39,11 @@
     "@material-ui/lab": "4.0.0-alpha.57",
     "graphiql": "^1.5.12",
     "graphql": "^16.0.0",
-    "react": "^16.13.1",
-    "react-dom": "^16.13.1",
     "react-use": "^17.2.4"
   },
+  "peerDependencies": {
+    "react": "^16.13.1 || ^17.0.0"
+  },
   "devDependencies": {
     "@backstage/cli": "^0.10.0",
     "@backstage/core-app-api": "^0.1.24",
diff --git a/plugins/graphiql/src/components/GraphiQLPage/GraphiQLPage.test.tsx b/plugins/graphiql/src/components/GraphiQLPage/GraphiQLPage.test.tsx
index ae84b549ec..90f8edd4ad 100644
--- a/plugins/graphiql/src/components/GraphiQLPage/GraphiQLPage.test.tsx
+++ b/plugins/graphiql/src/components/GraphiQLPage/GraphiQLPage.test.tsx
@@ -18,7 +18,7 @@ import React from 'react';
 import { GraphiQLPage } from './GraphiQLPage';
 import { ThemeProvider } from '@material-ui/core';
 import { lightTheme } from '@backstage/theme';
-import { act } from 'react-dom/test-utils';
+import { act } from '@testing-library/react';
 import { renderWithEffects, TestApiProvider } from '@backstage/test-utils';
 import { GraphQLBrowseApi, graphQlBrowseApiRef } from '../../lib/api';
 import { configApiRef } from '@backstage/core-plugin-api';
diff --git a/plugins/home/package.json b/plugins/home/package.json
index 97ec5fdfc2..6d8df2e7a8 100644
--- a/plugins/home/package.json
+++ b/plugins/home/package.json
@@ -27,13 +27,14 @@
     "@material-ui/core": "^4.12.2",
     "@material-ui/icons": "^4.9.1",
     "@material-ui/lab": "4.0.0-alpha.57",
-    "@types/react": "*",
     "lodash": "^4.17.21",
-    "react": "^16.13.1",
-    "react-dom": "^16.13.1",
     "react-router": "6.0.0-beta.0",
     "react-use": "^17.2.4"
   },
+  "peerDependencies": {
+    "@types/react": "^16.13.1 || ^17.0.0",
+    "react": "^16.13.1 || ^17.0.0"
+  },
   "devDependencies": {
     "@backstage/cli": "^0.10.0",
     "@backstage/core-app-api": "^0.1.24",
diff --git a/plugins/ilert/package.json b/plugins/ilert/package.json
index 2e477b2f06..4d7cfd9bfb 100644
--- a/plugins/ilert/package.json
+++ b/plugins/ilert/package.json
@@ -34,10 +34,11 @@
     "@material-ui/pickers": "^3.3.10",
     "humanize-duration": "^3.26.0",
     "luxon": "^2.0.2",
-    "react": "^16.13.1",
-    "react-dom": "^16.13.1",
     "react-use": "^17.2.4"
   },
+  "peerDependencies": {
+    "react": "^16.13.1 || ^17.0.0"
+  },
   "devDependencies": {
     "@backstage/cli": "^0.10.0",
     "@backstage/core-app-api": "^0.1.24",
diff --git a/plugins/jenkins/package.json b/plugins/jenkins/package.json
index e879d13a88..cc23fe1265 100644
--- a/plugins/jenkins/package.json
+++ b/plugins/jenkins/package.json
@@ -41,12 +41,13 @@
     "@material-ui/icons": "^4.9.1",
     "@material-ui/lab": "4.0.0-alpha.57",
     "luxon": "^2.0.2",
-    "react": "^16.13.1",
-    "react-dom": "^16.13.1",
     "react-router": "6.0.0-beta.0",
     "react-router-dom": "6.0.0-beta.0",
     "react-use": "^17.2.4"
   },
+  "peerDependencies": {
+    "react": "^16.13.1 || ^17.0.0"
+  },
   "devDependencies": {
     "@backstage/cli": "^0.10.0",
     "@backstage/core-app-api": "^0.1.24",
diff --git a/plugins/kafka/package.json b/plugins/kafka/package.json
index 41d677aece..0e0bff24dc 100644
--- a/plugins/kafka/package.json
+++ b/plugins/kafka/package.json
@@ -29,11 +29,12 @@
     "@material-ui/core": "^4.12.2",
     "@material-ui/icons": "^4.9.1",
     "@material-ui/lab": "4.0.0-alpha.57",
-    "react": "^16.13.1",
-    "react-dom": "^16.13.1",
     "react-router": "6.0.0-beta.0",
     "react-use": "^17.2.4"
   },
+  "peerDependencies": {
+    "react": "^16.13.1 || ^17.0.0"
+  },
   "devDependencies": {
     "@backstage/cli": "^0.10.0",
     "@backstage/core-app-api": "^0.1.24",
diff --git a/plugins/kubernetes/package.json b/plugins/kubernetes/package.json
index 5e7a5bdf8d..1997da237a 100644
--- a/plugins/kubernetes/package.json
+++ b/plugins/kubernetes/package.json
@@ -46,11 +46,12 @@
     "js-yaml": "^4.0.0",
     "lodash": "^4.17.21",
     "luxon": "^2.0.2",
-    "react": "^16.13.1",
-    "react-dom": "^16.13.1",
     "react-router-dom": "6.0.0-beta.0",
     "react-use": "^17.2.4"
   },
+  "peerDependencies": {
+    "react": "^16.13.1 || ^17.0.0"
+  },
   "devDependencies": {
     "@backstage/cli": "^0.10.0",
     "@backstage/core-app-api": "^0.1.24",
diff --git a/plugins/lighthouse/package.json b/plugins/lighthouse/package.json
index cbd5db27b4..9942747d64 100644
--- a/plugins/lighthouse/package.json
+++ b/plugins/lighthouse/package.json
@@ -41,11 +41,12 @@
     "@material-ui/core": "^4.12.2",
     "@material-ui/icons": "^4.9.1",
     "@material-ui/lab": "4.0.0-alpha.57",
-    "react": "^16.13.1",
-    "react-dom": "^16.13.1",
     "react-router-dom": "6.0.0-beta.0",
     "react-use": "^17.2.4"
   },
+  "peerDependencies": {
+    "react": "^16.13.1 || ^17.0.0"
+  },
   "devDependencies": {
     "@backstage/cli": "^0.10.0",
     "@backstage/core-app-api": "^0.1.24",
@@ -57,7 +58,7 @@
     "@testing-library/user-event": "^13.1.8",
     "@types/jest": "^26.0.7",
     "@types/node": "^14.14.32",
-    "@types/react": "*",
+    "@types/react": "^16.13.1 || ^17.0.0",
     "cross-fetch": "^3.0.6",
     "msw": "^0.35.0"
   },
diff --git a/plugins/newrelic/package.json b/plugins/newrelic/package.json
index 6676547a85..b064e94bcc 100644
--- a/plugins/newrelic/package.json
+++ b/plugins/newrelic/package.json
@@ -38,10 +38,11 @@
     "@material-ui/core": "^4.12.2",
     "@material-ui/icons": "^4.9.1",
     "@material-ui/lab": "4.0.0-alpha.57",
-    "react": "^16.13.1",
-    "react-dom": "^16.13.1",
     "react-use": "^17.2.4"
   },
+  "peerDependencies": {
+    "react": "^16.13.1 || ^17.0.0"
+  },
   "devDependencies": {
     "@backstage/cli": "^0.10.0",
     "@backstage/core-app-api": "^0.1.24",
diff --git a/plugins/org/package.json b/plugins/org/package.json
index 2adb6c5d18..2e324513ef 100644
--- a/plugins/org/package.json
+++ b/plugins/org/package.json
@@ -30,12 +30,13 @@
     "@material-ui/icons": "^4.9.1",
     "@material-ui/lab": "4.0.0-alpha.57",
     "qs": "^6.10.1",
-    "react": "^16.13.1",
-    "react-dom": "^16.13.1",
     "react-router": "6.0.0-beta.0",
     "react-router-dom": "6.0.0-beta.0",
     "react-use": "^17.2.4"
   },
+  "peerDependencies": {
+    "react": "^16.13.1 || ^17.0.0"
+  },
   "devDependencies": {
     "@backstage/cli": "^0.10.0",
     "@backstage/core-app-api": "^0.1.24",
diff --git a/plugins/pagerduty/package.json b/plugins/pagerduty/package.json
index 13cb8854ae..632875a043 100644
--- a/plugins/pagerduty/package.json
+++ b/plugins/pagerduty/package.json
@@ -39,14 +39,15 @@
     "@material-ui/core": "^4.12.2",
     "@material-ui/icons": "^4.9.1",
     "@material-ui/lab": "4.0.0-alpha.57",
-    "@types/react": "*",
     "classnames": "^2.2.6",
     "luxon": "2.0.2",
-    "react": "^16.13.1",
-    "react-dom": "^16.13.1",
     "react-router-dom": "6.0.0-beta.0",
     "react-use": "^17.2.4"
   },
+  "peerDependencies": {
+    "@types/react": "^16.13.1 || ^17.0.0",
+    "react": "^16.13.1 || ^17.0.0"
+  },
   "devDependencies": {
     "@backstage/cli": "^0.10.0",
     "@backstage/core-app-api": "^0.1.24",
diff --git a/plugins/permission-react/package.json b/plugins/permission-react/package.json
index 26c5f71da0..4055e5f2ae 100644
--- a/plugins/permission-react/package.json
+++ b/plugins/permission-react/package.json
@@ -30,12 +30,14 @@
     "@backstage/config": "^0.1.11",
     "@backstage/core-plugin-api": "^0.2.2",
     "@backstage/plugin-permission-common": "^0.2.0",
-    "@types/react": "*",
     "cross-fetch": "^3.0.6",
-    "react": "^16.13.1",
     "react-router": "6.0.0-beta.0",
     "react-use": "^17.2.4"
   },
+  "peerDependencies": {
+    "@types/react": "^16.13.1 || ^17.0.0",
+    "react": "^16.13.1 || ^17.0.0"
+  },
   "devDependencies": {
     "@backstage/cli": "^0.10.0",
     "@backstage/test-utils": "^0.1.22",
diff --git a/plugins/rollbar/package.json b/plugins/rollbar/package.json
index d71c5e1cfe..4d265b05b3 100644
--- a/plugins/rollbar/package.json
+++ b/plugins/rollbar/package.json
@@ -41,13 +41,14 @@
     "@material-ui/icons": "^4.9.1",
     "@material-ui/lab": "4.0.0-alpha.57",
     "lodash": "^4.17.21",
-    "react": "^16.13.1",
-    "react-dom": "^16.13.1",
     "react-router": "6.0.0-beta.0",
     "react-router-dom": "6.0.0-beta.0",
     "react-sparklines": "^1.7.0",
     "react-use": "^17.2.4"
   },
+  "peerDependencies": {
+    "react": "^16.13.1 || ^17.0.0"
+  },
   "devDependencies": {
     "@backstage/cli": "^0.10.0",
     "@backstage/core-app-api": "^0.1.24",
@@ -59,7 +60,7 @@
     "@testing-library/user-event": "^13.1.8",
     "@types/jest": "^26.0.7",
     "@types/node": "^14.14.32",
-    "@types/react": "*",
+    "@types/react": "^16.13.1 || ^17.0.0",
     "cross-fetch": "^3.0.6",
     "msw": "^0.35.0"
   },
diff --git a/plugins/scaffolder/package.json b/plugins/scaffolder/package.json
index 404bfcd387..35b14dffa1 100644
--- a/plugins/scaffolder/package.json
+++ b/plugins/scaffolder/package.json
@@ -47,7 +47,6 @@
     "@material-ui/lab": "4.0.0-alpha.57",
     "@rjsf/core": "^3.2.1",
     "@rjsf/material-ui": "^3.2.1",
-    "@types/react": "*",
     "classnames": "^2.2.6",
     "git-url-parse": "^11.6.0",
     "humanize-duration": "^3.25.1",
@@ -56,8 +55,6 @@
     "lodash": "^4.17.21",
     "luxon": "^2.0.2",
     "qs": "^6.9.4",
-    "react": "^16.13.1",
-    "react-dom": "^16.13.1",
     "react-lazylog": "^4.5.2",
     "react-router": "6.0.0-beta.0",
     "react-router-dom": "6.0.0-beta.0",
@@ -65,6 +62,10 @@
     "use-immer": "^0.6.0",
     "zen-observable": "^0.8.15"
   },
+  "peerDependencies": {
+    "@types/react": "^16.13.1 || ^17.0.0",
+    "react": "^16.13.1 || ^17.0.0"
+  },
   "devDependencies": {
     "@backstage/cli": "^0.10.0",
     "@backstage/core-app-api": "^0.1.24",
diff --git a/plugins/scaffolder/src/components/TemplatePage/TemplatePage.test.tsx b/plugins/scaffolder/src/components/TemplatePage/TemplatePage.test.tsx
index 60e9ee8840..7ca65fff25 100644
--- a/plugins/scaffolder/src/components/TemplatePage/TemplatePage.test.tsx
+++ b/plugins/scaffolder/src/components/TemplatePage/TemplatePage.test.tsx
@@ -20,9 +20,8 @@ import {
 } from '@backstage/test-utils';
 import { lightTheme } from '@backstage/theme';
 import { ThemeProvider } from '@material-ui/core';
-import { fireEvent, within } from '@testing-library/react';
+import { act, fireEvent, within } from '@testing-library/react';
 import React from 'react';
-import { act } from 'react-dom/test-utils';
 import { MemoryRouter, Route } from 'react-router';
 import { ScaffolderApi, scaffolderApiRef } from '../../api';
 import { rootRouteRef } from '../../routes';
diff --git a/plugins/search/package.json b/plugins/search/package.json
index 1804a7aca8..e301a2e452 100644
--- a/plugins/search/package.json
+++ b/plugins/search/package.json
@@ -42,14 +42,15 @@
     "@material-ui/core": "^4.12.2",
     "@material-ui/icons": "^4.9.1",
     "@material-ui/lab": "4.0.0-alpha.57",
-    "@types/react": "*",
     "qs": "^6.9.4",
-    "react": "^16.13.1",
-    "react-dom": "^16.13.1",
     "react-router": "6.0.0-beta.0",
     "react-router-dom": "6.0.0-beta.0",
     "react-use": "^17.2.4"
   },
+  "peerDependencies": {
+    "@types/react": "^16.13.1 || ^17.0.0",
+    "react": "^16.13.1 || ^17.0.0"
+  },
   "devDependencies": {
     "@backstage/cli": "^0.10.0",
     "@backstage/core-app-api": "^0.1.24",
diff --git a/plugins/search/src/components/util.test.tsx b/plugins/search/src/components/util.test.tsx
index a5b82370e3..1b452a205e 100644
--- a/plugins/search/src/components/util.test.tsx
+++ b/plugins/search/src/components/util.test.tsx
@@ -16,11 +16,10 @@
 
 import React from 'react';
 import { wrapInTestApp } from '@backstage/test-utils';
-import { render } from '@testing-library/react';
+import { act, render } from '@testing-library/react';
 import { useNavigateToQuery } from './util';
 import { Routes, Route } from 'react-router-dom';
 import { rootRouteRef } from '../plugin';
-import { act } from 'react-dom/test-utils';
 
 const navigate = jest.fn();
 jest.mock('react-router-dom', () => ({
diff --git a/plugins/sentry/package.json b/plugins/sentry/package.json
index bb99225479..a82cb205b6 100644
--- a/plugins/sentry/package.json
+++ b/plugins/sentry/package.json
@@ -41,12 +41,13 @@
     "@material-ui/icons": "^4.9.1",
     "@material-ui/lab": "4.0.0-alpha.57",
     "luxon": "^2.0.2",
-    "react": "^16.13.1",
-    "react-dom": "^16.13.1",
     "react-router": "6.0.0-beta.0",
     "react-sparklines": "^1.7.0",
     "react-use": "^17.2.4"
   },
+  "peerDependencies": {
+    "react": "^16.13.1 || ^17.0.0"
+  },
   "devDependencies": {
     "@backstage/cli": "^0.10.0",
     "@backstage/core-app-api": "^0.1.24",
@@ -58,7 +59,7 @@
     "@types/jest": "^26.0.7",
     "@types/luxon": "^2.0.4",
     "@types/node": "^14.14.32",
-    "@types/react": "*",
+    "@types/react": "^16.13.1 || ^17.0.0",
     "cross-fetch": "^3.0.6",
     "msw": "^0.35.0"
   },
diff --git a/plugins/shortcuts/package.json b/plugins/shortcuts/package.json
index f1f41854ef..352cae13be 100644
--- a/plugins/shortcuts/package.json
+++ b/plugins/shortcuts/package.json
@@ -29,14 +29,15 @@
     "@material-ui/icons": "^4.9.1",
     "@material-ui/lab": "4.0.0-alpha.57",
     "@types/zen-observable": "^0.8.2",
-    "react": "^16.13.1",
-    "react-dom": "^16.13.1",
     "react-hook-form": "^7.12.2",
     "react-router": "6.0.0-beta.0",
     "react-use": "^17.2.4",
     "uuid": "^8.3.2",
     "zen-observable": "^0.8.15"
   },
+  "peerDependencies": {
+    "react": "^16.13.1 || ^17.0.0"
+  },
   "devDependencies": {
     "@backstage/cli": "^0.10.0",
     "@backstage/core-app-api": "^0.1.24",
diff --git a/plugins/sonarqube/package.json b/plugins/sonarqube/package.json
index 36c903701f..34d206846f 100644
--- a/plugins/sonarqube/package.json
+++ b/plugins/sonarqube/package.json
@@ -44,10 +44,11 @@
     "@material-ui/styles": "^4.10.0",
     "cross-fetch": "^3.0.6",
     "rc-progress": "^3.0.0",
-    "react": "^16.13.1",
-    "react-dom": "^16.13.1",
     "react-use": "^17.2.4"
   },
+  "peerDependencies": {
+    "react": "^16.13.1 || ^17.0.0"
+  },
   "devDependencies": {
     "@backstage/cli": "^0.10.0",
     "@backstage/core-app-api": "^0.1.24",
diff --git a/plugins/splunk-on-call/package.json b/plugins/splunk-on-call/package.json
index 28ce356d9c..757f8d6dc9 100644
--- a/plugins/splunk-on-call/package.json
+++ b/plugins/splunk-on-call/package.json
@@ -41,11 +41,12 @@
     "@material-ui/lab": "4.0.0-alpha.57",
     "classnames": "^2.2.6",
     "luxon": "^2.0.2",
-    "react": "^16.13.1",
-    "react-dom": "^16.13.1",
     "react-router-dom": "6.0.0-beta.0",
     "react-use": "^17.2.4"
   },
+  "peerDependencies": {
+    "react": "^16.13.1 || ^17.0.0"
+  },
   "devDependencies": {
     "@backstage/cli": "^0.10.0",
     "@backstage/core-app-api": "^0.1.24",
diff --git a/plugins/tech-insights/package.json b/plugins/tech-insights/package.json
index a55a0ce904..a5d8f87232 100644
--- a/plugins/tech-insights/package.json
+++ b/plugins/tech-insights/package.json
@@ -26,8 +26,6 @@
     "@material-ui/core": "^4.12.2",
     "@material-ui/icons": "^4.9.1",
     "@material-ui/lab": "4.0.0-alpha.57",
-    "react": "^16.13.1",
-    "react-dom": "^16.13.1",
     "react-use": "^17.2.4",
     "react-router-dom": "6.0.0-beta.0",
     "@backstage/plugin-catalog-react": "^0.6.4",
@@ -36,6 +34,9 @@
     "@backstage/errors": "^0.1.4",
     "@backstage/types": "^0.1.1"
   },
+  "peerDependencies": {
+    "react": "^16.13.1 || ^17.0.0"
+  },
   "devDependencies": {
     "@backstage/cli": "^0.10.0",
     "@backstage/core-app-api": "^0.1.24",
diff --git a/plugins/tech-radar/package.json b/plugins/tech-radar/package.json
index d377318e4b..6746e2188d 100644
--- a/plugins/tech-radar/package.json
+++ b/plugins/tech-radar/package.json
@@ -40,10 +40,11 @@
     "color": "^4.0.1",
     "d3-force": "^2.0.1",
     "prop-types": "^15.7.2",
-    "react": "^16.13.1",
-    "react-dom": "^16.13.1",
     "react-use": "^17.2.4"
   },
+  "peerDependencies": {
+    "react": "^16.13.1 || ^17.0.0"
+  },
   "devDependencies": {
     "@backstage/cli": "^0.10.0",
     "@backstage/core-app-api": "^0.1.24",
@@ -56,7 +57,7 @@
     "@types/d3-force": "^2.1.1",
     "@types/jest": "^26.0.7",
     "@types/node": "^14.14.32",
-    "@types/react": "*",
+    "@types/react": "^16.13.1 || ^17.0.0",
     "cross-fetch": "^3.0.6",
     "msw": "^0.35.0"
   },
diff --git a/plugins/tech-radar/src/components/RadarComponent.test.tsx b/plugins/tech-radar/src/components/RadarComponent.test.tsx
index 2b237c8d83..aeced1a2da 100644
--- a/plugins/tech-radar/src/components/RadarComponent.test.tsx
+++ b/plugins/tech-radar/src/components/RadarComponent.test.tsx
@@ -15,10 +15,9 @@
  */
 
 import React from 'react';
-import { render, waitForElement } from '@testing-library/react';
+import { act, render, waitForElement } from '@testing-library/react';
 import { ThemeProvider } from '@material-ui/core';
 import { lightTheme } from '@backstage/theme';
-import { act } from 'react-dom/test-utils';
 import { TestApiProvider, withLogCollector } from '@backstage/test-utils';
 
 import GetBBoxPolyfill from '../utils/polyfills/getBBox';
diff --git a/plugins/tech-radar/src/components/RadarPage.test.tsx b/plugins/tech-radar/src/components/RadarPage.test.tsx
index 7f4e69e388..e9bcb3d314 100644
--- a/plugins/tech-radar/src/components/RadarPage.test.tsx
+++ b/plugins/tech-radar/src/components/RadarPage.test.tsx
@@ -22,9 +22,8 @@ import {
 } from '@backstage/test-utils';
 import { lightTheme } from '@backstage/theme';
 import { ThemeProvider } from '@material-ui/core';
-import { render, waitForElement } from '@testing-library/react';
+import { act, render, waitForElement } from '@testing-library/react';
 import React from 'react';
-import { act } from 'react-dom/test-utils';
 import GetBBoxPolyfill from '../utils/polyfills/getBBox';
 import { RadarPage } from './RadarPage';
 import { TechRadarLoaderResponse, techRadarApiRef, TechRadarApi } from '../api';
diff --git a/plugins/techdocs/package.json b/plugins/techdocs/package.json
index c65fba7210..b048761e1c 100644
--- a/plugins/techdocs/package.json
+++ b/plugins/techdocs/package.json
@@ -47,19 +47,21 @@
     "@material-ui/icons": "^4.9.1",
     "@material-ui/lab": "4.0.0-alpha.57",
     "@material-ui/styles": "^4.10.0",
-    "@types/react": "*",
     "dompurify": "^2.2.9",
     "event-source-polyfill": "^1.0.25",
     "git-url-parse": "^11.6.0",
     "lodash": "^4.17.21",
-    "react": "^16.13.1",
-    "react-dom": "^16.13.1",
     "react-lazylog": "^4.5.2",
     "react-router": "6.0.0-beta.0",
     "react-router-dom": "6.0.0-beta.0",
     "react-text-truncate": "^0.16.0",
     "react-use": "^17.2.4"
   },
+  "peerDependencies": {
+    "@types/react": "^16.13.1 || ^17.0.0",
+    "react": "^16.13.1 || ^17.0.0",
+    "react-dom": "^16.13.1 || ^17.0.0"
+  },
   "devDependencies": {
     "@backstage/cli": "^0.10.0",
     "@backstage/core-app-api": "^0.1.24",
diff --git a/plugins/todo/package.json b/plugins/todo/package.json
index 1fadc213af..ad00f6dee5 100644
--- a/plugins/todo/package.json
+++ b/plugins/todo/package.json
@@ -36,10 +36,11 @@
     "@material-ui/core": "^4.12.2",
     "@material-ui/icons": "^4.9.1",
     "@material-ui/lab": "4.0.0-alpha.57",
-    "react": "^16.13.1",
-    "react-dom": "^16.13.1",
     "react-use": "^17.2.4"
   },
+  "peerDependencies": {
+    "react": "^16.13.1 || ^17.0.0"
+  },
   "devDependencies": {
     "@backstage/cli": "^0.10.0",
     "@backstage/core-app-api": "^0.1.24",
diff --git a/plugins/user-settings/package.json b/plugins/user-settings/package.json
index feab9dcf93..ba1d464453 100644
--- a/plugins/user-settings/package.json
+++ b/plugins/user-settings/package.json
@@ -37,11 +37,12 @@
     "@material-ui/core": "^4.12.2",
     "@material-ui/icons": "^4.9.1",
     "@material-ui/lab": "4.0.0-alpha.57",
-    "react": "^16.13.1",
-    "react-dom": "^16.13.1",
     "react-router": "6.0.0-beta.0",
     "react-use": "^17.2.4"
   },
+  "peerDependencies": {
+    "react": "^16.13.1 || ^17.0.0"
+  },
   "devDependencies": {
     "@backstage/cli": "^0.10.0",
     "@backstage/core-app-api": "^0.1.24",
diff --git a/plugins/xcmetrics/package.json b/plugins/xcmetrics/package.json
index aa2f6169e3..7a7113a984 100644
--- a/plugins/xcmetrics/package.json
+++ b/plugins/xcmetrics/package.json
@@ -30,11 +30,12 @@
     "@material-ui/lab": "4.0.0-alpha.57",
     "lodash": "^4.17.21",
     "luxon": "^2.0.2",
-    "react": "^16.13.1",
-    "react-dom": "^16.13.1",
     "react-use": "^17.2.4",
     "recharts": "^1.8.5"
   },
+  "peerDependencies": {
+    "react": "^16.13.1 || ^17.0.0"
+  },
   "devDependencies": {
     "@backstage/cli": "^0.10.0",
     "@backstage/core-app-api": "^0.1.24",
diff --git a/scripts/check-type-dependencies.js b/scripts/check-type-dependencies.js
index bb5f3b0967..4db1109145 100755
--- a/scripts/check-type-dependencies.js
+++ b/scripts/check-type-dependencies.js
@@ -143,7 +143,10 @@ function findTypesPackage(dep, pkg) {
  */
 function findTypeDepErrors(typeDeps, pkg) {
   const devDeps = mkTypeDepSet(pkg.get('devDependencies'));
-  const deps = mkTypeDepSet(pkg.get('dependencies'));
+  const deps = mkTypeDepSet({
+    ...pkg.get('dependencies'),
+    ...pkg.get('peerDependencies'),
+  });
 
   const errors = [];
   for (const typeDep of typeDeps) {
diff --git a/yarn.lock b/yarn.lock
index 35059f4b70..a71567ffe8 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -8096,7 +8096,7 @@
   dependencies:
     "@types/react" "*"
 
-"@types/react@*", "@types/react@>=16.9.0":
+"@types/react@*", "@types/react@>=16.9.0", "@types/react@^16.13.1 || ^17.0.0":
   version "16.14.18"
   resolved "https://registry.npmjs.org/@types/react/-/react-16.14.18.tgz#b2bcea05ee244fde92d409f91bd888ca8e54b20f"
   integrity sha512-eeyqd1mqoG43mI0TvNKy9QNf1Tjz3DEOsRP3rlPo35OeMIt05I+v9RR8ZvL2GuYZeF2WAcLXJZMzu6zdz3VbtQ==
@@ -24819,7 +24819,7 @@ react-virtualized@^9.21.0:
     prop-types "^15.6.0"
     react-lifecycles-compat "^3.0.4"
 
-react@^16.0.0, react@^16.12.0, react@^16.13.1:
+react@^16.12.0, react@^16.13.1:
   version "16.13.1"
   resolved "https://registry.npmjs.org/react/-/react-16.13.1.tgz#2e818822f1a9743122c063d6410d85c1e3afe48e"
   integrity sha512-YMZQQq32xHLX0bz5Mnibv1/LHb3Sqzngu7xstSM+vrkE5Kzr9xE0yMByK5kMoTK30YVJE61WfbxIFFvfeDKT1w==