Skip to content

Webpack: malformed blocks entry names lead to wrong emitted paths #455

New issue
New issue
Open
Open
Webpack: malformed blocks entry names lead to wrong emitted paths#455
@tingeka

Description

@tingeka
tingeka
opened on Jul 18, 2025

Describe the bug

10up-toolkit scans the blocksDir for block.json files and uses the file path as the entry name, but it doesn't properly handle leading slashes when it drops the blocksDir from the path in entry.js#L77-80.

This leads to entries like:

{
  "/my-block/index.js": "/path/to/my-block/index.js"
}

The issue compounds because in entry.js#L21-L22, the filename is overridden to blocks/[name].js which results in the emitted file being named blocks//my-block/index.js.

I tried to fix this via Webpack plugins, but it constantly failed because the entry name are used as buildFiles key in output.js#L36-37.

There may be a way to handle this via a hook that have just the right timing, but I realized I was just monkey patching something that ultimately should be fixed upstream.

This happens only with blocks JS and CSS, and their .assets.php files.

For the time being, I just used patch-package because it was inconsequential enough. Nevertheless, this patch isn't thoroughly tested. I leave it here for reference:

diff --git a/node_modules/10up-toolkit/config/webpack/entry.js b/node_modules/10up-toolkit/config/webpack/entry.js
index b75cb99..442846f 100644
--- a/node_modules/10up-toolkit/config/webpack/entry.js
+++ b/node_modules/10up-toolkit/config/webpack/entry.js
@@ -77,7 +77,30 @@ module.exports = ({
 						const entryName = filepath
 							.replace(extname(filepath), '')
 							.replace(blocksSourceDirectory, '')
-							.replace(/\\/g, '/');
+							.replace(/\\/g, '/')
+							/** 
+							 * 
+							 * This patch is required to ensure that the entry name does not start with a slash.
+							 * 
+							 * 10up-toolkit scans the blocksDir for block.json files and uses the file path 
+							 * as the entry name, but it doesn't properly handle leading slashes.
+							 * This leads to entries like:
+							 * {
+							 *  "/my-block/index.js": "/path/to/my-block/index.js"
+							 * }
+							 * 
+							 * The issue compounds because in line 21/22, the filename is overridden to
+							 * `blocks/[name].js` which results in the emitted file being named
+							 * `blocks//my-block/index.js`:
+							 * 
+							 * I tried to fix this via plugins, but it constantly failed
+							 * because the entry name is used as buildFiles index in output.js.
+							 * There's probably a better way to do this, but I think the culprit comes from this.
+							 * 
+							 * This is a temporary fix until the toolkit is updated to handle this properly.
+							 *
+							*/
+							.replace(/^\//, ''); // remove leading slash
 
 						// Detects the proper file extension used in the defined source directory.
 						const [entryFilepath] = glob(

Steps to Reproduce

  1. Scaffold a test block in blocksDir path (./includes/blocks/, by default).
  2. Run npm run build
  3. Check the console for the paths of blocks JS/CSS emitted assets paths.

Screenshots, screen recording, code snippet

Image

Environment information

  • Device: Acer Aspire A515
  • OS: Fedora 42
  • Browser and version: Firefox 140.0.4

WordPress information

Site Health info: ### wp-core ###

version: 42
site_language: es_ES
user_language: es_ES
timezone: -03:00
permalink: /%category%/%postname%/
https_status: true
multisite: false
user_registration: 0
blog_public: 1
default_comment_status: open
environment_type: development
user_count: 22
dotorg_communication: true

wp-paths-sizes

wordpress_path: /var/www/html
wordpress_size: 637,75 MB (668726354 bytes)
uploads_path: /var/www/html/wp-content/uploads
uploads_size: 5,40 GB (5803567893 bytes)
themes_path: /var/www/html/wp-content/themes
themes_size: 220,38 MB (231084925 bytes)
plugins_path: /var/www/html/wp-content/plugins
plugins_size: 234,77 MB (246177876 bytes)
fonts_path: /var/www/html/wp-content/uploads/fonts
fonts_size: directory not found
database_size: 334,99 MB (351267038 bytes)
total_size: 6,80 GB (7300824086 bytes)

wp-active-theme

name: redacted Block Theme (redacted-block-theme)
version: 1.0.0
author: 10up
author_website: https://10up.com
parent_theme: none
theme_features: post-thumbnails, responsive-embeds, editor-styles, html5, automatic-feed-links, widgets-block-editor, block-templates, editor-style
theme_path: /var/www/html/wp-content/themes/redacted-block-theme
auto_update: Desactivado

wp-themes-inactive (2)

Twenty Twenty-Five: version: 1.0, author: el equipo de WordPress (latest version: 1.2), Actualizaciones automáticas desactivadas
Twenty Twenty-Four: version: 1.2, author: el equipo de WordPress (latest version: 1.3), Actualizaciones automáticas desactivadas

wp-mu-plugins (8)

redacted Models Scaffold: version: 0.1.0, author: Martín García
freesoul deactivate plugins [fdp]: version: 2.3.0, author: Jose Mortellaro
GridPane Block Username Enumeration: version: 0.1.0, author: GridPane
GridPane Disable XMLRPC: version: 0.1.0, author: Jeff Cleverley
GridPane Nginx Cache Purger: version: 1.0.0, author: Jeff Cleverley Jebat
GridPane Remove WP Version: version: 0.1.0, author: GridPane
WP CLI Login Command Server: version: 1.5, author: Evan Mattson
WP STAGING Optimizer: version: 1.5.9, author: WP STAGING

wp-plugins-active (4)

Query Monitor: version: 3.18.0, author: John Blackbourn, Actualizaciones automáticas desactivadas
Rank Math SEO: version: 1.0.240, author: Rank Math SEO (latest version: 1.0.249), Actualizaciones automáticas desactivadas
WordPress REST API Authentication: version: 3.6.3, author: miniOrange (latest version: 3.7.2), Actualizaciones automáticas desactivadas
WPvivid Backup Plugin: version: 0.9.112, author: WPvivid Backup & Migration (latest version: 0.9.117), Actualizaciones automáticas desactivadas

wp-media

image_editor: WP_Image_Editor_Imagick
imagick_module_version: 1691
imagemagick_version: ImageMagick 6.9.11-60 Q16 x86_64 2021-01-25 https://imagemagick.org
imagick_version: 3.8.0
file_uploads: 1
post_max_size: 100M
upload_max_filesize: 100M
max_effective_size: 100 MB
max_file_uploads: 20
imagick_limits:
imagick::RESOURCETYPE_AREA: 122 MB
imagick::RESOURCETYPE_DISK: 1073741824
imagick::RESOURCETYPE_FILE: 805306362
imagick::RESOURCETYPE_MAP: 512 MB
imagick::RESOURCETYPE_MEMORY: 256 MB
imagick::RESOURCETYPE_THREAD: 1
imagick::RESOURCETYPE_TIME: 9.2233720368548E+18
imagemagick_file_formats: 3FR, 3G2, 3GP, AAI, AI, APNG, ART, ARW, AVI, AVIF, AVS, BGR, BGRA, BGRO, BIE, BMP, BMP2, BMP3, BRF, CAL, CALS, CANVAS, CAPTION, CIN, CIP, CLIP, CMYK, CMYKA, CR2, CR3, CRW, CUR, CUT, DATA, DCM, DCR, DCX, DDS, DFONT, DJVU, DNG, DOT, DPX, DXT1, DXT5, EPDF, EPI, EPS, EPS2, EPS3, EPSF, EPSI, EPT, EPT2, EPT3, ERF, EXR, FAX, FILE, FITS, FRACTAL, FTP, FTS, G3, G4, GIF, GIF87, GRADIENT, GRAY, GRAYA, GROUP4, GV, H, HALD, HDR, HEIC, HISTOGRAM, HRZ, HTM, HTML, HTTP, HTTPS, ICB, ICO, ICON, IIQ, INFO, INLINE, IPL, ISOBRL, ISOBRL6, J2C, J2K, JBG, JBIG, JNG, JNX, JP2, JPC, JPE, JPEG, JPG, JPM, JPS, JPT, JSON, K25, KDC, LABEL, M2V, M4V, MAC, MAGICK, MAP, MASK, MAT, MATTE, MEF, MIFF, MKV, MNG, MONO, MOV, MP4, MPC, MPG, MRW, MSL, MSVG, MTV, MVG, NEF, NRW, NULL, ORF, OTB, OTF, PAL, PALM, PAM, PANGO, PATTERN, PBM, PCD, PCDS, PCL, PCT, PCX, PDB, PDF, PDFA, PEF, PES, PFA, PFB, PFM, PGM, PGX, PICON, PICT, PIX, PJPEG, PLASMA, PNG, PNG00, PNG24, PNG32, PNG48, PNG64, PNG8, PNM, POCKETMOD, PPM, PREVIEW, PS, PS2, PS3, PSB, PSD, PTIF, PWP, RADIAL-GRADIENT, RAF, RAS, RAW, RGB, RGBA, RGBO, RGF, RLA, RLE, RMF, RW2, SCR, SCT, SFW, SGI, SHTML, SIX, SIXEL, SPARSE-COLOR, SR2, SRF, STEGANO, SUN, SVG, SVGZ, TEXT, TGA, THUMBNAIL, TIFF, TIFF64, TILE, TIM, TTC, TTF, TXT, UBRL, UBRL6, UIL, UYVY, VDA, VICAR, VID, VIDEO, VIFF, VIPS, VST, WBMP, WEBM, WEBP, WMF, WMV, WMZ, WPG, X, X3F, XBM, XC, XCF, XPM, XPS, XV, XWD, YCbCr, YCbCrA, YUV
gd_version: 2.3.3
gd_formats: GIF, JPEG, PNG, WebP, BMP, AVIF, XPM
ghostscript_version: 10.00.0

wp-server

server_architecture: Linux 6.15.6-200.fc42.x86_64 x86_64
httpd_software: nginx/1.28.0
php_version: 8.3.21 64bit
php_sapi: fpm-fcgi
max_input_variables: 5000
time_limit: 600
memory_limit: 1024M
max_input_time: -1
upload_max_filesize: 100M
php_post_max_size: 100M
curl_version: 7.88.1 OpenSSL/3.0.15
suhosin: false
imagick_availability: true
pretty_permalinks: true
current: 2025-07-18T21:01:36+00:00
utc-time: Friday, 18-Jul-25 21:01:36 UTC
server-time: 2025-07-18T18:01:32-03:00

wp-database

extension: mysqli
server_version: 10.11.11-MariaDB-ubu2204-log
client_version: mysqlnd 8.3.21
max_allowed_packet: 268435456
max_connections: 100

wp-constants

WP_HOME: https://redacted.ddev.site
WP_SITEURL: https://redacted.ddev.site/
WP_CONTENT_DIR: /var/www/html/wp-content
WP_PLUGIN_DIR: /var/www/html/wp-content/plugins
WP_MEMORY_LIMIT: 40M
WP_MAX_MEMORY_LIMIT: 1024M
WP_DEBUG: true
WP_DEBUG_DISPLAY: false
WP_DEBUG_LOG: true
SCRIPT_DEBUG: true
WP_CACHE: false
CONCATENATE_SCRIPTS: undefined
COMPRESS_SCRIPTS: undefined
COMPRESS_CSS: undefined
WP_ENVIRONMENT_TYPE: development
WP_DEVELOPMENT_MODE: undefined
DB_CHARSET: utf8
DB_COLLATE: undefined

wp-filesystem

wordpress: writable
wp-content: writable
uploads: writable
plugins: writable
themes: writable
fonts: not writable
mu-plugins: writable

Code of Conduct

  • I agree to follow this project's Code of Conduct

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions