@plaudit/webpack-extensions 2.34.1 → 2.35.0

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

@@ -2,10 +2,13 @@ import { type Compilation, type Compiler, type WebpackPluginInstance } from "web
 export default class BlockJSONManagingPlugin implements WebpackPluginInstance {
     private readonly standaloneBlocks;
     private readonly processingModules;
+    static readonly mappableModuleKeys: readonly ["viewScriptModule", "scriptModule"];
+    static readonly mappableNonModuleKeys: readonly ["editorStyle", "style", "viewStyle", "editorScript", "script", "viewScript"];
     private static readonly mappableKeys;
     private static readonly blockJsonToEntrypointsMap;
     private static readonly blockJsonRawDependenciesMap;
     private static readonly blockJSONAssetSourceDirs;
+    private static readonly blockJsonAssetKeyMapping;
     constructor(standaloneBlocks: boolean, processingModules: boolean);
     static recordRawDependency(entrypoint: string, dependency: string): void;
     static recordBlockJSONAssetSourceDir(entrypoint: string, source: string): void;
@@ -16,6 +19,9 @@ export default class BlockJSONManagingPlugin implements WebpackPluginInstance {
     private static remapReferencedPHPFilesOnKey;
     private static hashThingForAsset;
     private static stripFilePrefix;
-    private static incorporateRemappedValue;
-    private static deriveAdditionalFilesMappableKey;
+    private static buildFakeCompilationAssets;
+    private static incorporateRemappedAsset;
+    private static remapReferencedAssetFile;
+    private static getReferencedFileSlot;
+    private static addAssetToBlockJsonKey;
 }

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

@@ -11,12 +11,13 @@ const php_serializer_1 = __importDefault(require("./php-serializer"));
 class BlockJSONManagingPlugin {
     standaloneBlocks;
     processingModules;
-    static mappableKeys = [
-        "editorStyle", "style", "viewStyle", "editorScript", "script", "viewScript", "viewScriptModule", "scriptModule"
-    ];
+    static mappableModuleKeys = ["viewScriptModule", "scriptModule"];
+    static mappableNonModuleKeys = ["editorStyle", "style", "viewStyle", "editorScript", "script", "viewScript"];
+    static mappableKeys = [...BlockJSONManagingPlugin.mappableNonModuleKeys, ...BlockJSONManagingPlugin.mappableModuleKeys];
     static blockJsonToEntrypointsMap = new Map();
     static blockJsonRawDependenciesMap = new Map();
     static blockJSONAssetSourceDirs = new Map();
+    static blockJsonAssetKeyMapping = new Map();
     constructor(standaloneBlocks, processingModules) {
         this.standaloneBlocks = standaloneBlocks;
         this.processingModules = processingModules;
@@ -34,8 +35,9 @@ class BlockJSONManagingPlugin {
     apply(compiler) {
         compiler.hooks.compilation.tap(this.constructor.name, compilation => {
             compilation.hooks.afterProcessAssets.tap(`${this.constructor.name}_ProcessBlockJSONFiles`, compilationAssets => {
+                const testableCompilationAssets = this.processingModules ? BlockJSONManagingPlugin.buildFakeCompilationAssets(compilation) : compilationAssets;
                 const currentBlockJSONAssets = BlockJSONManagingPlugin.blockJSONAssetSourceDirs.entries()
-                    .filter(([name]) => name in compilationAssets)
+                    .filter(([name]) => name in testableCompilationAssets)
                     .toArray();
                 for (const [name] of currentBlockJSONAssets) {
                     const dependencies = BlockJSONManagingPlugin.blockJsonRawDependenciesMap.get(name);
@@ -71,57 +73,65 @@ class BlockJSONManagingPlugin {
                         }
                     }
                 }
-                if (this.processingModules) {
-                    // We perform the processing in the non-modules half ONLY because we don't necessarily have all the information we need during the modules half.
-                    for (const [name] of currentBlockJSONAssets) {
-                        compilation.deleteAsset(name); // While the method is called, "deleteAsset", it doesn't actually delete it - just halts emission.
-                    }
-                    return;
-                }
                 const blockDirConfigData = {};
-                const remapValue = (value, name) => {
-                    if (value.startsWith("file:")) {
-                        const sourceDir = BlockJSONManagingPlugin.blockJSONAssetSourceDirs.get(name) ?? node_path_1.default.dirname(name);
-                        const inputPath = node_path_1.default.normalize(node_path_1.default.join(sourceDir, value.substring(5)));
-                        const outputAndAdditionalFiles = BlockJSONManagingPlugin.blockJsonToEntrypointsMap.get(name)?.get(inputPath);
-                        if (outputAndAdditionalFiles !== undefined) {
-                            const [output, additionalFiles] = outputAndAdditionalFiles;
-                            const prefix = value.startsWith("./", 5) ? "./" : "";
-                            const relativePath = node_path_1.default.relative(node_path_1.default.dirname(name), output.path);
-                            const res = [`file:${prefix}${relativePath}`, output.hash];
-                            return [res, additionalFiles.map(additionalFile => `file:./${node_path_1.default.relative(node_path_1.default.dirname(name), additionalFile)}`)];
-                        }
-                    }
-                    return [[value, ""], []];
-                };
                 for (const [name, sourceDir] of currentBlockJSONAssets) {
-                    const assetContents = compilation.assets[name]?.buffer().toString();
+                    const assetContents = this.processingModules ? node_fs_1.default.readFileSync(testableCompilationAssets[name], 'utf8') : compilation.assets[name]?.buffer().toString();
                     if (!assetContents) {
                         continue;
                     }
                     blockDirConfigData[name] = true;
                     const json = JSON.parse(assetContents);
-                    let compositeHash = "";
-                    const tempMappedKeys = {};
-                    for (const mappableKey of BlockJSONManagingPlugin.mappableKeys) {
+                    const currentAssetKeyMappings = { directMappings: {}, referencedFiles: {}, compositeHash: "" };
+                    for (const mappableKey of BlockJSONManagingPlugin[this.processingModules ? 'mappableModuleKeys' : 'mappableNonModuleKeys']) {
                         if (mappableKey in json) {
                             const unmappedValue = json[mappableKey];
                             if (Array.isArray(unmappedValue)) {
                                 for (const uv of unmappedValue) {
-                                    const [remappedValue, additionalValues] = remapValue(uv, name);
-                                    BlockJSONManagingPlugin.incorporateRemappedValue(tempMappedKeys, mappableKey, remappedValue[0], additionalValues);
-                                    compositeHash += "~" + remappedValue[1];
+                                    BlockJSONManagingPlugin.incorporateRemappedAsset(currentAssetKeyMappings, mappableKey, ...BlockJSONManagingPlugin.remapReferencedAssetFile(uv, name));
                                 }
                             }
                             else if (typeof unmappedValue === 'string') {
-                                const [remappedValue, additionalValues] = remapValue(unmappedValue, name);
-                                BlockJSONManagingPlugin.incorporateRemappedValue(tempMappedKeys, mappableKey, remappedValue[0], additionalValues);
-                                compositeHash += "~" + remappedValue[1];
+                                BlockJSONManagingPlugin.incorporateRemappedAsset(currentAssetKeyMappings, mappableKey, ...BlockJSONManagingPlugin.remapReferencedAssetFile(unmappedValue, name));
                             }
                         }
                     }
-                    for (const [mappableKey, mappedValue] of Object.entries(tempMappedKeys)) {
-                        json[mappableKey] = mappedValue;
+                    const assetKeyMappings = { ...BlockJSONManagingPlugin.blockJsonAssetKeyMapping.get(name), [this.processingModules ? 'module' : 'nonModule']: currentAssetKeyMappings };
+                    BlockJSONManagingPlugin.blockJsonAssetKeyMapping.set(name, assetKeyMappings);
+                    let compositeHash = "";
+                    const condensedBlockJsonAssetKeyMappings = {};
+                    for (const subType of ['nonModule', 'module']) {
+                        const mappings = assetKeyMappings[subType];
+                        if (mappings) {
+                            compositeHash += mappings.compositeHash;
+                            for (const mappableKey of BlockJSONManagingPlugin.mappableKeys) {
+                                if (mappings.directMappings[mappableKey]) {
+                                    BlockJSONManagingPlugin.addAssetToBlockJsonKey(condensedBlockJsonAssetKeyMappings, mappableKey, mappings.directMappings[mappableKey]);
+                                }
+                            }
+                            for (const [referenceLocation, prefix] of [["editor", "editorS"], ["both", "s"], ["view", "viewS"]]) {
+                                if (mappings.referencedFiles[referenceLocation]) {
+                                    for (const referencedFile of mappings.referencedFiles[referenceLocation]) {
+                                        if (referencedFile.endsWith(".css")) {
+                                            BlockJSONManagingPlugin.addAssetToBlockJsonKey(condensedBlockJsonAssetKeyMappings, `${prefix}tyle`, referencedFile);
+                                        }
+                                        else if (referencedFile.endsWith(".js")) {
+                                            BlockJSONManagingPlugin.addAssetToBlockJsonKey(condensedBlockJsonAssetKeyMappings, `${prefix}cript`, referencedFile);
+                                        }
+                                        else if (referencedFile.endsWith(".mjs")) {
+                                            BlockJSONManagingPlugin.addAssetToBlockJsonKey(condensedBlockJsonAssetKeyMappings, `${prefix}criptModule`, referencedFile);
+                                        }
+                                    }
+                                }
+                            }
+                        }
+                    }
+                    for (const mappableKey of BlockJSONManagingPlugin.mappableKeys) {
+                        if (mappableKey in condensedBlockJsonAssetKeyMappings) {
+                            json[mappableKey] = condensedBlockJsonAssetKeyMappings[mappableKey];
+                        }
+                        else {
+                            delete json[mappableKey];
+                        }
                     }
                     if (json["version"]) {
                         json["version"] = `${json["version"]}-${BlockJSONManagingPlugin.hashThingForAsset(compositeHash)}`;
@@ -279,47 +289,88 @@ class BlockJSONManagingPlugin {
     static stripFilePrefix(file) {
         return file.startsWith("file:./") ? file.substring(7) : file;
     }
-    static incorporateRemappedValue(mappedKeys, mappableKey, remappedValue, additionalValues) {
-        if (typeof mappedKeys[mappableKey] === 'string') {
-            mappedKeys[mappableKey] = [mappedKeys[mappableKey], remappedValue];
+    static buildFakeCompilationAssets(compilation) {
+        const res = {};
+        for (const filePath of compilation.fileDependencies.values()) {
+            if (filePath.endsWith("/block.json")) {
+                const directory = node_path_1.default.dirname(node_path_1.default.normalize(filePath));
+                res[node_path_1.default.join(node_path_1.default.basename(directory), "block.json")] = filePath;
+            }
         }
-        else if (Array.isArray(mappedKeys[mappableKey])) {
-            mappedKeys[mappableKey].push(remappedValue);
+        return res;
+    }
+    static incorporateRemappedAsset(cacheableMappedKeys, mappableKey, remappedValue, additionalValues) {
+        if (additionalValues.length > 0) {
+            const referencedFilesSlot = BlockJSONManagingPlugin.getReferencedFileSlot(mappableKey);
+            if (!cacheableMappedKeys.referencedFiles[referencedFilesSlot]) {
+                cacheableMappedKeys.referencedFiles[referencedFilesSlot] = [...additionalValues];
+            }
+            else {
+                cacheableMappedKeys.referencedFiles[referencedFilesSlot].push(...additionalValues);
+            }
+        }
+        if (Array.isArray(cacheableMappedKeys.directMappings[mappableKey])) {
+            cacheableMappedKeys.directMappings[mappableKey].push(remappedValue[0]);
+        }
+        else if (typeof cacheableMappedKeys.directMappings[mappableKey] === 'string') {
+            cacheableMappedKeys.directMappings[mappableKey] = [cacheableMappedKeys.directMappings[mappableKey], remappedValue[0]];
         }
         else {
-            mappedKeys[mappableKey] = remappedValue;
+            cacheableMappedKeys.directMappings[mappableKey] = remappedValue[0];
         }
-        if (additionalValues.length) {
-            const additionalValuesMappableKey = BlockJSONManagingPlugin.deriveAdditionalFilesMappableKey(mappableKey);
-            if (typeof mappedKeys[additionalValuesMappableKey] === 'string') {
-                mappedKeys[additionalValuesMappableKey] = [mappedKeys[additionalValuesMappableKey], ...additionalValues];
-            }
-            else if (Array.isArray(mappedKeys[additionalValuesMappableKey])) {
-                mappedKeys[additionalValuesMappableKey].push(...additionalValues);
-            }
-            else {
-                mappedKeys[additionalValuesMappableKey] = additionalValues;
+        cacheableMappedKeys.compositeHash += "~" + remappedValue[1];
+    }
+    static remapReferencedAssetFile(value, name) {
+        if (value.startsWith("file:")) {
+            const sourceDir = BlockJSONManagingPlugin.blockJSONAssetSourceDirs.get(name) ?? node_path_1.default.dirname(name);
+            const inputPath = node_path_1.default.normalize(node_path_1.default.join(sourceDir, value.substring(5)));
+            const outputAndAdditionalFiles = BlockJSONManagingPlugin.blockJsonToEntrypointsMap.get(name)?.get(inputPath);
+            if (outputAndAdditionalFiles !== undefined) {
+                const [output, additionalFiles] = outputAndAdditionalFiles;
+                const prefix = value.startsWith("./", 5) ? "./" : "";
+                const relativePath = node_path_1.default.relative(node_path_1.default.dirname(name), output.path);
+                const res = [`file:${prefix}${relativePath}`, output.hash];
+                return [res, additionalFiles.map(additionalFile => `file:./${node_path_1.default.relative(node_path_1.default.dirname(name), additionalFile)}`)];
             }
         }
+        return [[value, ""], []];
     }
-    static deriveAdditionalFilesMappableKey(mappableKey) {
-        let value;
-        if (mappableKey.endsWith("tyle")) { // If the original file was a stylesheet, then any additional files will be imported via the script tags
-            value = this.mappableKeys[this.mappableKeys.indexOf(mappableKey) + 3];
+    static getReferencedFileSlot(mappableKey) {
+        if (mappableKey.startsWith("editor")) {
+            return "editor";
         }
-        else if (mappableKey.endsWith("cript")) { // If the original file was a script, then any additional files will be imported via the style tags
-            value = this.mappableKeys[this.mappableKeys.indexOf(mappableKey) - 3];
+        else if (mappableKey.startsWith("view")) {
+            return "view";
         }
-        else if (mappableKey === "viewScriptModule") {
-            return "viewStyle";
+        else {
+            return "both";
+        }
+    }
+    static addAssetToBlockJsonKey(json, mappableKey, asset) {
+        if (json[mappableKey] === undefined) {
+            if (Array.isArray(asset)) {
+                json[mappableKey] = [...asset];
+            }
+            else {
+                json[mappableKey] = asset;
+            }
         }
-        else if (mappableKey === "scriptModule") {
-            return "style";
+        else if (typeof json[mappableKey] === 'string') {
+            if (Array.isArray(asset)) {
+                json[mappableKey] = [json[mappableKey], ...asset];
+            }
+            else {
+                json[mappableKey] = [json[mappableKey], asset];
+            }
         }
-        if (value === undefined) {
-            throw new webpack_1.WebpackError(`Encountered a mappable key (${mappableKey}) that has additional files but no valid mapping for them`);
+        else {
+            if (Array.isArray(asset)) {
+                json[mappableKey].push(...asset);
+            }
+            else {
+                json[mappableKey].push(asset);
+            }
         }
-        return value;
     }
 }
 exports.default = BlockJSONManagingPlugin;

package/build/wordpress-scripts-wrapper.js

@@ -493,7 +493,7 @@ function processIndividualWebpackConfig(config, webpackConfig, sources) {
             },
             stats: config.stats,
             plugins: copyFiles
-                ? plugins.map(plugin => plugin.constructor.name === 'CopyPlugin'
+                ? plugins.map(plugin => !processingModules && plugin.constructor.name === 'CopyPlugin'
                     ? new copy_webpack_plugin_1.default({ patterns: [{ from: standaloneBlocks ? '**/(block.json|*.(php|twig|svg))' : '**/(block.json|*.(asset\.php|svg))',
                                 context: srcRoot, noErrorOnMissing: true }] })
                     : plugin)
@@ -521,7 +521,12 @@ module.exports = function (config, webpackConfig = require("@wordpress/scripts/c
     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));
+        return webpackConfig.toSorted((a, b) => {
+            if (a.output?.module) {
+                return b.output?.module ? 0 : -1;
+            }
+            return b.output?.module ? 1 : 0;
+        }).flatMap(wpCfg => processIndividualWebpackConfig(cfg, wpCfg, sources));
     }
     return processIndividualWebpackConfig(cfg, webpackConfig, sources);
 };

package/package.json

@@ -1,6 +1,7 @@
 {
   "name": "@plaudit/webpack-extensions",
-  "version": "2.34.1",
+  "version": "2.35.0",
+  "license": "UNLICENSED",
   "scripts": {
     "prepublishOnly": "rm -rf build && mkdir build && tsc",
     "build": "tsc",
@@ -22,31 +23,31 @@
   "devDependencies": {
     "@types/browser-sync-webpack-plugin": "^2.2.5",
     "@types/postcss-functions": "^4.0.4",
-    "@types/node": "^20.14.11",
+    "@types/node": "^22.9.0",
     "@types/tapable": "^2.2.7",
     "@types/webpack": "^5.28.5",
     "@types/webpack-sources": "^3.2.3",
     "postcss-load-config": "^4.0.2",
     "postcss-loader": "^7.3.4",
     "ts-node": "^10.9.2",
-    "typescript": "^5.6.2"
+    "typescript": "^5.6.3"
   },
   "dependencies": {
     "@plaudit/postcss-color-function": "^5.0.0",
     "@plaudit/postcss-silent-extend": "^3.0.0",
     "@plaudit/postcss-strip-units": "^3.0.0",
     "@plaudit/postcss-variables": "^1.0.0",
-	"@wordpress/dependency-extraction-webpack-plugin": "^6.7.0",
-    "@wordpress/scripts": "^28.3.0",
+	"@wordpress/dependency-extraction-webpack-plugin": "^6.11.0",
+    "@wordpress/scripts": "^30.4.0",
     "autoprefixer": "^10.4.19",
-    "browser-sync": "^3.0.2",
+    "browser-sync": "^3.0.3",
     "clean-webpack-plugin": "^4.0.0",
     "copy-webpack-plugin": "^12.0.2",
     "cssnano": "^6.1.2",
     "eslint": "^8.57.0",
     "eslint-plugin-jsdoc": "^48.2.3",
     "fork-ts-checker-webpack-plugin": "^9.0.2",
-    "http-proxy-middleware": "^3.0.1-beta.0",
+    "http-proxy-middleware": "^3.0.3",
     "postcss": "^8.4.39",
     "postcss-calc": "^9.0.1",
     "postcss-discard-comments": "^6.0.2",
@@ -67,7 +68,7 @@
     "postcss-url": "^10.1.3",
     "react": "^18.3.1",
     "react-dom": "^18.3.1",
-    "webpack": "^5.92.1",
+    "webpack": "^5.96.1",
     "webpack-remove-empty-scripts": "^1.0.4"
   }
 }