@plaudit/webpack-extensions 0.0.22 → 1.0.0

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

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

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

@@ -8,43 +8,35 @@ const node_path_1 = __importDefault(require("node:path"));
 const webpack_1 = require("webpack");
 const webpack_sources_1 = require("webpack-sources");
 class AdditionalDependencyInjectorPlugin {
-    filesWithAdditionalDependencies;
-    constructor(filesWithAdditionalDependencies = new Map()) {
-        this.filesWithAdditionalDependencies = filesWithAdditionalDependencies;
-    }
     apply(compiler) {
         compiler.hooks.thisCompilation.tap("AdditionalDependencyInjectorPlugin", compilation => {
             compilation.hooks.processAssets.tap({
                 name: "AdditionalDependencyInjectorPlugin_ProcessAssets",
                 stage: webpack_1.Compilation.PROCESS_ASSETS_STAGE_ANALYSE
             }, compilationAssets => {
-                const srcDir = process.env['WP_SRC_DIRECTORY'] || 'src';
-                const srcRoot = node_path_1.default.join(process.cwd(), srcDir);
-                Object.entries(compilationAssets).map(([name, asset]) => {
+                for (const [name, asset] of Object.entries(compilationAssets)) {
                     if (name.endsWith(".asset.php") && asset instanceof webpack_sources_1.RawSource) {
                         const extensionlessName = name.substring(0, name.length - 10);
                         const additionalDependencies = [];
-                        const possibleExtensions = ['ts', 'tsx', 'js', 'jsx'];
-                        for (const possibleExtension of possibleExtensions) {
-                            const possibleFile = node_path_1.default.join(srcRoot, `${extensionlessName}.${possibleExtension}`);
-                            if (node_fs_1.default.existsSync(possibleFile)) {
-                                const firstLine = node_fs_1.default.readFileSync(possibleFile, 'utf8').trim().split(/\r?\n/)[0];
-                                if (firstLine.startsWith("//ADDITIONAL_DEPENDENCIES:")) {
-                                    additionalDependencies.push(...firstLine.substring(26).trim().split(','));
+                        dependencyFinder: for (const srcRoot of compilation.contextDependencies) {
+                            for (const possibleExtension of ['ts', 'tsx', 'js', 'jsx']) {
+                                const possibleFile = node_path_1.default.join(srcRoot, `${extensionlessName}.${possibleExtension}`);
+                                if (node_fs_1.default.existsSync(possibleFile)) {
+                                    const firstLine = node_fs_1.default.readFileSync(possibleFile, 'utf8').trim().split(/\r?\n/)[0];
+                                    if (firstLine.startsWith("//ADDITIONAL_DEPENDENCIES:")) {
+                                        additionalDependencies.push(...firstLine.substring(26).trim().split(','));
+                                    }
+                                    break dependencyFinder;
                                 }
-                                break;
                             }
                         }
-                        if (this.filesWithAdditionalDependencies.has(extensionlessName)) {
-                            additionalDependencies.push(...this.filesWithAdditionalDependencies.get(extensionlessName));
-                        }
                         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}`)));
                         }
                     }
-                });
+                }
             });
         });
     }

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

@@ -31,22 +31,31 @@ class BlockJSONStyleRemappingPlugin {
                     }
                     return undefined;
                 }).filter((v) => v !== undefined) ?? []);
-                const styleKeys = ["editorStyle", "style", "viewStyle"];
+                const remapValue = (value, name, dirname) => {
+                    if (value.startsWith("file:")) {
+                        const styleInputPath = node_path_1.default.normalize(node_path_1.default.join(compiler.context, dirname, value.substring(5)));
+                        const styleOutputPath = singleFileInputToOutputName.get(styleInputPath);
+                        if (styleOutputPath !== undefined) {
+                            const prefix = value.startsWith("./", 5) ? "./" : "";
+                            const relativePath = node_path_1.default.relative(node_path_1.default.dirname(name), styleOutputPath);
+                            return `file:${prefix}${relativePath}`;
+                        }
+                    }
+                    return value;
+                };
+                const mappableKeys = ["editorStyle", "style", "viewStyle", "viewScript", "script", "editorScript"];
                 Object.entries(compilationAssets).map(([name, asset]) => {
                     if (name.endsWith("block.json") && asset instanceof webpack_sources_1.RawSource) {
                         const dirname = node_path_1.default.dirname(assetSourceFiles.get(name) ?? name);
                         const json = JSON.parse(asset.source());
-                        for (const styleKey of styleKeys) {
-                            if (styleKey in json) {
-                                const style = json[styleKey];
-                                if (typeof style === 'string' && style.startsWith('file:')) {
-                                    const styleInputPath = node_path_1.default.normalize(node_path_1.default.join(compiler.context, dirname, style.substring(5)));
-                                    const styleOutputPath = singleFileInputToOutputName.get(styleInputPath);
-                                    if (styleOutputPath !== undefined) {
-                                        const prefix = style.startsWith("./", 5) ? "./" : "";
-                                        const relativePath = node_path_1.default.relative(node_path_1.default.dirname(name), styleOutputPath);
-                                        json[styleKey] = `file:${prefix}${relativePath}`;
-                                    }
+                        for (const mappableKey of mappableKeys) {
+                            if (mappableKey in json) {
+                                const unmappedValue = json[mappableKey];
+                                if (Array.isArray(unmappedValue)) {
+                                    json[mappableKey] = unmappedValue.map(value => remapValue(value, name, dirname));
+                                }
+                                else if (typeof unmappedValue === 'string') {
+                                    json[mappableKey] = remapValue(unmappedValue, name, dirname);
                                 }
                             }
                         }

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

@@ -1,7 +1,7 @@
 import type { Configuration } from "webpack";
 export interface PlauditWordpressWebpackConfig {
-    legacyPostcssPlugins: boolean;
-    variables: Record<string, any>;
-    src: string;
+    legacyPostcssPlugins?: boolean;
+    variables?: Record<string, any>;
+    src: Record<string, string>;
 }
-export default function (config?: Partial<PlauditWordpressWebpackConfig>, webpackConfig?: Configuration): Configuration;
+export default function (config: PlauditWordpressWebpackConfig, webpackConfig?: Configuration): Configuration[];

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

@@ -10,25 +10,18 @@ const BlockJSONStyleRemappingPlugin_1 = __importDefault(require("./BlockJSONStyl
 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"));
-function addEntryPointWithFilter(entrypoints, entrypoint, mapper = (entrypoint) => entrypoint) {
-    if (Array.isArray(entrypoint)) {
-        entrypoints.push(...entrypoint.map(mapper));
-    }
-    else {
-        entrypoints.push(mapper(entrypoint));
+function addEntryPointWithMapper(entrypoints, entrypoint, dir, mapper = (entrypoint) => entrypoint) {
+    for (const ep of Array.isArray(entrypoint) ? entrypoint : [entrypoint]) {
+        const mapped = node_path_1.default.join(dir, mapper(ep));
+        if (node_fs_1.default.existsSync(mapped)) {
+            const parsedEntrypoint = node_path_1.default.parse(mapped);
+            entrypoints[node_path_1.default.join(node_path_1.default.basename(parsedEntrypoint.dir), parsedEntrypoint.name)] = { import: mapped };
+        }
     }
 }
-function default_1(config = {}, webpackConfig = require("@wordpress/scripts/config/webpack.config")) {
+function default_1(config, webpackConfig = require("@wordpress/scripts/config/webpack.config")) {
     const { legacyPostcssPlugins = false, variables = node_fs_1.default.existsSync("./variables.js") ? require("./variables.js") : {}, // TODO: There must be a better way to handle this...
-    src = process.env['WP_SRC_DIRECTORY'] || 'src' } = config;
-    (webpackConfig.plugins ?? (webpackConfig.plugins = [])).push(new fork_ts_checker_webpack_plugin_1.default({
-        typescript: {
-            diagnosticOptions: {
-                semantic: true,
-                syntactic: true,
-            },
-        },
-    }), new webpack_remove_empty_scripts_1.default({ stage: webpack_remove_empty_scripts_1.default.STAGE_AFTER_PROCESS_PLUGINS }), new BlockJSONStyleRemappingPlugin_1.default(), new AdditionalDependencyInjectorPlugin_1.default(), new copy_webpack_plugin_1.default({ patterns: [{ from: '**/*.(twig|svg)', context: src, noErrorOnMissing: true }] }));
+     } = config;
     // Nano Config
     // http://cssnano.co/guides/optimisations/  For the value to use click on one and then
     const nanoConfig = {
@@ -123,46 +116,77 @@ function default_1(config = {}, webpackConfig = require("@wordpress/scripts/conf
             }
         }
     }
-    const baseEntry = webpackConfig.entry;
-    webpackConfig.entry = () => {
-        const srcDir = process.env['WP_SRC_DIRECTORY'] || 'src';
+    (webpackConfig.plugins ?? (webpackConfig.plugins = [])).push(new fork_ts_checker_webpack_plugin_1.default({
+        typescript: {
+            diagnosticOptions: {
+                semantic: true,
+                syntactic: true,
+            },
+        },
+    }), new webpack_remove_empty_scripts_1.default({ stage: webpack_remove_empty_scripts_1.default.STAGE_AFTER_PROCESS_PLUGINS }), new BlockJSONStyleRemappingPlugin_1.default(), new AdditionalDependencyInjectorPlugin_1.default());
+    return Object.entries(config.src).map(([srcDir, dest]) => {
         const srcRoot = node_path_1.default.join(process.cwd(), srcDir);
-        const entrypoints = node_fs_1.default.readdirSync(srcRoot, 'utf8')
-            .map(dir => node_path_1.default.join(srcRoot, dir))
-            .filter(dir => node_fs_1.default.statSync(dir).isDirectory())
-            .flatMap(dir => {
-            const entrypoints = [];
-            try {
-                const blockJSON = JSON.parse(node_fs_1.default.readFileSync(node_path_1.default.join(dir, 'block.json'), 'utf8'));
-                for (const key of ["editorStyle", "style", "editorScript", "viewScript", "script"]) {
-                    if (key in blockJSON) {
-                        addEntryPointWithFilter(entrypoints, blockJSON[key], ep => ep.startsWith("file:") ? ep.substring(5) : ep);
-                    }
-                }
-            }
-            catch (e) {
+        return {
+            ...webpackConfig,
+            output: {
+                ...webpackConfig.output,
+                path: node_path_1.default.join(process.cwd(), dest)
+            },
+            plugins: webpackConfig.plugins.map(plugin => plugin.constructor.name === 'CopyPlugin'
+                ? new copy_webpack_plugin_1.default({ patterns: [{ from: '**/(block.json|*.(php|twig|svg))', context: srcRoot, noErrorOnMissing: true }] })
+                : plugin),
+            entry: node_fs_1.default.readdirSync(srcRoot, 'utf8')
+                .map(dir => node_path_1.default.join(srcRoot, dir))
+                .filter(dir => node_fs_1.default.statSync(dir).isDirectory())
+                .reduce((entrypoints, dir) => {
                 try {
-                    const packageJSON = JSON.parse(node_fs_1.default.readFileSync(node_path_1.default.join(dir, 'package.json'), 'utf8'));
-                    addEntryPointWithFilter(entrypoints, packageJSON['main']);
-                    addEntryPointWithFilter(entrypoints, packageJSON['style']);
+                    const blockJSON = JSON.parse(node_fs_1.default.readFileSync(node_path_1.default.join(dir, 'block.json'), 'utf8'));
+                    for (const key of ["editorStyle", "style", "editorScript", "viewScript", "script"]) {
+                        if (key in blockJSON) {
+                            addEntryPointWithMapper(entrypoints, blockJSON[key], dir, ep => ep.startsWith("file:") ? ep.substring(5) : ep);
+                        }
+                    }
                 }
                 catch (e) {
-                    // This just means that the directory doesn't contain any declared entrypoints.
+                    try {
+                        const packageJSON = JSON.parse(node_fs_1.default.readFileSync(node_path_1.default.join(dir, 'package.json'), 'utf8'));
+                        addEntryPointWithMapper(entrypoints, packageJSON['main'], dir);
+                        addEntryPointWithMapper(entrypoints, packageJSON['style'], dir);
+                    }
+                    catch (e) {
+                        try {
+                            const entrypointsJSON = JSON.parse(node_fs_1.default.readFileSync(node_path_1.default.join(dir, 'entrypoints.json'), 'utf8'));
+                            if (Array.isArray(entrypointsJSON)) {
+                                addEntryPointWithMapper(entrypoints, entrypointsJSON, dir);
+                            }
+                            else {
+                                for (const [name, config] of Object.entries(entrypointsJSON)) {
+                                    if (typeof config === 'string') {
+                                        entrypoints[name] = node_path_1.default.join(dir, config);
+                                    }
+                                    else if (Array.isArray(config)) {
+                                        entrypoints[name] = config.map(c => node_path_1.default.join(dir, c));
+                                    }
+                                    else {
+                                        if (typeof config.import === 'string') {
+                                            config.import = node_path_1.default.join(dir, config.import);
+                                        }
+                                        else {
+                                            config.import = config.import.map(c => node_path_1.default.join(dir, c));
+                                        }
+                                        entrypoints[name] = config;
+                                    }
+                                }
+                            }
+                        }
+                        catch (e) {
+                            // This just means that the directory doesn't contain any declared entrypoints.
+                        }
+                    }
                 }
-            }
-            return entrypoints.length === 0 ? undefined : entrypoints.map(entrypoint => node_path_1.default.join(dir, entrypoint));
-        })
-            .filter((entrypoint) => typeof entrypoint === 'string' && node_fs_1.default.existsSync(entrypoint));
-        const convertEntrypointsToObject = () => entrypoints.reduce((entry, entrypoint) => {
-            const parsedEntrypoint = node_path_1.default.parse(entrypoint);
-            return {
-                ...entry,
-                [node_path_1.default.join(node_path_1.default.basename(parsedEntrypoint.dir), parsedEntrypoint.name)]: { import: entrypoint }
-            };
-        }, {});
-        const firstPassBaseEntries = typeof baseEntry === 'function' ? baseEntry() : baseEntry;
-        return firstPassBaseEntries instanceof Promise ? firstPassBaseEntries.then(convertEntrypointsToObject) : convertEntrypointsToObject();
-    };
-    return webpackConfig;
+                return entrypoints;
+            }, {})
+        };
+    });
 }
 exports.default = default_1;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@plaudit/webpack-extensions",
-  "version": "0.0.22",
+  "version": "1.0.0",
   "scripts": {
     "prepublishOnly": "rm -rf build && mkdir build && tsc",
     "build": "tsc",
@@ -28,8 +28,8 @@
     "@wordpress/scripts": "^26.2.0",
     "autoprefixer": "^10.4.14",
     "clean-webpack-plugin": "^4.0.0",
-    "copy-webpack-plugin": "^11.0.0",
     "cssnano": "^6.0.0",
+    "eslint": "^8.38.0",
     "fork-ts-checker-webpack-plugin": "^8.0.0",
     "postcss": "^8.4.23",
     "postcss-calc": "^8.2.4",
@@ -54,6 +54,7 @@
     "webpack-sources": "^3.2.3"
   },
   "peerDependencies": {
+    "copy-webpack-plugin": "^11.0.0",
     "postcss-load-config": "^4.0.1",
     "postcss-loader": "^7.2.4",
     "webpack": "^5.80.0",