@salesforce/pwa-kit-dev 3.8.0-preview.0-basepath → 3.8.0-preview.1-basepath

package/configs/webpack/config.js

@@ -0,0 +1,406 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.EXT_OVERRIDES_DIR_NO_SLASH = exports.EXT_OVERRIDES_DIR = exports.EXT_EXTENDS_WIN = exports.EXT_EXTENDS = exports.EXT_EXTENDABLE = exports.DEPS_TO_DEDUPE = void 0;
+var _path = _interopRequireWildcard(require("path"));
+var _fsExtra = _interopRequireDefault(require("fs-extra"));
+var _webpack = _interopRequireDefault(require("webpack"));
+var _webpackNotifier = _interopRequireDefault(require("webpack-notifier"));
+var _copyWebpackPlugin = _interopRequireDefault(require("copy-webpack-plugin"));
+var _webpackBundleAnalyzer = require("webpack-bundle-analyzer");
+var _webpackPlugin = _interopRequireDefault(require("@loadable/webpack-plugin"));
+var _reactRefreshWebpackPlugin = _interopRequireDefault(require("@pmmmwh/react-refresh-webpack-plugin"));
+var _speedMeasureWebpackPlugin = _interopRequireDefault(require("speed-measure-webpack-plugin"));
+var _ssrPaths = require("@salesforce/pwa-kit-runtime/utils/ssr-paths");
+var _overridesPlugin = _interopRequireDefault(require("./overrides-plugin"));
+var _plugins = require("./plugins");
+var _configNames = require("./config-names");
+var _pkg$ccExtensibility, _pkg$ccExtensibility2, _pkg$ccExtensibility3, _pkg$ccExtensibility4, _pkg$ccExtensibility5, _pkg$ccExtensibility6, _pkg$ccExtensibility7, _pkg$ccExtensibility8, _pkg$ccExtensibility9, _pkg$ccExtensibility10, _pkg$ccExtensibility11, _pkg$ccExtensibility12;
+/*
+ * Copyright (c) 2021, salesforce.com, inc.
+ * All rights reserved.
+ * SPDX-License-Identifier: BSD-3-Clause
+ * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/BSD-3-Clause
+ */
+/* eslint-env node */
+// For more information on these settings, see https://webpack.js.org/configuration
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
+function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+const projectDir = process.cwd();
+const pkg = _fsExtra.default.readJsonSync((0, _path.resolve)(projectDir, 'package.json'));
+const buildDir = process.env.PWA_KIT_BUILD_DIR ? (0, _path.resolve)(process.env.PWA_KIT_BUILD_DIR) : (0, _path.resolve)(projectDir, 'build');
+const production = 'production';
+const development = 'development';
+const analyzeBundle = process.env.MOBIFY_ANALYZE === 'true';
+const mode = process.env.NODE_ENV === production ? production : development;
+const INSPECT = process.execArgv.some(arg => /^--inspect(?:-brk)?(?:$|=)/.test(arg));
+const DEBUG = mode !== production && process.env.DEBUG === 'true';
+const CI = process.env.CI;
+const disableHMR = process.env.HMR === 'false';
+if ([production, development].indexOf(mode) < 0) {
+  throw new Error(`Invalid mode "${mode}"`);
+}
+
+// for API convenience, add the leading slash if missing
+const EXT_OVERRIDES_DIR = exports.EXT_OVERRIDES_DIR = typeof (pkg === null || pkg === void 0 ? void 0 : (_pkg$ccExtensibility = pkg.ccExtensibility) === null || _pkg$ccExtensibility === void 0 ? void 0 : _pkg$ccExtensibility.overridesDir) === 'string' && !(pkg !== null && pkg !== void 0 && (_pkg$ccExtensibility2 = pkg.ccExtensibility) !== null && _pkg$ccExtensibility2 !== void 0 && (_pkg$ccExtensibility3 = _pkg$ccExtensibility2.overridesDir) !== null && _pkg$ccExtensibility3 !== void 0 && _pkg$ccExtensibility3.match(/(^\/|^\\)/)) ? '/' + (pkg === null || pkg === void 0 ? void 0 : (_pkg$ccExtensibility4 = pkg.ccExtensibility) === null || _pkg$ccExtensibility4 === void 0 ? void 0 : (_pkg$ccExtensibility5 = _pkg$ccExtensibility4.overridesDir) === null || _pkg$ccExtensibility5 === void 0 ? void 0 : _pkg$ccExtensibility5.replace(/\\/g, '/')) : pkg !== null && pkg !== void 0 && (_pkg$ccExtensibility6 = pkg.ccExtensibility) !== null && _pkg$ccExtensibility6 !== void 0 && _pkg$ccExtensibility6.overridesDir ? pkg === null || pkg === void 0 ? void 0 : (_pkg$ccExtensibility7 = pkg.ccExtensibility) === null || _pkg$ccExtensibility7 === void 0 ? void 0 : (_pkg$ccExtensibility8 = _pkg$ccExtensibility7.overridesDir) === null || _pkg$ccExtensibility8 === void 0 ? void 0 : _pkg$ccExtensibility8.replace(/\\/g, '/') : '';
+const EXT_OVERRIDES_DIR_NO_SLASH = exports.EXT_OVERRIDES_DIR_NO_SLASH = EXT_OVERRIDES_DIR === null || EXT_OVERRIDES_DIR === void 0 ? void 0 : EXT_OVERRIDES_DIR.replace(/^\//, '');
+const EXT_EXTENDS = exports.EXT_EXTENDS = pkg === null || pkg === void 0 ? void 0 : (_pkg$ccExtensibility9 = pkg.ccExtensibility) === null || _pkg$ccExtensibility9 === void 0 ? void 0 : _pkg$ccExtensibility9.extends;
+const EXT_EXTENDS_WIN = exports.EXT_EXTENDS_WIN = pkg === null || pkg === void 0 ? void 0 : (_pkg$ccExtensibility10 = pkg.ccExtensibility) === null || _pkg$ccExtensibility10 === void 0 ? void 0 : (_pkg$ccExtensibility11 = _pkg$ccExtensibility10.extends) === null || _pkg$ccExtensibility11 === void 0 ? void 0 : _pkg$ccExtensibility11.replace('/', '\\');
+const EXT_EXTENDABLE = exports.EXT_EXTENDABLE = pkg === null || pkg === void 0 ? void 0 : (_pkg$ccExtensibility12 = pkg.ccExtensibility) === null || _pkg$ccExtensibility12 === void 0 ? void 0 : _pkg$ccExtensibility12.extendable;
+
+// TODO: can these be handled in package.json as peerDependencies?
+// https://salesforce-internal.slack.com/archives/C0DKK1FJS/p1672939909212589
+
+// due to to how the sdks work and the potential of these npm deps coming
+// from multiple places, we need to force them to one place where they're found
+const DEPS_TO_DEDUPE = exports.DEPS_TO_DEDUPE = ['babel-runtime', '@tanstack/react-query', '@loadable/component', '@loadable/server', '@loadable/webpack-plugin', 'svg-sprite-loader', 'react', 'react-router-dom', 'react-dom', 'react-helmet', 'webpack-hot-middleware', 'react-intl', '@chakra-ui/icons', '@chakra-ui/react', '@chakra-ui/skip-nav', '@emotion/react'];
+if (EXT_EXTENDABLE && EXT_EXTENDS) {
+  const extendsAsArr = Array.isArray(EXT_EXTENDS) ? EXT_EXTENDS : [EXT_EXTENDS];
+  const conflicts = extendsAsArr.filter(x => EXT_EXTENDABLE === null || EXT_EXTENDABLE === void 0 ? void 0 : EXT_EXTENDABLE.includes(x));
+  if (conflicts !== null && conflicts !== void 0 && conflicts.length) {
+    throw new Error(`Dependencies in 'extendable' and 'extends' cannot overlap, fix these: ${conflicts.join(', ')}"`);
+  }
+}
+const getBundleAnalyzerPlugin = (name = 'report', pluginOptions) => new _webpackBundleAnalyzer.BundleAnalyzerPlugin(_objectSpread({
+  analyzerMode: 'static',
+  defaultSizes: 'gzip',
+  openAnalyzer: CI !== 'true',
+  generateStatsFile: true,
+  reportFilename: `${name}.html`,
+  reportTitle: `${name} bundle analysis result`,
+  statsFilename: `${name}-analyzer-stats.json`
+}, pluginOptions));
+const entryPointExists = segments => {
+  for (let ext of ['.js', '.jsx', '.ts', '.tsx']) {
+    const primary = (0, _path.resolve)(projectDir, ...segments) + ext;
+    const override = EXT_OVERRIDES_DIR ? (0, _path.resolve)(projectDir, EXT_OVERRIDES_DIR_NO_SLASH, ...segments) + ext : null;
+    if (_fsExtra.default.existsSync(primary) || override && _fsExtra.default.existsSync(override)) {
+      return true;
+    }
+  }
+  return false;
+};
+const getAppEntryPoint = () => {
+  return (0, _path.resolve)('./', EXT_OVERRIDES_DIR_NO_SLASH, 'app', 'main');
+};
+const findDepInStack = pkg => {
+  // Look for the SDK node_modules in two places because in CI,
+  // pwa-kit-dev is published under a 'dist' directory, which
+  // changes this file's location relative to the package root.
+  const candidates = [(0, _path.resolve)(projectDir, 'node_modules', pkg), (0, _path.resolve)(__dirname, '..', '..', 'node_modules', pkg), (0, _path.resolve)(__dirname, '..', '..', '..', 'node_modules', pkg)];
+  let candidate;
+  for (candidate of candidates) {
+    if (_fsExtra.default.existsSync(candidate)) {
+      return candidate;
+    }
+  }
+  return candidate;
+};
+const baseConfig = target => {
+  if (!['web', 'node'].includes(target)) {
+    throw Error(`The value "${target}" is not a supported webpack target`);
+  }
+  class Builder {
+    constructor() {
+      this.config = _objectSpread(_objectSpread({
+        watchOptions: {
+          aggregateTimeout: 1000
+        },
+        target,
+        mode
+      }, target === 'node' ? {
+        ignoreWarnings: [
+        // These can be ignored fairly safely for node targets, where
+        // bundle size is not super critical. Express generates this warning,
+        // because it uses dynamic require() calls, which cause Webpack to
+        // bundle the whole library.
+        /Critical dependency: the request of a dependency is an expression/]
+      } : {}), {}, {
+        infrastructureLogging: {
+          level: 'error'
+        },
+        stats: {
+          all: false,
+          modules: false,
+          errors: true,
+          warnings: true,
+          moduleTrace: true,
+          errorDetails: true,
+          colors: true,
+          assets: false,
+          excludeAssets: [/.*img\/.*/, /.*svg\/.*/, /.*json\/.*/, /.*static\/.*/]
+        },
+        optimization: {
+          minimize: mode === production
+        },
+        output: {
+          publicPath: '',
+          path: buildDir
+        },
+        resolve: _objectSpread(_objectSpread({}, EXT_EXTENDS && EXT_OVERRIDES_DIR ? {
+          plugins: [new _overridesPlugin.default({
+            extends: [EXT_EXTENDS],
+            overridesDir: EXT_OVERRIDES_DIR,
+            projectDir: process.cwd()
+          })]
+        } : {}), {}, {
+          extensions: ['.ts', '.tsx', '.js', '.jsx', '.json'],
+          alias: _objectSpread(_objectSpread(_objectSpread({}, _extends(...DEPS_TO_DEDUPE.map(dep => ({
+            [dep]: findDepInStack(dep)
+          })))), EXT_OVERRIDES_DIR && EXT_EXTENDS ? _extends(
+          // NOTE: when an array of `extends` dirs are accepted, don't coerce here
+          ...[EXT_EXTENDS].map(extendTarget => ({
+            [extendTarget]: _path.default.resolve(projectDir, 'node_modules', ...extendTarget.split('/'))
+          }))) : {}), EXT_EXTENDABLE ? _extends(...[EXT_EXTENDABLE].map(item => ({
+            [item]: _path.default.resolve(projectDir)
+          }))) : {})
+        }, target === 'web' ? {
+          fallback: {
+            crypto: false
+          }
+        } : {}),
+        plugins: [new _webpack.default.DefinePlugin({
+          DEBUG,
+          NODE_ENV: `'${process.env.NODE_ENV}'`,
+          WEBPACK_TARGET: `'${target}'`,
+          ['global.GENTLY']: false
+        }), mode === development && new _webpack.default.NoEmitOnErrorsPlugin(), (0, _plugins.sdkReplacementPlugin)(),
+        // Don't chunk if it's a node target – faster Lambda startup.
+        target === 'node' && new _webpack.default.optimize.LimitChunkCountPlugin({
+          maxChunks: 1
+        })].filter(Boolean),
+        module: {
+          rules: [ruleForBabelLoader(), target === 'node' && {
+            test: /\.svg$/,
+            loader: findDepInStack('svg-sprite-loader')
+          }, target === 'web' && {
+            test: /\.svg$/,
+            loader: findDepInStack('ignore-loader')
+          }, {
+            test: /\.html$/,
+            exclude: /node_modules/,
+            use: {
+              loader: findDepInStack('html-loader')
+            }
+          }, {
+            test: /\.js$/,
+            enforce: 'pre',
+            use: {
+              loader: findDepInStack('source-map-loader')
+            }
+          }].filter(Boolean)
+        }
+      });
+    }
+    extend(callback) {
+      this.config = callback(this.config);
+      return this;
+    }
+    build() {
+      // Clean up temporary properties, to be compatible with the config schema
+      this.config.module.rules.filter(rule => rule.id).forEach(rule => delete rule.id);
+      return this.config;
+    }
+  }
+  return new Builder();
+};
+const withChunking = config => {
+  return _objectSpread(_objectSpread({}, config), {}, {
+    output: _objectSpread(_objectSpread({}, config.output), {}, {
+      filename: '[name].js',
+      chunkFilename: '[name].js' // Support chunking with @loadable/components
+    }),
+    optimization: {
+      minimize: mode === production,
+      splitChunks: {
+        cacheGroups: {
+          vendor: {
+            // Three scenarios that we'd like to chunk vendor.js:
+            // 1. The package is in node_modules
+            // 2. The package is one of the monorepo packages.
+            //    This is for local development to ensure the bundle
+            //    composition is the same as a production build
+            // 3. If extending another template, don't include the
+            //    baseline route files in vendor.js
+            test: module => {
+              var _module$context, _module$context2, _module$context2$matc;
+              if (EXT_EXTENDS && EXT_OVERRIDES_DIR && module !== null && module !== void 0 && (_module$context = module.context) !== null && _module$context !== void 0 && _module$context.includes(`${_path.default.sep}${_path.default.sep === '/' ? EXT_EXTENDS : EXT_EXTENDS_WIN}${_path.default.sep}`)) {
+                return false;
+              }
+              return module === null || module === void 0 ? void 0 : (_module$context2 = module.context) === null || _module$context2 === void 0 ? void 0 : (_module$context2$matc = _module$context2.match) === null || _module$context2$matc === void 0 ? void 0 : _module$context2$matc.call(_module$context2, /(node_modules)|(packages\/(.*)dist)/);
+            },
+            name: 'vendor',
+            chunks: 'all'
+          }
+        }
+      }
+    }
+  });
+};
+const staticFolderCopyPlugin = new _copyWebpackPlugin.default({
+  patterns: [{
+    from: _path.default.resolve(`${EXT_OVERRIDES_DIR ? EXT_OVERRIDES_DIR_NO_SLASH + '/' : ''}app/static`).replace(/\\/g, '/'),
+    to: `static/`,
+    noErrorOnMissing: true
+  }]
+});
+const ruleForBabelLoader = babelPlugins => {
+  return _objectSpread(_objectSpread({
+    id: 'babel-loader',
+    test: /(\.js(x?)|\.ts(x?))$/
+  }, EXT_OVERRIDES_DIR && EXT_EXTENDS ?
+  // TODO: handle for array here when that's supported
+  {
+    exclude: new RegExp(`${_path.default.sep}node_modules(?!${_path.default.sep}${_path.default.sep === '/' ? EXT_EXTENDS : EXT_EXTENDS_WIN})`)
+  } : {
+    exclude: /node_modules/
+  }), {}, {
+    use: [{
+      loader: findDepInStack('babel-loader'),
+      options: _objectSpread({
+        rootMode: 'upward',
+        cacheDirectory: true
+      }, babelPlugins ? {
+        plugins: babelPlugins
+      } : {})
+    }]
+  });
+};
+const findAndReplace = (array = [], findFn = () => {}, replacement) => {
+  const clone = array.slice(0);
+  const index = clone.findIndex(findFn);
+  if (index === -1) {
+    return array;
+  }
+  clone.splice(index, 1, replacement);
+  return clone;
+};
+const enableReactRefresh = config => {
+  if (mode !== development || disableHMR) {
+    return config;
+  }
+  const newRule = ruleForBabelLoader([require.resolve('react-refresh/babel')]);
+  const rules = findAndReplace(config.module.rules, rule => rule.id === 'babel-loader', newRule);
+  const hmrBasePath = `${(0, _ssrPaths.getBundlePath)()}/development/`;
+  return _objectSpread(_objectSpread({}, config), {}, {
+    module: _objectSpread(_objectSpread({}, config.module), {}, {
+      rules
+    }),
+    entry: _objectSpread(_objectSpread({}, config.entry), {}, {
+      main: ['webpack-hot-middleware/client?path=/__mrt/hmr', getAppEntryPoint()]
+    }),
+    output: _objectSpread(_objectSpread({}, config.output), {}, {
+      publicPath: hmrBasePath
+    }),
+    plugins: [...config.plugins, new _webpack.default.HotModuleReplacementPlugin(), new _reactRefreshWebpackPlugin.default({
+      overlay: false
+    })]
+  });
+};
+const client = entryPointExists(['app', 'main']) && baseConfig('web').extend(withChunking).extend(config => {
+  return _objectSpread(_objectSpread({}, config), {}, {
+    // Must be named "client". See - https://www.npmjs.com/package/webpack-hot-server-middleware#usage
+    name: _configNames.CLIENT,
+    // use source map to make debugging easier
+    devtool: mode === development ? 'source-map' : false,
+    entry: {
+      main: getAppEntryPoint()
+    },
+    plugins: [...config.plugins, new _webpackPlugin.default({
+      writeToDisk: true
+    }), analyzeBundle && getBundleAnalyzerPlugin(_configNames.CLIENT)].filter(Boolean),
+    // Hide the performance hints, since we already have a similar `bundlesize` check in `template-retail-react-app` package
+    performance: {
+      hints: false
+    }
+  });
+}).extend(enableReactRefresh).build();
+const optional = (name, path) => {
+  return _fsExtra.default.existsSync(path) ? {
+    [name]: path
+  } : {};
+};
+const clientOptional = baseConfig('web').extend(config => {
+  return _objectSpread(_objectSpread({}, config), {}, {
+    name: _configNames.CLIENT_OPTIONAL,
+    entry: _objectSpread(_objectSpread(_objectSpread(_objectSpread({}, optional('loader', (0, _path.resolve)(projectDir, EXT_OVERRIDES_DIR, 'app', 'loader.js'))), optional('worker', (0, _path.resolve)(projectDir, 'worker', 'main.js'))), optional('core-polyfill', (0, _path.resolve)(projectDir, 'node_modules', 'core-js'))), optional('fetch-polyfill', (0, _path.resolve)(projectDir, 'node_modules', 'whatwg-fetch'))),
+    // use source map to make debugging easier
+    devtool: mode === development ? 'source-map' : false,
+    plugins: [...config.plugins, analyzeBundle && getBundleAnalyzerPlugin(_configNames.CLIENT_OPTIONAL)].filter(Boolean)
+  });
+}).build();
+const renderer = _fsExtra.default.existsSync((0, _path.resolve)(projectDir, 'node_modules', '@salesforce', 'pwa-kit-react-sdk')) && baseConfig('node').extend(config => {
+  return _objectSpread(_objectSpread({}, config), {}, {
+    // Must be named "server". See - https://www.npmjs.com/package/webpack-hot-server-middleware#usage
+    name: _configNames.SERVER,
+    entry: '@salesforce/pwa-kit-react-sdk/ssr/server/react-rendering.js',
+    // use eval-source-map for server-side debugging
+    devtool: mode === development && INSPECT ? 'eval-source-map' : false,
+    output: {
+      path: buildDir,
+      // We want to split the build on local development to reduce memory usage.
+      // It is required to have a single entry point for the remote server.
+      // See pwa-kit-runtime/ssr/server/build-remote-server.js render method.
+      filename: mode === development ? '[name]-server.js' : 'server-renderer.js',
+      libraryTarget: 'commonjs2'
+    },
+    plugins: [...config.plugins, staticFolderCopyPlugin,
+    // Keep this on the slowest-to-build item - the server-side bundle.
+    new _webpackNotifier.default({
+      title: `PWA Kit Project: ${pkg.name}`,
+      excludeWarnings: true,
+      skipFirstNotification: true
+    }), analyzeBundle && getBundleAnalyzerPlugin('server-renderer')].filter(Boolean)
+  });
+}).build();
+const ssr = (() => {
+  // Only compile the ssr file when we're building for prod.
+  if (mode === production) {
+    return baseConfig('node').extend(config => {
+      return _objectSpread(_objectSpread(_objectSpread({}, config), process.env.PWA_KIT_SSR_SOURCE_MAP === 'true' ? {
+        devtool: 'source-map'
+      } : {}), {}, {
+        // Must *not* be named "server". See - https://www.npmjs.com/package/webpack-hot-server-middleware#usage
+        name: _configNames.SSR,
+        entry: `.${EXT_OVERRIDES_DIR}/app/ssr.js`,
+        output: {
+          path: buildDir,
+          filename: 'ssr.js',
+          libraryTarget: 'commonjs2'
+        },
+        plugins: [...config.plugins, staticFolderCopyPlugin, analyzeBundle && getBundleAnalyzerPlugin(_configNames.SSR)].filter(Boolean)
+      });
+    }).build();
+  } else {
+    return undefined;
+  }
+})();
+const requestProcessor = entryPointExists(['app', 'request-processor']) && baseConfig('node').extend(config => {
+  return _objectSpread(_objectSpread({}, config), {}, {
+    name: _configNames.REQUEST_PROCESSOR,
+    // entry: './app/request-processor.js',
+    entry: `.${EXT_OVERRIDES_DIR}/app/request-processor.js`,
+    output: {
+      path: buildDir,
+      filename: 'request-processor.js',
+      libraryTarget: 'commonjs2'
+    },
+    // use eval-source-map for server-side debugging
+    devtool: mode === development && INSPECT ? 'eval-source-map' : false,
+    plugins: [...config.plugins, analyzeBundle && getBundleAnalyzerPlugin(_configNames.REQUEST_PROCESSOR)].filter(Boolean)
+  });
+}).build();
+module.exports = [client, ssr, renderer, clientOptional, requestProcessor].filter(Boolean).map(config => {
+  return new _speedMeasureWebpackPlugin.default({
+    disable: !process.env.MEASURE
+  }).wrap(config);
+});

package/configs/webpack/overrides-plugin.js

@@ -0,0 +1,168 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _path = _interopRequireDefault(require("path"));
+var _glob = _interopRequireDefault(require("glob"));
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+/*
+ * Copyright (c) 2023, Salesforce, Inc.
+ * All rights reserved.
+ * SPDX-License-Identifier: BSD-3-Clause
+ * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/BSD-3-Clause
+ */
+
+/**
+ * @class OverridesResolverPlugin
+ *
+ *  This plugin provides the "Overrides" behavior of the Template Extensibility feature,
+ *  allowing third party implementations that depend on an npm module for the base implementation
+ *  and then overriding only specific files
+ */
+class OverridesResolverPlugin {
+  /**
+   *
+   * @param options
+   * @param {string} options.overridesDir path to application base
+   * @param {string[]} options.overrides paths to overrides
+   * @param {string} options.projectDir path to project directory
+   */
+  constructor(options) {
+    var _options$overridesDir, _options$projectDir, _this$pkg, _this$pkg$ccExtensibi, _this$pkg$ccExtensibi2, _this$pkg$ccExtensibi3, _this$pkg2, _this$pkg2$ccExtensib;
+    // always coerce to posix fs paths, as glob sync and es6 imports don't use windows paths
+    this.overridesDir = ((_options$overridesDir = options.overridesDir) === null || _options$overridesDir === void 0 ? void 0 : _options$overridesDir.replace(/\\/g, '/')) || '';
+    this.extends = options.extends || [];
+    // always coerce to posix fs paths, as glob sync and es6 imports don't use windows paths
+    this.projectDir = (_options$projectDir = options.projectDir) === null || _options$projectDir === void 0 ? void 0 : _options$projectDir.replace(/\\/g, '/');
+    this._allSearchDirs = [this.projectDir + this.overridesDir, ...this.extends];
+    this.pkg = require(_path.default.resolve(this.projectDir, 'package.json'));
+    this.extendsHashMap = new Map();
+
+    // everything except directories
+    // NOTE that the glob library expects posix so we replace windows file paths here
+    const globPattern = `${(_this$pkg = this.pkg) === null || _this$pkg === void 0 ? void 0 : (_this$pkg$ccExtensibi = _this$pkg.ccExtensibility) === null || _this$pkg$ccExtensibi === void 0 ? void 0 : (_this$pkg$ccExtensibi2 = _this$pkg$ccExtensibi.overridesDir) === null || _this$pkg$ccExtensibi2 === void 0 ? void 0 : (_this$pkg$ccExtensibi3 = _this$pkg$ccExtensibi2.replace(/\\/g, '/')) === null || _this$pkg$ccExtensibi3 === void 0 ? void 0 : _this$pkg$ccExtensibi3.replace(/^\//, '')}/**/*.*`;
+    const overridesFsRead = _glob.default.sync(globPattern);
+    const overrideReplace = ((_this$pkg2 = this.pkg) === null || _this$pkg2 === void 0 ? void 0 : (_this$pkg2$ccExtensib = _this$pkg2.ccExtensibility) === null || _this$pkg2$ccExtensib === void 0 ? void 0 : _this$pkg2$ccExtensib.overridesDir) + '/';
+
+    // For each filepath in the overrides directory:
+    // Split it in one of two ways:
+    // If the filepath is like /pages/home/index.js,
+    //    split on index and 'key' is /pages/home/
+    // If the filepath is like /pages/home/data.js,
+    //    split on the . and 'key' is /pages/home/data
+    // The negative lookaheads ensure the split occurs on the last occurence of .
+    //    This avoids collisions when both index.js and index.test.js are
+    //    present in the same directory
+    overridesFsRead.forEach(item => {
+      const end = item.substring(item.lastIndexOf('/index'));
+      const [key, ...rest] = item.split(/(index(?!(\.[^.]*\.))|\.(?!([^.]*\.)))/);
+      this.extendsHashMap.set(key.replace(overrideReplace, '').replace(/\/$/, ''), [end, rest.filter(Boolean)]);
+    });
+  }
+  /**
+   * This takes an import with the overrides dir / extends package removed and finds
+   * the corresponding path from overridesFsRead
+   *
+   * Ie. Given an import @salesforce/retail-react-app/app/components/header,
+   * requestPath is app/components/header
+   *
+   * @param requestPath - relative import path
+   * @param dirs - this._allSearchDirs
+   */
+  findFileFromMap(requestPath, dirs) {
+    const fileExt = _path.default.extname(requestPath);
+    for (const dir of dirs) {
+      let base = _path.default.join(dir, requestPath);
+      if (fileExt) {
+        const noExtPath = requestPath.replace(fileExt, '');
+        if (this.extendsHashMap.has(noExtPath)) {
+          return base;
+        }
+      } else {
+        if (this.extendsHashMap.has(requestPath)) {
+          const end = this.extendsHashMap.get(requestPath)[1];
+          const isRequestingIndex = end[0] === 'index';
+          let result = (base === null || base === void 0 ? void 0 : base.replace(/$\//, '')) + end.join('');
+          if (isRequestingIndex) {
+            result = _path.default.join(base, this.extendsHashMap.get(requestPath)[1].join(''));
+          }
+          return result;
+        }
+      }
+    }
+  }
+
+  /*
+      Given an import request, this function removes the override dir
+      or the package name defined in extends.
+       For example:
+      import * from 'src/configs/webpack/test/overrides/path/data.js resolves to
+          path/data.js
+      import * from '@salesforce/retail-react-app/app/component/header resolves to
+          app/component/header
+       TODO: This function is only called if isFromExtends is true. In other words,
+      this function is only called if the import request contains a package in extends
+      We can probably simplify this function or rename it
+  */
+  toOverrideRelative(filepath) {
+    const override = this._allSearchDirs.find(dir => {
+      return filepath.indexOf(dir) === 0;
+    });
+    return filepath.substring((override === null || override === void 0 ? void 0 : override.length) + 1);
+  }
+
+  /*
+      Helper function that returns true only if the import request points to a package in 'extends'
+      and the issuer path (the file making the import request) is not located in the overrides dir.
+       If true, we re-route the import request to the overrides dir.
+      If false, the import request proceeds to the base package in node_modules
+       For example, given an import request to a package defined in 'extends'
+          (ie. @salesforce/retail-react-app):
+      This will return true if the issuer is a file in a base template
+      This will return false if the issuer is a file in the overrides dir
+       This allow the base template to import from overrides and allows the overrides to import from
+      the base template using the same syntax (ie. import from @salesforce/retail-react-app/...)
+  */
+  isFromExtends(request, filepath) {
+    var _this$extends, _this$extends$, _this$extends$$starts;
+    const pkgName = request.split(/(\/|\\)/).filter(item => !item.match(/(\/|\\)/)).slice(0, (_this$extends = this.extends) !== null && _this$extends !== void 0 && (_this$extends$ = _this$extends[0]) !== null && _this$extends$ !== void 0 && (_this$extends$$starts = _this$extends$.startsWith) !== null && _this$extends$$starts !== void 0 && _this$extends$$starts.call(_this$extends$, '@') ? 2 : 1).join('/');
+
+    // we split by path delimeters (OS agnostic), filter out
+    // separators, then spread both to form a normalized
+    // '/base', 'path', 'to', 'dir' when both halves are joined
+    const issuerPath = _path.default.join(...this.projectDir.split(_path.default.sep).filter(item => !item.match(/(\/|\\)/)), ...this.overridesDir.replace(/^(\/|\\)/, '').split('/').filter(item => !item.match(/(\/|\\)/)));
+    return (
+      // request includes extends
+      this.extends.includes(pkgName) &&
+      //
+      // this is very important, to avoid circular imports, check that the
+      // `issuer` (requesting context) isn't the overrides directory
+
+      // request is not issued from overrides
+      !filepath.includes(issuerPath)
+    );
+  }
+  handleHook(requestContext, resolveContext, callback, resolver) {
+    let targetFile;
+    let overrideRelative;
+    if (this.isFromExtends(requestContext.request, requestContext.path)) {
+      overrideRelative = this.toOverrideRelative(requestContext.request).replace(/$\//, '');
+      targetFile = this.findFileFromMap(overrideRelative, this._allSearchDirs);
+    }
+    if (targetFile) {
+      const target = resolver.ensureHook('resolved');
+      requestContext.path = _path.default.sep === '/' ? targetFile : targetFile.replace('/', _path.default.sep);
+      resolver.doResolve(target, requestContext, `${this.constructor.name} found base override file`, resolveContext, callback);
+    } else {
+      return callback();
+    }
+  }
+  apply(resolver) {
+    resolver.getHook('resolve').tapAsync('FeatureResolverPlugin', (requestContext, resolveContext, callback) => {
+      this.handleHook(requestContext, resolveContext, callback, resolver);
+    });
+  }
+}
+var _default = exports.default = OverridesResolverPlugin;