@plaudit/webpack-extensions 2.50.0 → 2.52.0

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

@@ -8,6 +8,7 @@ interface AdvancedOutputConfig {
     directoryLayout?: 'blocks' | 'extensions' | 'plain';
     assumeGlobalizedPlauditLibraries?: boolean;
     externalize?: Required<Configuration>['output']['library'];
+    bundleAnalyzer?: boolean;
 }
 type PlauditWordpressWebpackConfig = {
     standaloneBlocks?: boolean;
@@ -23,6 +24,7 @@ type PlauditWordpressWebpackConfig = {
     processTranslationConfigs?: boolean;
     combineAssetMetadata?: boolean;
     useWebpackResourceFiltering?: boolean;
+    outputDir?: string;
 };
 declare const _default: (config: PlauditWordpressWebpackConfig, webpackConfig?: Configuration[] | Configuration) => Configuration[];
 export = _default;

package/build/wordpress-scripts-wrapper.js

@@ -21,7 +21,8 @@ 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 joinPossiblyAbsolutePaths(...paths) {
-    return paths.reduce((res, p) => !res || node_path_1.default.isAbsolute(p) ? p : node_path_1.default.join(res, p), '') || '.';
+    return paths.filter((p) => !!p)
+        .reduce((res, p) => !res || node_path_1.default.isAbsolute(p) ? p : node_path_1.default.join(res, p), '') || '.';
 }
 function mapToRealEntrypoints(entrypoint, dir, mapper = (entrypoint) => entrypoint, lazyDependent, associatedQuery) {
     return (Array.isArray(entrypoint) ? entrypoint : [entrypoint])
@@ -167,7 +168,7 @@ function replaceDefaultURLProcessing(useWebpackResourceFiltering) {
 }
 function injectPostcssConfigOverrides(rules, variables, postcssFunctionsConfig, verbose) {
     const postcssConfig = (0, static_configs_1.postcssConfigBuilder)(verbose, name => variables(name) ?? (name === 'ENV' ? '' : undefined), postcssFunctionsConfig);
-    return rules.map(rule => {
+    return recursivelyAddParentDirectoryStepToImagesAndFonts(rules.map(rule => {
         if (rule && typeof rule === 'object') {
             if (Array.isArray(rule.use)) {
                 for (const useItem of rule.use) {
@@ -190,15 +191,32 @@ function injectPostcssConfigOverrides(rules, variables, postcssFunctionsConfig,
                 }
             }
             if (rule.type === "asset/inline" && rule.test instanceof RegExp && rule.issuer instanceof RegExp && rule.test.test("test.svg") && rule.issuer.test("test.pcss")) {
-                rule.type = "asset/resource";
-                rule.generator = { filename: "images/[name].[hash:8][ext]" };
+                const { type: originalType, ...commonRuleParams } = rule;
+                return {
+                    ...commonRuleParams,
+                    oneOf: [
+                        { type: originalType, resourceQuery: /string|inline/i },
+                        { type: "asset/resource", generator: { filename: "images/[name].[hash:8][ext]" } }
+                    ]
+                };
             }
+        }
+        return rule;
+    }));
+}
+function recursivelyAddParentDirectoryStepToImagesAndFonts(rules) {
+    return rules.map(rule => {
+        if (rule && typeof rule === 'object') {
             if (typeof rule.generator === 'object') {
                 const ruleGeneratorFilename = rule.generator["filename"];
                 if (typeof ruleGeneratorFilename === 'string' && (ruleGeneratorFilename.startsWith("images/") || ruleGeneratorFilename.startsWith("fonts/"))) {
                     rule.generator["filename"] = `../${ruleGeneratorFilename}`;
+                    rule = { ...rule, generator: { ...rule.generator, filename: `../${ruleGeneratorFilename}` } };
                 }
             }
+            if (rule.oneOf) {
+                rule = { ...rule, oneOf: recursivelyAddParentDirectoryStepToImagesAndFonts(rule.oneOf) };
+            }
         }
         return rule;
     });
@@ -298,6 +316,9 @@ function processIndividualWebpackConfig(config, webpackConfig, sources, sharedCa
         })
             ?? [];
         plugins.splice(0, 0, new PackageConfigSanityChecker_1.PackageConfigSanityChecker());
+        if (typeof dest !== 'string' && dest.bundleAnalyzer) {
+            plugins.splice(0, 0, new (require("webpack-bundle-analyzer").BundleAnalyzerPlugin)({ analyzerMode: 'static' }));
+        }
         if (process.env["NO_TS_CHECKER"] !== "true") {
             const include = (Array.isArray(srcRoot) ? srcRoot : [srcRoot])
                 .filter(sr => node_path_1.default.extname(sr).length === 0 || scriptOrStyleTest(sr, scriptExtension) === "script")
@@ -467,7 +488,7 @@ function processIndividualWebpackConfig(config, webpackConfig, sources, sharedCa
                 [baseDest.includes('.') ? node_path_1.default.basename(baseDest, node_path_1.default.extname(baseDest)) : baseDest]: srcRoot
             });
         }
-        const outPath = joinPossiblyAbsolutePaths(process.cwd(), srcIsDirectory ? destPath : node_path_1.default.dirname(destPath));
+        const outPath = joinPossiblyAbsolutePaths(process.cwd(), config.outputDir, srcIsDirectory ? destPath : node_path_1.default.dirname(destPath));
         let publicPath = webpackConfig.output?.publicPath;
         if (isInTheme()) {
             let prefix = process.cwd();
@@ -586,7 +607,7 @@ function processIndividualWebpackConfig(config, webpackConfig, sources, sharedCa
 }
 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 = {}, externals, assumeGlobalizedPlauditLibraries = true, processTranslationConfigs = true, combineAssetMetadata = true, useWebpackResourceFiltering = true } = config;
+    const { standaloneBlocks = false, stats = 'errors-warnings', variables: rawVariables, verbose = process.argv.includes('--verbose') || process.env['VERBOSE'] === 'true', postcss = {}, externals, assumeGlobalizedPlauditLibraries = true, processTranslationConfigs = true, combineAssetMetadata = true, useWebpackResourceFiltering = true, outputDir = "" } = config;
     let variablesFilePath = undefined;
     const currentVariables = rawVariables ?? {};
     if (!rawVariables) {
@@ -594,7 +615,7 @@ module.exports = function (config, webpackConfig = require("@wordpress/scripts/c
     }
     const cfg = {
         currentVariables, postcss, standaloneBlocks, stats, variablesFilePath, verbose, externals, assumeGlobalizedPlauditLibraries, processTranslationConfigs, combineAssetMetadata,
-        useWebpackResourceFiltering
+        useWebpackResourceFiltering, outputDir
     };
     const sources = Array.isArray(config.src) ? config.src.map(s => [s, s]) : Object.entries(config.src);
     const sharedCache = {};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@plaudit/webpack-extensions",
-  "version": "2.50.0",
+  "version": "2.52.0",
   "license": "UNLICENSED",
   "files": [
     "/build"
@@ -26,7 +26,8 @@
     "postcss-load-config": "^4.0.2",
     "postcss-loader": "^7.3.4",
     "ts-node": "^10.9.2",
-    "typescript": "^5.8.3"
+    "typescript": "^5.8.3",
+    "webpack-bundle-analyzer": "^4.10.2"
   },
   "dependencies": {
     "@plaudit/postcss-color-function": "^5.0.0",