Merge pull request #9037 from backstage/rugvip/react17

Upgrade to React 17

packages/app/package.json

@@ -60,8 +60,8 @@
     "@roadiehq/backstage-plugin-buildkite": "^1.3.4",
     "history": "^5.0.0",
     "prop-types": "^15.7.2",
-    "react": "^16.13.1",
-    "react-dom": "^16.13.1",
+    "react": "^17.0.2",
+    "react-dom": "^17.0.2",
     "react-hot-loader": "^4.12.21",
     "react-router": "6.0.0-beta.0",
     "react-router-dom": "6.0.0-beta.0",

packages/cli/src/lib/bundler/config.ts

@@ -173,6 +173,18 @@ export async function createConfig(
     }),
   );
 
+  const resolveAliases: Record<string, string> = {};
+  try {
+    // eslint-disable-next-line import/no-extraneous-dependencies
+    const { version: reactDomVersion } = require('react-dom/package.json');
+    // Only apply the alias for hook support if we're running with React 16
+    if (reactDomVersion.startsWith('16.')) {
+      resolveAliases['react-dom'] = '@hot-loader/react-dom';
+    }
+  } catch (error) {
+    console.warn(`WARNING: Failed to read react-dom version, ${error}`);
+  }
+
   return {
     mode: isDev ? 'development' : 'production',
     profile: false,
@@ -211,9 +223,7 @@ export async function createConfig(
           [paths.targetPackageJson],
         ),
       ],
-      alias: {
-        'react-dom': '@hot-loader/react-dom',
-      },
+      alias: resolveAliases,
     },
     module: {
       rules: loaders,

packages/create-app/templates/default-app/packages/app/package.json.hbs

@@ -26,8 +26,8 @@
     "@material-ui/core": "^4.12.2",
     "@material-ui/icons": "^4.9.1",
     "history": "^5.0.0",
-    "react": "^16.13.1",
-    "react-dom": "^16.13.1",
+    "react": "^17.0.2",
+    "react-dom": "^17.0.2",
     "react-router": "6.0.0-beta.0",
     "react-router-dom": "6.0.0-beta.0",
     "react-use": "^15.3.3"

packages/embedded-techdocs-app/package.json

@@ -19,8 +19,8 @@
     "@material-ui/core": "^4.11.0",
     "@material-ui/icons": "^4.9.1",
     "history": "^5.0.0",
-    "react": "^16.13.1",
-    "react-dom": "^16.13.1",
+    "react": "^17.0.2",
+    "react-dom": "^17.0.2",
     "react-router": "6.0.0-beta.0",
     "react-router-dom": "6.0.0-beta.0",
     "react-use": "^17.2.4"

packages/storybook/package.json

@@ -12,8 +12,8 @@
     "@backstage/test-utils": "^0.2.3-next.0",
     "@backstage/core-app-api": "^0.5.0-next.0",
     "@backstage/core-plugin-api": "^0.6.0-next.0",
-    "react": "^16.13.1",
-    "react-dom": "^16.13.1"
+    "react": "^17.0.2",
+    "react-dom": "^17.0.2"
   },
   "devDependencies": {
     "@storybook/addon-a11y": "^6.3.4",