Class: TogglePointInjection

Constructor

new TogglePointInjection(options) → {external:Webpack.WebpackPluginInstance}

Parameters:

Name	Type	Description
options	object	plugin options Properties Name Type Attributes Description pointCuts Array.<object> toggle point point cut configuration, with target toggle point code as advice. The first matching point cut will be used Properties Name Type Attributes Default Description name string name to describe the nature of the point cut, for clarity in logs and dev tools etc. togglePointModule string path, from root of the compilation, of where the toggle point sits. Or a resolvable node_module. variantGlobs Array.<string> <optional> [.\/**\/__variants__/*\/*\/!(*.test).{js,jsx,ts,tsx}] Globs to identified variant modules. The plugin uses fast-glob under the hood, so supports any glob that it does. joinPointResolver function <optional> (variantPath) => path.posix.resolve(variantPath, "../../../..", path.basename(variantPath)) A function that takes the path to a variant module and returns a join point / base module. N.B. This is executed at build-time, so cannot use run-time context. It should use posix path segments, so on Windows be sure to use path.posix.resolve. toggleHandler string <optional> '@asos/web-toggle-point-webpack/pathSegmentToggleHandler' a module specifier pointing to a toggle handler, that takes a toggle point, a Map of relative paths to potential variants, and a join point. If not provided, the plugin will use a default handler that processes folder names into a tree held in a Map. webpackNormalModule function <optional> A reference to the Webpack NormalModule class. This is required for Next.js, as it does not expose the NormalModule class directly

Returns:

Type

external:Webpack.WebpackPluginInstance

Example

N.B. forward slashes are escaped in the glob, due to JSDoc shortcomings, but in reality should be un-escaped

const plugin = new TogglePointInjection({
  pointCuts: [
    {
      togglePointModule: "/withToggledHook",
      variantGlobs: ["./**\/__variants__/*\/*\/use!(*.test).{ts,tsx}"]
    },
    {
      togglePointModule: "/withTogglePoint",
      variantGlobs: ["./**\/__variants__/*\/*\/!(use*|*.test).{ts,tsx}"]
    }
  ]
});
const webPackConfig = {
  ...rest
  plugins: [plugin]
}