detect local components before setting alias

Author: mungodewar

packages/react-scripts/backpack-addons/ssr/isLocalComponents.js

@@ -0,0 +1,17 @@
+'use strict';
+
+const paths = require('../../config/paths');
+
+/**
+ * Checking for loadable install, as there is need to set aliases when this is the case
+ */
+const isLocalComponents = () => {
+  // Ensure `ssrEnabled` is on
+  const appPackageJson = require(paths.appPackageJson);
+  const isLocalComponentsInstalled =
+    appPackageJson['@skyscanner-internal/local-components'] || {};
+
+  return isLocalComponentsInstalled;
+};
+
+module.exports = isLocalComponents;

packages/react-scripts/config/webpack.config.ssr.js

@@ -34,6 +34,7 @@ const ReactRefreshWebpackPlugin = require('@pmmmwh/react-refresh-webpack-plugin'
 const createEnvironmentHash = require('./webpack/persistentCache/createEnvironmentHash');
 
 const isSsr = require('../backpack-addons/ssr/isSsr'); // #backpack-addons ssr
+const isLoadable = require('../backpack-addons/ssr/isLocalComponents'); // #backpack-addons ssr
 
 // Just for the case that `ssr.js` exists in `src` folder but not in SSR mode
 const needBuildSsr = !isSsr() && fs.existsSync(paths.appSsrJs);
@@ -351,7 +352,9 @@ module.exports = function (webpackEnv) {
         .map(ext => `.${ext}`)
         .filter(ext => useTypeScript || !ext.includes('ts')),
       alias: {
-        '@loadable/component': require.resolve('@loadable/component'),
+        ...(isLoadable()
+          ? { '@loadable/component': require.resolve('@loadable/component') }
+          : {}),
         // Support React Native Web
         // https://www.smashingmagazine.com/2016/08/a-glimpse-into-the-future-with-react-native-for-web/
         'react-native': 'react-native-web',