@plaudit/webpack-extensions 2.2.1 → 2.4.0

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

@@ -1,4 +1,6 @@
 import { type Compiler, type WebpackPluginInstance } from "webpack";
 export default class AdditionalDependencyInjectorPlugin implements WebpackPluginInstance {
+    private readonly entrypointAdditionalDependencies;
+    constructor(entrypointAdditionalDependencies: string[]);
     apply(compiler: Compiler): void;
 }

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

@@ -5,8 +5,11 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 const node_fs_1 = __importDefault(require("node:fs"));
 const webpack_1 = require("webpack");
-const webpack_sources_1 = require("webpack-sources");
 class AdditionalDependencyInjectorPlugin {
+    entrypointAdditionalDependencies;
+    constructor(entrypointAdditionalDependencies) {
+        this.entrypointAdditionalDependencies = entrypointAdditionalDependencies;
+    }
     apply(compiler) {
         compiler.hooks.thisCompilation.tap("AdditionalDependencyInjectorPlugin", compilation => {
             compilation.hooks.processAssets.tap({
@@ -32,13 +35,16 @@ class AdditionalDependencyInjectorPlugin {
                         if (!assetSource) {
                             continue;
                         }
+                        const additionalDependencies = [...this.entrypointAdditionalDependencies];
                         const firstLine = node_fs_1.default.readFileSync(assetSource, 'utf8').trim().split(/\r?\n/)[0];
                         if (firstLine.startsWith("//ADDITIONAL_DEPENDENCIES:")) {
-                            const additionalDependencies = firstLine.substring(26).trim().split(',').map(dep => dep.trim());
+                            additionalDependencies.push(...firstLine.substring(26).trim().split(',').map(dep => dep.trim()));
+                        }
+                        if (additionalDependencies.length > 0) {
                             const seen = new Set();
                             const additionalDeps = additionalDependencies.filter(dep => !seen.has(dep) && seen.add(dep)).sort().map(v => `'${v}'`).join(', ');
-                            if (additionalDeps) {
-                                compilation.updateAsset(name, new webpack_sources_1.RawSource(asset.source().replace(/('dependencies'\s+=>\s+(?:array\(|\[))(.*)([)\]], 'version')/g, (match, g1, g2, g3) => `${g1}${g2.length > 0 ? `${g2}, ${additionalDeps}` : additionalDeps}${g3}`)));
+                            if (additionalDeps.length > 0) {
+                                compilation.updateAsset(name, new webpack_1.sources.RawSource(asset.source().toString().replace(/('dependencies'\s+=>\s+(?:array\(|\[))(.*)([)\]], 'version')/g, (match, g1, g2, g3) => `${g1}${g2.length > 0 ? `${g2}, ${additionalDeps}` : additionalDeps}${g3}`)));
                             }
                         }
                     }

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

@@ -1,5 +1,7 @@
 import type { Compiler, WebpackPluginInstance } from "webpack";
 export default class BlockJSONStyleRemappingPlugin implements WebpackPluginInstance {
+    private readonly standaloneBlocks;
+    constructor(standaloneBlocks: boolean);
     apply(compiler: Compiler): void;
     findCommonAncestor(...paths: string[]): string[];
     findRelativeRouteBetween(path1: string, path2: string): string;

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

@@ -7,6 +7,10 @@ const node_fs_1 = __importDefault(require("node:fs"));
 const node_path_1 = __importDefault(require("node:path"));
 const webpack_sources_1 = require("webpack-sources");
 class BlockJSONStyleRemappingPlugin {
+    standaloneBlocks;
+    constructor(standaloneBlocks) {
+        this.standaloneBlocks = standaloneBlocks;
+    }
     apply(compiler) {
         compiler.hooks.compilation.tap("BlockJSONStyleRemappingPlugin", compilation => {
             compilation.hooks.afterProcessAssets.tap("BlockJSONStyleRemappingPlugin_ProcessAssets", compilationAssets => {
@@ -70,7 +74,7 @@ class BlockJSONStyleRemappingPlugin {
                                 }
                             }
                         }
-                        if (json["plaudit"] !== "simple") {
+                        if (!this.standaloneBlocks && json["plaudit"] !== "simple") {
                             const sourceDir = node_path_1.default.join(compiler.context, dirname);
                             const outputDir = node_path_1.default.join(compiler.outputPath, node_path_1.default.dirname(name));
                             const stripFilePrefix = (file) => file.startsWith("file:./") ? file.substring(7) : file;

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

@@ -1,8 +1,14 @@
 import type { Configuration } from "webpack";
+interface AdvancedOutputConfig {
+    destination: string;
+    withLegacyBlocksIn?: string | undefined;
+    additionalDependencies?: string[];
+}
 interface PlauditWordpressWebpackConfig {
+    standaloneBlocks?: boolean;
     variables?: Record<string, any>;
     verbose?: boolean;
-    src: string[] | Record<string, string>;
+    src: string[] | Record<string, string | AdvancedOutputConfig>;
 }
 declare const _default: (config: PlauditWordpressWebpackConfig, webpackConfig?: Configuration) => Configuration[];
 export = _default;

package/build/wordpress-scripts-wrapper.js

@@ -39,6 +39,20 @@ function groupEntrypointsByAssetFile(entrypoints, entrypointNameExtractor) {
     }
     return seenPaths;
 }
+function resolveLegacyBlockScriptsInFolder(folder) {
+    const blockScriptEntrypoints = [];
+    for (const blockDir of node_fs_1.default.readdirSync(folder)) {
+        const fullBlockDir = node_path_1.default.join(folder, blockDir);
+        const packageJSON = node_path_1.default.join(fullBlockDir, 'package.json');
+        if (node_fs_1.default.existsSync(packageJSON)) {
+            const main = JSON.parse(node_fs_1.default.readFileSync(packageJSON, 'utf-8'))['main'];
+            if (main && node_fs_1.default.existsSync(node_path_1.default.join(fullBlockDir, main))) {
+                blockScriptEntrypoints.push(node_path_1.default.join(fullBlockDir, main));
+            }
+        }
+    }
+    return blockScriptEntrypoints;
+}
 const scriptExtension = /\.[jt]sx?$/;
 const styleExtension = /\.(p?c|sa)ss$/;
 function scriptOrStyleTest(entryPath) {
@@ -83,7 +97,7 @@ function addPotentiallyDuplicatedEntrypointName(entry, entrypoint, typeCounts) {
     entry[potentialKey] = entrypoint[1];
 }
 module.exports = function (config, webpackConfig = require("@wordpress/scripts/config/webpack.config")) {
-    const seenPaths = groupEntrypointsByAssetFile(Array.isArray(config.src) ? config.src : Object.values(config.src), bn => bn);
+    const seenPaths = groupEntrypointsByAssetFile(Array.isArray(config.src) ? config.src : Object.values(config.src).map(bn => typeof bn === 'string' ? bn : bn.destination), bn => bn);
     let projectPrefix = undefined;
     let duplicatedPaths = "";
     for (const sameNamePaths of seenPaths.values()) {
@@ -106,7 +120,7 @@ module.exports = function (config, webpackConfig = require("@wordpress/scripts/c
         console.error(`Encountered multiple paths that produce the same effective bundle name:${duplicatedPaths}`);
         process.exit(1);
     }
-    const { variables = ["variables.js", "src/site/variables.js"].map(p => node_path_1.default.join(process.cwd(), p)).filter(p => node_fs_1.default.existsSync(p)).map(p => require(p))[0] ?? {}, verbose = process.argv.includes('--verbose') || process.env['VERBOSE'] === 'true' } = config;
+    const { standaloneBlocks = false, variables = ["variables.js", "src/site/variables.js"].map(p => node_path_1.default.join(process.cwd(), p)).filter(p => node_fs_1.default.existsSync(p)).map(p => require(p))[0] ?? {}, verbose = process.argv.includes('--verbose') || process.env['VERBOSE'] === 'true' } = config;
     const cssLoader = require.resolve('css-loader');
     if (cssLoader && webpackConfig.module?.rules) {
         for (const rule of webpackConfig.module.rules) {
@@ -154,7 +168,10 @@ module.exports = function (config, webpackConfig = require("@wordpress/scripts/c
     const sources = Array.isArray(config.src) ? config.src.map(s => [s, s]) : Object.entries(config.src);
     return sources.map(([src, dest]) => {
         currentEntrypoint = src;
-        const srcRoots = src.split(',');
+        const srcRoots = typeof dest !== 'string' && dest.withLegacyBlocksIn
+            ? [...src.split(','), ...resolveLegacyBlockScriptsInFolder(dest.withLegacyBlocksIn)]
+            : src.split(',');
+        const destPath = typeof dest === 'string' ? dest : dest.destination;
         const srcRoot = srcRoots.length === 1 ? joinPossiblyAbsolutePaths(process.cwd(), src) : srcRoots.map(s => joinPossiblyAbsolutePaths(process.cwd(), s));
         const srcIsDirectory = !Array.isArray(srcRoot) && node_fs_1.default.lstatSync(srcRoot).isDirectory();
         const copyFiles = srcIsDirectory && src !== dest;
@@ -169,9 +186,9 @@ module.exports = function (config, webpackConfig = require("@wordpress/scripts/c
             }
         }), new webpack_remove_empty_scripts_1.default({ stage: webpack_remove_empty_scripts_1.default.STAGE_AFTER_PROCESS_PLUGINS, extensions: ['css', 'scss', 'sass', 'less', 'styl', 'pcss'] }));
         if (copyFiles) {
-            plugins.push(new BlockJSONStyleRemappingPlugin_1.default());
+            plugins.push(new BlockJSONStyleRemappingPlugin_1.default(standaloneBlocks));
         }
-        plugins.push(new AdditionalDependencyInjectorPlugin_1.default());
+        plugins.push(new AdditionalDependencyInjectorPlugin_1.default(typeof dest !== 'string' && dest.additionalDependencies ? dest.additionalDependencies : []));
         if (first) {
             first = false;
             if (process.argv.includes('--browser-sync') || process.env['BROWSER_SYNC'] === 'true') {
@@ -253,7 +270,7 @@ module.exports = function (config, webpackConfig = require("@wordpress/scripts/c
             }
         }
         else {
-            const baseDest = node_path_1.default.basename(dest);
+            const baseDest = node_path_1.default.basename(destPath);
             entry = {
                 [baseDest.includes('.') ? node_path_1.default.basename(baseDest, node_path_1.default.extname(baseDest)) : baseDest]: srcRoot
             };
@@ -261,12 +278,12 @@ module.exports = function (config, webpackConfig = require("@wordpress/scripts/c
         let output;
         if (srcIsDirectory) {
             output = {
-                path: joinPossiblyAbsolutePaths(process.cwd(), dest)
+                path: joinPossiblyAbsolutePaths(process.cwd(), destPath)
             };
         }
         else {
             output = {
-                path: joinPossiblyAbsolutePaths(process.cwd(), node_path_1.default.dirname(dest))
+                path: joinPossiblyAbsolutePaths(process.cwd(), node_path_1.default.dirname(destPath))
             };
         }
         return {
@@ -279,7 +296,8 @@ module.exports = function (config, webpackConfig = require("@wordpress/scripts/c
             },
             plugins: copyFiles
                 ? plugins.map(plugin => plugin.constructor.name === 'CopyPlugin'
-                    ? new copy_webpack_plugin_1.default({ patterns: [{ from: '**/(block.json|*.(asset\.php|svg))', context: srcRoot, noErrorOnMissing: true }] })
+                    ? new copy_webpack_plugin_1.default({ patterns: [{ from: standaloneBlocks ? '**/(block.json|*.(php|twig|svg))' : '**/(block.json|*.(asset\.php|svg))',
+                                context: srcRoot, noErrorOnMissing: true }] })
                     : plugin)
                 : (srcIsDirectory
                     ? plugins.filter(plugin => plugin.constructor.name !== 'CopyPlugin' && plugin.constructor.name !== 'CleanWebpackPlugin')

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@plaudit/webpack-extensions",
-  "version": "2.2.1",
+  "version": "2.4.0",
   "scripts": {
     "prepublishOnly": "rm -rf build && mkdir build && tsc",
     "build": "tsc",
@@ -14,14 +14,14 @@
   },
   "devDependencies": {
     "@types/browser-sync-webpack-plugin": "^2.2.2",
-    "@types/node": "^20.3.1",
+    "@types/node": "^20.3.2",
     "@types/tapable": "^2.2.3",
     "@types/webpack": "^5.28.1",
     "@types/webpack-sources": "^3.2.0",
     "postcss-load-config": "^4.0.1",
     "postcss-loader": "^7.3.3",
     "ts-node": "^10.9.1",
-    "typescript": "^5.1.3"
+    "typescript": "^5.1.6"
   },
   "dependencies": {
     "@plaudit/postcss-color-function": "^5.0.0",
@@ -35,7 +35,7 @@
     "clean-webpack-plugin": "^4.0.0",
     "copy-webpack-plugin": "^11.0.0",
     "cssnano": "^6.0.1",
-    "eslint": "^8.42.0",
+    "eslint": "^8.43.0",
     "eslint-plugin-jsdoc": "^43.1.1",
     "fork-ts-checker-webpack-plugin": "^8.0.0",
     "postcss": "^8.4.24",
@@ -56,9 +56,8 @@
     "postcss-simple-vars": "^7.0.1",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
-    "webpack": "^5.88.0",
-    "webpack-remove-empty-scripts": "^1.0.3",
-    "webpack-sources": "^3.2.3"
+    "webpack": "^5.88.1",
+    "webpack-remove-empty-scripts": "^1.0.3"
   },
   "resolutions": {
     "eslint-plugin-jsdoc": "^43.1.1"