@plaudit/webpack-extensions 2.26.0 → 2.28.0

package/build/wordpress-scripts-wrapper/ExtensionsConfigFileGeneratorPlugin.js

@@ -49,6 +49,7 @@ class ExtensionsConfigFileGeneratorPlugin {
                 if (!stats.modules) {
                     throw new Error("Stats did not include modules despite them being requested");
                 }
+                const regex = /^(.+?)-((?:editor-|view-|)(?:style|script|script-module))\.(?:css|m?js)$/i;
                 const mapping = {};
                 for (const asset of stats.assets) {
                     if ((asset.chunks?.length ?? -1) > 1 || !asset.size) {
@@ -58,21 +59,9 @@ class ExtensionsConfigFileGeneratorPlugin {
                     if ((match = /^(.+?)-setup.php$/i.exec(asset.name)) && match[1]) {
                         (mapping[match[1]] ?? (mapping[match[1]] = [{}]))[1] = `${asset.name}`;
                     }
-                    else if ((match = /^(.+?)-(editor-style|style|view-script|editor-script|script)\.(?:css|m?js)$/i.exec(asset.name)) && match[1] && match[2]) {
+                    else if ((match = regex.exec(asset.name)) && match[1] && match[2]) {
                         const resourceInfo = (mapping[match[1]] ?? (mapping[match[1]] = [{}]))[0];
-                        let key;
-                        if (match[2] === "editor-script") {
-                            key = "editorScript";
-                        }
-                        else if (match[2] === "view-script") {
-                            key = "viewScript";
-                        }
-                        else if (match[2] === "editor-style") {
-                            key = "editorStyle";
-                        }
-                        else {
-                            key = match[2];
-                        }
+                        const key = match[2].replace(/-[sm]/gi, chars => chars.substring(1).toUpperCase());
                         (resourceInfo[key] ?? (resourceInfo[key] = [])).push([`plaudit_block-extension_${match[1]}-${match[2]}`, asset.name]);
                     }
                 }

package/build/wordpress-scripts-wrapper.d.ts

@@ -15,6 +15,12 @@ type PlauditWordpressWebpackConfig = {
     postcss?: {
         functions?: (variables: (name: string) => unknown) => PostcssFunctionsOptions['functions'];
     };
+    externals?: {
+        [dep: string]: string | {
+            import: string;
+            handle: string;
+        };
+    };
 };
 declare const _default: (config: PlauditWordpressWebpackConfig, webpackConfig?: Configuration[] | Configuration) => Configuration[];
 export = _default;

package/build/wordpress-scripts-wrapper.js

@@ -10,6 +10,7 @@ const ExtensionsConfigFileGeneratorPlugin_1 = __importDefault(require("./wordpre
 const VariablesJSMonitorPlugin_1 = __importDefault(require("./wordpress-scripts-wrapper/VariablesJSMonitorPlugin"));
 const BrowserSyncPlugin_1 = require("./wordpress-scripts-wrapper/BrowserSyncPlugin");
 const static_configs_1 = require("./wordpress-scripts-wrapper/static-configs");
+const dependency_extraction_webpack_plugin_1 = __importDefault(require("@wordpress/dependency-extraction-webpack-plugin"));
 const copy_webpack_plugin_1 = __importDefault(require("copy-webpack-plugin"));
 const fork_ts_checker_webpack_plugin_1 = __importDefault(require("fork-ts-checker-webpack-plugin"));
 const webpack_remove_empty_scripts_1 = __importDefault(require("webpack-remove-empty-scripts"));
@@ -224,7 +225,7 @@ function processIndividualWebpackConfig(config, webpackConfig, sources) {
         scriptExtension = scriptWithoutModuleExtension;
         entrypointFields = ["editorStyle", "viewStyle", "style", "editorScript", "viewScript", "script"];
     }
-    const { standaloneBlocks, variablesFilePath, verbose } = config;
+    const { standaloneBlocks, variablesFilePath, verbose, externals } = config;
     let currentVariables = config.currentVariables;
     replaceDefaultURLProcessing(webpackConfig);
     const fixedRules = injectPostcssConfigOverrides(webpackConfig, name => currentVariables[name], config.postcss.functions ?? (() => ({})), verbose);
@@ -281,6 +282,37 @@ function processIndividualWebpackConfig(config, webpackConfig, sources) {
         if (srcIsDirectory && (typeof dest !== 'string' && dest.directoryLayout === 'extensions')) {
             plugins.push(new ExtensionsConfigFileGeneratorPlugin_1.default(srcRoot));
         }
+        if (externals) {
+            const pluginIndex = plugins.findIndex(plugin => plugin instanceof dependency_extraction_webpack_plugin_1.default);
+            if (pluginIndex === -1) {
+                console.error("Cannot apply externals when they have been disabled via CLI flag.");
+            }
+            else {
+                plugins[pluginIndex] = new dependency_extraction_webpack_plugin_1.default({
+                    requestToExternal(request) {
+                        const possibleExternal = externals[request];
+                        if (typeof possibleExternal === 'string') {
+                            return possibleExternal;
+                        }
+                        else if (possibleExternal !== undefined) {
+                            return possibleExternal['import'];
+                        }
+                        else {
+                            return undefined;
+                        }
+                    },
+                    requestToHandle(request) {
+                        const possibleExternal = externals[request];
+                        if (possibleExternal !== undefined && typeof possibleExternal !== 'string') {
+                            return possibleExternal['handle'];
+                        }
+                        else {
+                            return request;
+                        }
+                    }
+                });
+            }
+        }
         if (process.argv.includes('--browser-sync') || process.env['BROWSER_SYNC'] === 'true') {
             plugins.push(new BrowserSyncPlugin_1.BrowserSyncPlugin());
         }
@@ -423,13 +455,13 @@ function processIndividualWebpackConfig(config, webpackConfig, sources) {
 }
 module.exports = function (config, webpackConfig = require("@wordpress/scripts/config/webpack.config")) {
     testForDuplicatedEntryPaths(config);
-    const { standaloneBlocks = false, stats = 'errors-warnings', variables: rawVariables, verbose = process.argv.includes('--verbose') || process.env['VERBOSE'] === 'true', postcss = {} } = config;
+    const { standaloneBlocks = false, stats = 'errors-warnings', variables: rawVariables, verbose = process.argv.includes('--verbose') || process.env['VERBOSE'] === 'true', postcss = {}, externals } = config;
     let variablesFilePath = undefined;
     const currentVariables = rawVariables ?? {};
     if (!rawVariables) {
         variablesFilePath = ["variables.js", "src/site/variables.js"].map(p => node_path_1.default.join(process.cwd(), p)).filter(p => node_fs_1.default.existsSync(p))[0];
     }
-    const cfg = { currentVariables, postcss, standaloneBlocks, stats, variablesFilePath, verbose };
+    const cfg = { currentVariables, postcss, standaloneBlocks, stats, variablesFilePath, verbose, externals };
     const sources = Array.isArray(config.src) ? config.src.map(s => [s, s]) : Object.entries(config.src);
     if (Array.isArray(webpackConfig)) {
         return webpackConfig.flatMap(wpCfg => processIndividualWebpackConfig(cfg, wpCfg, sources));

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@plaudit/webpack-extensions",
-  "version": "2.26.0",
+  "version": "2.28.0",
   "scripts": {
     "prepublishOnly": "rm -rf build && mkdir build && tsc",
     "build": "tsc",
@@ -29,7 +29,7 @@
     "postcss-load-config": "^4.0.2",
     "postcss-loader": "^7.3.4",
     "ts-node": "^10.9.2",
-    "typescript": "^5.5.3"
+    "typescript": "^5.6.2"
   },
   "dependencies": {
     "@plaudit/postcss-color-function": "^5.0.0",