From 5d13ba482cb252300071883de618aa3e831f0a91 Mon Sep 17 00:00:00 2001 From: Jon Surrell Date: Wed, 4 Sep 2024 17:23:34 +0200 Subject: [PATCH 01/17] Replace "interactivity" build with "script-modules" This is a general script-modules build, not interactivity specific. --- lib/interactivity-api.php | 4 ++-- packages/block-library/src/file/index.php | 2 +- packages/block-library/src/image/index.php | 2 +- .../block-library/src/navigation/index.php | 2 +- packages/block-library/src/query/index.php | 2 +- packages/block-library/src/search/index.php | 2 +- .../{interactivity.js => script-modules.js} | 22 ++++++++++--------- webpack.config.js | 4 ++-- 8 files changed, 21 insertions(+), 19 deletions(-) rename tools/webpack/{interactivity.js => script-modules.js} (66%) diff --git a/lib/interactivity-api.php b/lib/interactivity-api.php index 6f04a3ba8fc927..5e5d2006c22a97 100644 --- a/lib/interactivity-api.php +++ b/lib/interactivity-api.php @@ -16,14 +16,14 @@ function gutenberg_reregister_interactivity_script_modules() { wp_register_script_module( '@wordpress/interactivity', - gutenberg_url( '/build/interactivity/' . ( SCRIPT_DEBUG ? 'debug.min.js' : 'index.min.js' ) ), + gutenberg_url( '/build/script-modules/interactivity/' . ( SCRIPT_DEBUG ? 'debug.min.js' : 'index.min.js' ) ), array(), $default_version ); wp_register_script_module( '@wordpress/interactivity-router', - gutenberg_url( '/build/interactivity/router.min.js' ), + gutenberg_url( '/build/script-modules/interactivity/router.min.js' ), array( '@wordpress/interactivity' ), $default_version ); diff --git a/packages/block-library/src/file/index.php b/packages/block-library/src/file/index.php index 87910f0e66a0cf..cbe5f63d6716e7 100644 --- a/packages/block-library/src/file/index.php +++ b/packages/block-library/src/file/index.php @@ -21,7 +21,7 @@ function render_block_core_file( $attributes, $content ) { if ( ! empty( $attributes['displayPreview'] ) ) { $suffix = wp_scripts_get_suffix(); if ( defined( 'IS_GUTENBERG_PLUGIN' ) && IS_GUTENBERG_PLUGIN ) { - $module_url = gutenberg_url( '/build/interactivity/file.min.js' ); + $module_url = gutenberg_url( '/build/script-modules/block-library/file.min.js' ); } wp_register_script_module( diff --git a/packages/block-library/src/image/index.php b/packages/block-library/src/image/index.php index 75f0d404e4820c..a64ab8215c48bc 100644 --- a/packages/block-library/src/image/index.php +++ b/packages/block-library/src/image/index.php @@ -72,7 +72,7 @@ function render_block_core_image( $attributes, $content, $block ) { ) { $suffix = wp_scripts_get_suffix(); if ( defined( 'IS_GUTENBERG_PLUGIN' ) && IS_GUTENBERG_PLUGIN ) { - $module_url = gutenberg_url( '/build/interactivity/image.min.js' ); + $module_url = gutenberg_url( '/build/script-modules/block-library/image.min.js' ); } wp_register_script_module( diff --git a/packages/block-library/src/navigation/index.php b/packages/block-library/src/navigation/index.php index ccadd5c4a222d4..e3406659573551 100644 --- a/packages/block-library/src/navigation/index.php +++ b/packages/block-library/src/navigation/index.php @@ -624,7 +624,7 @@ private static function handle_view_script_module_loading( $attributes, $block, if ( static::is_interactive( $attributes, $inner_blocks ) ) { $suffix = wp_scripts_get_suffix(); if ( defined( 'IS_GUTENBERG_PLUGIN' ) && IS_GUTENBERG_PLUGIN ) { - $module_url = gutenberg_url( '/build/interactivity/navigation.min.js' ); + $module_url = gutenberg_url( '/build/script-modules/block-library/navigation.min.js' ); } wp_register_script_module( diff --git a/packages/block-library/src/query/index.php b/packages/block-library/src/query/index.php index 6cc57dc08388c6..95eacdbcf2c58e 100644 --- a/packages/block-library/src/query/index.php +++ b/packages/block-library/src/query/index.php @@ -26,7 +26,7 @@ function render_block_core_query( $attributes, $content, $block ) { if ( $is_interactive ) { $suffix = wp_scripts_get_suffix(); if ( defined( 'IS_GUTENBERG_PLUGIN' ) && IS_GUTENBERG_PLUGIN ) { - $module_url = gutenberg_url( '/build/interactivity/query.min.js' ); + $module_url = gutenberg_url( '/build/script-modules/block-library/query.min.js' ); } wp_register_script_module( diff --git a/packages/block-library/src/search/index.php b/packages/block-library/src/search/index.php index 39b8591c86600f..df36892ae56dd0 100644 --- a/packages/block-library/src/search/index.php +++ b/packages/block-library/src/search/index.php @@ -82,7 +82,7 @@ function render_block_core_search( $attributes ) { if ( $is_expandable_searchfield ) { $suffix = wp_scripts_get_suffix(); if ( defined( 'IS_GUTENBERG_PLUGIN' ) && IS_GUTENBERG_PLUGIN ) { - $module_url = gutenberg_url( '/build/interactivity/search.min.js' ); + $module_url = gutenberg_url( '/build/script-modules/block-library/search.min.js' ); } wp_register_script_module( diff --git a/tools/webpack/interactivity.js b/tools/webpack/script-modules.js similarity index 66% rename from tools/webpack/interactivity.js rename to tools/webpack/script-modules.js index 7f5c7f64a09d7f..2b1ccc3d00854f 100644 --- a/tools/webpack/interactivity.js +++ b/tools/webpack/script-modules.js @@ -15,23 +15,25 @@ const { baseConfig, plugins } = require( './shared' ); module.exports = { ...baseConfig, - name: 'interactivity', + name: 'script-modules', entry: { - index: './packages/interactivity', - debug: './packages/interactivity/src/debug', - router: './packages/interactivity-router', - navigation: './packages/block-library/src/navigation/view.js', - query: './packages/block-library/src/query/view.js', - image: './packages/block-library/src/image/view.js', - file: './packages/block-library/src/file/view.js', - search: './packages/block-library/src/search/view.js', + 'interactivity/index': './packages/interactivity', + 'interactivity/debug': './packages/interactivity/src/debug', + 'interactivity/router': './packages/interactivity-router', + + 'block-library/file': './packages/block-library/src/file/view.js', + 'block-library/image': './packages/block-library/src/image/view.js', + 'block-library/navigation': + './packages/block-library/src/navigation/view.js', + 'block-library/query': './packages/block-library/src/query/view.js', + 'block-library/search': './packages/block-library/src/search/view.js', }, experiments: { outputModule: true, }, output: { devtoolNamespace: 'wp', - filename: './build/interactivity/[name].min.js', + filename: './build/script-modules/[name].min.js', library: { type: 'module', }, diff --git a/webpack.config.js b/webpack.config.js index 45b22cc5354dcf..51889b06d1eb44 100644 --- a/webpack.config.js +++ b/webpack.config.js @@ -3,13 +3,13 @@ */ const blocksConfig = require( './tools/webpack/blocks' ); const developmentConfigs = require( './tools/webpack/development' ); -const interactivity = require( './tools/webpack/interactivity' ); +const scriptModules = require( './tools/webpack/script-modules' ); const packagesConfig = require( './tools/webpack/packages' ); const vendorsConfig = require( './tools/webpack/vendors' ); module.exports = [ ...blocksConfig, - interactivity, + scriptModules, packagesConfig, ...developmentConfigs, ...vendorsConfig, From aa536c9b60546bc85523754fa46e11c47087819e Mon Sep 17 00:00:00 2001 From: Jon Surrell Date: Wed, 4 Sep 2024 17:48:03 +0200 Subject: [PATCH 02/17] Prepare webpack script-modules to build wp-module field --- packages/interactivity-router/package.json | 1 + packages/interactivity/package.json | 1 + tools/webpack/script-modules.js | 2 ++ 3 files changed, 4 insertions(+) diff --git a/packages/interactivity-router/package.json b/packages/interactivity-router/package.json index 53b68068c528a0..cc38acc155e484 100644 --- a/packages/interactivity-router/package.json +++ b/packages/interactivity-router/package.json @@ -24,6 +24,7 @@ }, "main": "build/index.js", "module": "build-module/index.js", + "wp-module": "build-module/index.js", "react-native": "src/index", "types": "build-types", "dependencies": { diff --git a/packages/interactivity/package.json b/packages/interactivity/package.json index 3e29d9aabeeab9..33576001176b57 100644 --- a/packages/interactivity/package.json +++ b/packages/interactivity/package.json @@ -24,6 +24,7 @@ }, "main": "build/index.js", "module": "build-module/index.js", + "wp-module": "build-module/index.js", "react-native": "src/index", "types": "build-types", "dependencies": { diff --git a/tools/webpack/script-modules.js b/tools/webpack/script-modules.js index 2b1ccc3d00854f..f0469e1e4517bc 100644 --- a/tools/webpack/script-modules.js +++ b/tools/webpack/script-modules.js @@ -41,9 +41,11 @@ module.exports = { environment: { module: true }, module: true, chunkFormat: 'module', + asyncChunks: false, }, resolve: { extensions: [ '.js', '.ts', '.tsx' ], + mainFields: [ 'wp-module' ], }, module: { rules: [ From 3d9e13d8f0bd5ef5fd40b45f3e1250d52988c286 Mon Sep 17 00:00:00 2001 From: Jon Surrell Date: Thu, 5 Sep 2024 19:54:24 +0200 Subject: [PATCH 03/17] Move script-module assets to build-module directory --- lib/interactivity-api.php | 4 ++-- packages/block-library/src/file/index.php | 2 +- packages/block-library/src/image/index.php | 2 +- packages/block-library/src/navigation/index.php | 2 +- packages/block-library/src/query/index.php | 2 +- packages/block-library/src/search/index.php | 2 +- tools/webpack/script-modules.js | 8 ++++---- 7 files changed, 11 insertions(+), 11 deletions(-) diff --git a/lib/interactivity-api.php b/lib/interactivity-api.php index 5e5d2006c22a97..629986630cf9d8 100644 --- a/lib/interactivity-api.php +++ b/lib/interactivity-api.php @@ -16,14 +16,14 @@ function gutenberg_reregister_interactivity_script_modules() { wp_register_script_module( '@wordpress/interactivity', - gutenberg_url( '/build/script-modules/interactivity/' . ( SCRIPT_DEBUG ? 'debug.min.js' : 'index.min.js' ) ), + gutenberg_url( '/build-module/' . ( SCRIPT_DEBUG ? 'interactivity-debug.min.js' : 'interactivity.min.js' ) ), array(), $default_version ); wp_register_script_module( '@wordpress/interactivity-router', - gutenberg_url( '/build/script-modules/interactivity/router.min.js' ), + gutenberg_url( '/build-module/interactivity-router.min.js' ), array( '@wordpress/interactivity' ), $default_version ); diff --git a/packages/block-library/src/file/index.php b/packages/block-library/src/file/index.php index cbe5f63d6716e7..d0b22b6a7bad17 100644 --- a/packages/block-library/src/file/index.php +++ b/packages/block-library/src/file/index.php @@ -21,7 +21,7 @@ function render_block_core_file( $attributes, $content ) { if ( ! empty( $attributes['displayPreview'] ) ) { $suffix = wp_scripts_get_suffix(); if ( defined( 'IS_GUTENBERG_PLUGIN' ) && IS_GUTENBERG_PLUGIN ) { - $module_url = gutenberg_url( '/build/script-modules/block-library/file.min.js' ); + $module_url = gutenberg_url( '/build-module/block-library/file.min.js' ); } wp_register_script_module( diff --git a/packages/block-library/src/image/index.php b/packages/block-library/src/image/index.php index a64ab8215c48bc..861b257825ca22 100644 --- a/packages/block-library/src/image/index.php +++ b/packages/block-library/src/image/index.php @@ -72,7 +72,7 @@ function render_block_core_image( $attributes, $content, $block ) { ) { $suffix = wp_scripts_get_suffix(); if ( defined( 'IS_GUTENBERG_PLUGIN' ) && IS_GUTENBERG_PLUGIN ) { - $module_url = gutenberg_url( '/build/script-modules/block-library/image.min.js' ); + $module_url = gutenberg_url( '/build-module/block-library/image.min.js' ); } wp_register_script_module( diff --git a/packages/block-library/src/navigation/index.php b/packages/block-library/src/navigation/index.php index e3406659573551..5ab6b1aff4e6c3 100644 --- a/packages/block-library/src/navigation/index.php +++ b/packages/block-library/src/navigation/index.php @@ -624,7 +624,7 @@ private static function handle_view_script_module_loading( $attributes, $block, if ( static::is_interactive( $attributes, $inner_blocks ) ) { $suffix = wp_scripts_get_suffix(); if ( defined( 'IS_GUTENBERG_PLUGIN' ) && IS_GUTENBERG_PLUGIN ) { - $module_url = gutenberg_url( '/build/script-modules/block-library/navigation.min.js' ); + $module_url = gutenberg_url( '/build-module/block-library/navigation.min.js' ); } wp_register_script_module( diff --git a/packages/block-library/src/query/index.php b/packages/block-library/src/query/index.php index 95eacdbcf2c58e..7bdfcbd13d46d0 100644 --- a/packages/block-library/src/query/index.php +++ b/packages/block-library/src/query/index.php @@ -26,7 +26,7 @@ function render_block_core_query( $attributes, $content, $block ) { if ( $is_interactive ) { $suffix = wp_scripts_get_suffix(); if ( defined( 'IS_GUTENBERG_PLUGIN' ) && IS_GUTENBERG_PLUGIN ) { - $module_url = gutenberg_url( '/build/script-modules/block-library/query.min.js' ); + $module_url = gutenberg_url( '/build-module/block-library/query.min.js' ); } wp_register_script_module( diff --git a/packages/block-library/src/search/index.php b/packages/block-library/src/search/index.php index df36892ae56dd0..439fa28848be99 100644 --- a/packages/block-library/src/search/index.php +++ b/packages/block-library/src/search/index.php @@ -82,7 +82,7 @@ function render_block_core_search( $attributes ) { if ( $is_expandable_searchfield ) { $suffix = wp_scripts_get_suffix(); if ( defined( 'IS_GUTENBERG_PLUGIN' ) && IS_GUTENBERG_PLUGIN ) { - $module_url = gutenberg_url( '/build/script-modules/block-library/search.min.js' ); + $module_url = gutenberg_url( '/build-module/block-library/search.min.js' ); } wp_register_script_module( diff --git a/tools/webpack/script-modules.js b/tools/webpack/script-modules.js index f0469e1e4517bc..df382b6c72432b 100644 --- a/tools/webpack/script-modules.js +++ b/tools/webpack/script-modules.js @@ -17,9 +17,9 @@ module.exports = { ...baseConfig, name: 'script-modules', entry: { - 'interactivity/index': './packages/interactivity', - 'interactivity/debug': './packages/interactivity/src/debug', - 'interactivity/router': './packages/interactivity-router', + interactivity: './packages/interactivity', + 'interactivity-debug': './packages/interactivity/src/debug', + 'interactivity-router': './packages/interactivity-router', 'block-library/file': './packages/block-library/src/file/view.js', 'block-library/image': './packages/block-library/src/image/view.js', @@ -33,7 +33,7 @@ module.exports = { }, output: { devtoolNamespace: 'wp', - filename: './build/script-modules/[name].min.js', + filename: './build-module/[name].min.js', library: { type: 'module', }, From e5972f771e9bbcd29558d9199793f6b718adc56b Mon Sep 17 00:00:00 2001 From: Jon Surrell Date: Thu, 5 Sep 2024 21:00:30 +0200 Subject: [PATCH 04/17] Make bundle-size workflow aware of build-module dir --- .github/workflows/bundle-size.yml | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/.github/workflows/bundle-size.yml b/.github/workflows/bundle-size.yml index 6106eee492c32a..499a2c020255cb 100644 --- a/.github/workflows/bundle-size.yml +++ b/.github/workflows/bundle-size.yml @@ -52,5 +52,5 @@ jobs: - uses: preactjs/compressed-size-action@f780fd104362cfce9e118f9198df2ee37d12946c # v2.6.0 with: repo-token: '${{ secrets.GITHUB_TOKEN }}' - pattern: '{build/**/*.min.js,build/**/*.css}' + pattern: '{build/**/*.min.js,build/**/*.css,build-module/**/*.min.js}' clean-script: 'distclean' From e3b2be7ac71d31599983d1a779a65d9b49171daf Mon Sep 17 00:00:00 2001 From: Jon Surrell Date: Tue, 10 Sep 2024 11:19:06 +0200 Subject: [PATCH 05/17] Use wp-script-module main field This better aligns with "Script Modules" naming in Core. --- packages/interactivity-router/package.json | 2 +- packages/interactivity/package.json | 2 +- tools/webpack/script-modules.js | 2 +- 3 files changed, 3 insertions(+), 3 deletions(-) diff --git a/packages/interactivity-router/package.json b/packages/interactivity-router/package.json index cc38acc155e484..cb920bae7ec2b0 100644 --- a/packages/interactivity-router/package.json +++ b/packages/interactivity-router/package.json @@ -24,7 +24,7 @@ }, "main": "build/index.js", "module": "build-module/index.js", - "wp-module": "build-module/index.js", + "wp-script-module": "build-module/index.js", "react-native": "src/index", "types": "build-types", "dependencies": { diff --git a/packages/interactivity/package.json b/packages/interactivity/package.json index 33576001176b57..9ece9d7e9ac0de 100644 --- a/packages/interactivity/package.json +++ b/packages/interactivity/package.json @@ -24,7 +24,7 @@ }, "main": "build/index.js", "module": "build-module/index.js", - "wp-module": "build-module/index.js", + "wp-script-module": "build-module/index.js", "react-native": "src/index", "types": "build-types", "dependencies": { diff --git a/tools/webpack/script-modules.js b/tools/webpack/script-modules.js index df382b6c72432b..000acdb0e7aeaf 100644 --- a/tools/webpack/script-modules.js +++ b/tools/webpack/script-modules.js @@ -45,7 +45,7 @@ module.exports = { }, resolve: { extensions: [ '.js', '.ts', '.tsx' ], - mainFields: [ 'wp-module' ], + mainFields: [ 'wp-script-module' ], }, module: { rules: [ From bef8955fb4de52710dc5d8fc0ae3aea4250d1c83 Mon Sep 17 00:00:00 2001 From: Jon Surrell Date: Tue, 10 Sep 2024 11:42:05 +0200 Subject: [PATCH 06/17] Try wp-script-module-exports approach This custom "exports" setup allows multiple entrypoints while maintaining a custom "WordPress Script Modules" setup. This is helpful for packages like interactivity and block-library that have several script modules to build. --- packages/block-library/package.json | 7 +++++++ packages/interactivity-router/package.json | 4 +++- packages/interactivity/package.json | 5 ++++- tools/webpack/script-modules.js | 19 ++++++++++--------- 4 files changed, 24 insertions(+), 11 deletions(-) diff --git a/packages/block-library/package.json b/packages/block-library/package.json index 4d0212490858c9..0d39b6f55c857c 100644 --- a/packages/block-library/package.json +++ b/packages/block-library/package.json @@ -30,6 +30,13 @@ "src/**/*.scss", "{src,build,build-module}/*/init.js" ], + "wp-script-module-exports": { + "./file/view": "./build-module/file/view.js", + "./image/view": "./build-module/image/view.js", + "./navigation/view": "./build-module/navigation/view.js", + "./query/view": "./build-module/query/view.js", + "./search/view": "./build-module/search/view.js" + }, "dependencies": { "@babel/runtime": "^7.16.0", "@wordpress/a11y": "file:../a11y", diff --git a/packages/interactivity-router/package.json b/packages/interactivity-router/package.json index cb920bae7ec2b0..8f27788f7cb157 100644 --- a/packages/interactivity-router/package.json +++ b/packages/interactivity-router/package.json @@ -24,9 +24,11 @@ }, "main": "build/index.js", "module": "build-module/index.js", - "wp-script-module": "build-module/index.js", "react-native": "src/index", "types": "build-types", + "wp-script-module-exports": { + ".": "./build-module/index.js" + }, "dependencies": { "@wordpress/interactivity": "file:../interactivity" }, diff --git a/packages/interactivity/package.json b/packages/interactivity/package.json index 9ece9d7e9ac0de..05b83860ef271a 100644 --- a/packages/interactivity/package.json +++ b/packages/interactivity/package.json @@ -24,9 +24,12 @@ }, "main": "build/index.js", "module": "build-module/index.js", - "wp-script-module": "build-module/index.js", "react-native": "src/index", "types": "build-types", + "wp-script-module-exports": { + ".": "./build-module/index.js", + "./debug": "./build-module/debug.js" + }, "dependencies": { "@preact/signals": "^1.2.2", "preact": "^10.19.3" diff --git a/tools/webpack/script-modules.js b/tools/webpack/script-modules.js index 000acdb0e7aeaf..97e03d990b34ca 100644 --- a/tools/webpack/script-modules.js +++ b/tools/webpack/script-modules.js @@ -17,16 +17,17 @@ module.exports = { ...baseConfig, name: 'script-modules', entry: { - interactivity: './packages/interactivity', - 'interactivity-debug': './packages/interactivity/src/debug', + 'interactivity/index': './packages/interactivity', + 'interactivity/debug': './packages/interactivity/debug', + 'interactivity-router': './packages/interactivity-router', - 'block-library/file': './packages/block-library/src/file/view.js', - 'block-library/image': './packages/block-library/src/image/view.js', - 'block-library/navigation': - './packages/block-library/src/navigation/view.js', - 'block-library/query': './packages/block-library/src/query/view.js', - 'block-library/search': './packages/block-library/src/search/view.js', + 'block-library/file/view': './packages/block-library/file/view', + 'block-library/image/view': './packages/block-library/image/view', + 'block-library/navigation/view': + './packages/block-library/navigation/view', + 'block-library/query/view': './packages/block-library/query/view', + 'block-library/search/view': './packages/block-library/search/view', }, experiments: { outputModule: true, @@ -45,7 +46,7 @@ module.exports = { }, resolve: { extensions: [ '.js', '.ts', '.tsx' ], - mainFields: [ 'wp-script-module' ], + exportsFields: [ 'wp-script-module-exports', 'exports' ], }, module: { rules: [ From 3e90adc2ce916980ff53d6afb3025063b14c0bc1 Mon Sep 17 00:00:00 2001 From: Jon Surrell Date: Tue, 10 Sep 2024 11:53:06 +0200 Subject: [PATCH 07/17] Update script module registration accordingly --- lib/interactivity-api.php | 2 +- packages/block-library/src/file/index.php | 2 +- packages/block-library/src/image/index.php | 2 +- packages/block-library/src/navigation/index.php | 2 +- packages/block-library/src/query/index.php | 2 +- packages/block-library/src/search/index.php | 2 +- 6 files changed, 6 insertions(+), 6 deletions(-) diff --git a/lib/interactivity-api.php b/lib/interactivity-api.php index 629986630cf9d8..f7f158cac1272f 100644 --- a/lib/interactivity-api.php +++ b/lib/interactivity-api.php @@ -16,7 +16,7 @@ function gutenberg_reregister_interactivity_script_modules() { wp_register_script_module( '@wordpress/interactivity', - gutenberg_url( '/build-module/' . ( SCRIPT_DEBUG ? 'interactivity-debug.min.js' : 'interactivity.min.js' ) ), + gutenberg_url( '/build-module/' . ( SCRIPT_DEBUG ? 'interactivity/debug.min.js' : 'interactivity/index.min.js' ) ), array(), $default_version ); diff --git a/packages/block-library/src/file/index.php b/packages/block-library/src/file/index.php index d0b22b6a7bad17..85cc840201da59 100644 --- a/packages/block-library/src/file/index.php +++ b/packages/block-library/src/file/index.php @@ -21,7 +21,7 @@ function render_block_core_file( $attributes, $content ) { if ( ! empty( $attributes['displayPreview'] ) ) { $suffix = wp_scripts_get_suffix(); if ( defined( 'IS_GUTENBERG_PLUGIN' ) && IS_GUTENBERG_PLUGIN ) { - $module_url = gutenberg_url( '/build-module/block-library/file.min.js' ); + $module_url = gutenberg_url( '/build-module/block-library/file/view.min.js' ); } wp_register_script_module( diff --git a/packages/block-library/src/image/index.php b/packages/block-library/src/image/index.php index 861b257825ca22..abbb03c0952452 100644 --- a/packages/block-library/src/image/index.php +++ b/packages/block-library/src/image/index.php @@ -72,7 +72,7 @@ function render_block_core_image( $attributes, $content, $block ) { ) { $suffix = wp_scripts_get_suffix(); if ( defined( 'IS_GUTENBERG_PLUGIN' ) && IS_GUTENBERG_PLUGIN ) { - $module_url = gutenberg_url( '/build-module/block-library/image.min.js' ); + $module_url = gutenberg_url( '/build-module/block-library/image/view.min.js' ); } wp_register_script_module( diff --git a/packages/block-library/src/navigation/index.php b/packages/block-library/src/navigation/index.php index 5ab6b1aff4e6c3..ec72b03b6906f0 100644 --- a/packages/block-library/src/navigation/index.php +++ b/packages/block-library/src/navigation/index.php @@ -624,7 +624,7 @@ private static function handle_view_script_module_loading( $attributes, $block, if ( static::is_interactive( $attributes, $inner_blocks ) ) { $suffix = wp_scripts_get_suffix(); if ( defined( 'IS_GUTENBERG_PLUGIN' ) && IS_GUTENBERG_PLUGIN ) { - $module_url = gutenberg_url( '/build-module/block-library/navigation.min.js' ); + $module_url = gutenberg_url( '/build-module/block-library/navigation/view.min.js' ); } wp_register_script_module( diff --git a/packages/block-library/src/query/index.php b/packages/block-library/src/query/index.php index 7bdfcbd13d46d0..d10db26529854e 100644 --- a/packages/block-library/src/query/index.php +++ b/packages/block-library/src/query/index.php @@ -26,7 +26,7 @@ function render_block_core_query( $attributes, $content, $block ) { if ( $is_interactive ) { $suffix = wp_scripts_get_suffix(); if ( defined( 'IS_GUTENBERG_PLUGIN' ) && IS_GUTENBERG_PLUGIN ) { - $module_url = gutenberg_url( '/build-module/block-library/query.min.js' ); + $module_url = gutenberg_url( '/build-module/block-library/query/view.min.js' ); } wp_register_script_module( diff --git a/packages/block-library/src/search/index.php b/packages/block-library/src/search/index.php index 439fa28848be99..fb09cdd36406e8 100644 --- a/packages/block-library/src/search/index.php +++ b/packages/block-library/src/search/index.php @@ -82,7 +82,7 @@ function render_block_core_search( $attributes ) { if ( $is_expandable_searchfield ) { $suffix = wp_scripts_get_suffix(); if ( defined( 'IS_GUTENBERG_PLUGIN' ) && IS_GUTENBERG_PLUGIN ) { - $module_url = gutenberg_url( '/build-module/block-library/search.min.js' ); + $module_url = gutenberg_url( '/build-module/block-library/search/view.min.js' ); } wp_register_script_module( From 5080eb25af431f754423fe7c9b0096a39055f916 Mon Sep 17 00:00:00 2001 From: Jon Surrell Date: Tue, 10 Sep 2024 12:48:02 +0200 Subject: [PATCH 08/17] Script modules must build _after_ packages --- webpack.config.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/webpack.config.js b/webpack.config.js index 51889b06d1eb44..c61d5e53fbc324 100644 --- a/webpack.config.js +++ b/webpack.config.js @@ -9,8 +9,8 @@ const vendorsConfig = require( './tools/webpack/vendors' ); module.exports = [ ...blocksConfig, - scriptModules, packagesConfig, + scriptModules, // Script modules build depends on the package build. ...developmentConfigs, ...vendorsConfig, ]; From 2185fd5b9b13e967714e8117b342bad522487798 Mon Sep 17 00:00:00 2001 From: Jon Surrell Date: Tue, 10 Sep 2024 14:38:59 +0200 Subject: [PATCH 09/17] Add interactivity-router to root dependencies --- package-lock.json | 1 + package.json | 1 + 2 files changed, 2 insertions(+) diff --git a/package-lock.json b/package-lock.json index b9e116f15388be..769ef050834203 100644 --- a/package-lock.json +++ b/package-lock.json @@ -46,6 +46,7 @@ "@wordpress/i18n": "file:packages/i18n", "@wordpress/icons": "file:packages/icons", "@wordpress/interactivity": "file:packages/interactivity", + "@wordpress/interactivity-router": "file:packages/interactivity-router", "@wordpress/interface": "file:packages/interface", "@wordpress/is-shallow-equal": "file:packages/is-shallow-equal", "@wordpress/keyboard-shortcuts": "file:packages/keyboard-shortcuts", diff --git a/package.json b/package.json index 22cdf2ce7acc88..e757aaa0f44b48 100644 --- a/package.json +++ b/package.json @@ -58,6 +58,7 @@ "@wordpress/i18n": "file:packages/i18n", "@wordpress/icons": "file:packages/icons", "@wordpress/interactivity": "file:packages/interactivity", + "@wordpress/interactivity-router": "file:packages/interactivity-router", "@wordpress/interface": "file:packages/interface", "@wordpress/is-shallow-equal": "file:packages/is-shallow-equal", "@wordpress/keyboard-shortcuts": "file:packages/keyboard-shortcuts", From b924b5544af5e5ca4b3c5ddfd76822a4147909b8 Mon Sep 17 00:00:00 2001 From: Jon Surrell Date: Tue, 10 Sep 2024 15:19:06 +0200 Subject: [PATCH 10/17] Try building entrypoints from package.json --- packages/block-library/package.json | 2 +- packages/interactivity-router/package.json | 4 +- packages/interactivity/package.json | 2 +- tools/webpack/script-modules.js | 65 +++++++++++++++++++++- 4 files changed, 67 insertions(+), 6 deletions(-) diff --git a/packages/block-library/package.json b/packages/block-library/package.json index 0d39b6f55c857c..1353ef24c77d89 100644 --- a/packages/block-library/package.json +++ b/packages/block-library/package.json @@ -30,7 +30,7 @@ "src/**/*.scss", "{src,build,build-module}/*/init.js" ], - "wp-script-module-exports": { + "wpScriptModuleExports": { "./file/view": "./build-module/file/view.js", "./image/view": "./build-module/image/view.js", "./navigation/view": "./build-module/navigation/view.js", diff --git a/packages/interactivity-router/package.json b/packages/interactivity-router/package.json index 8f27788f7cb157..db85c0d8bdba3b 100644 --- a/packages/interactivity-router/package.json +++ b/packages/interactivity-router/package.json @@ -26,9 +26,7 @@ "module": "build-module/index.js", "react-native": "src/index", "types": "build-types", - "wp-script-module-exports": { - ".": "./build-module/index.js" - }, + "wpScriptModuleExports": "./build-module/index.js", "dependencies": { "@wordpress/interactivity": "file:../interactivity" }, diff --git a/packages/interactivity/package.json b/packages/interactivity/package.json index 05b83860ef271a..6be9f3c4a0d7d8 100644 --- a/packages/interactivity/package.json +++ b/packages/interactivity/package.json @@ -26,7 +26,7 @@ "module": "build-module/index.js", "react-native": "src/index", "types": "build-types", - "wp-script-module-exports": { + "wpScriptModuleExports": { ".": "./build-module/index.js", "./debug": "./build-module/debug.js" }, diff --git a/tools/webpack/script-modules.js b/tools/webpack/script-modules.js index 97e03d990b34ca..9ae3a08aedfd3c 100644 --- a/tools/webpack/script-modules.js +++ b/tools/webpack/script-modules.js @@ -13,6 +13,70 @@ const DependencyExtractionWebpackPlugin = require( '@wordpress/dependency-extrac */ const { baseConfig, plugins } = require( './shared' ); +const WORDPRESS_NAMESPACE = '@wordpress/'; +const { createRequire } = require( 'node:module' ); + +const rootPath = `${ __dirname }/../../`; +const fromRootRequire = createRequire( rootPath ); + +/** @type {Iterable<[string, string]>} */ +const iterableDeps = Object.entries( + fromRootRequire( './package.json' ).dependencies +); + +/** @type {Map} */ +const gutenbergScriptModules = new Map(); +for ( const [ packageName, versionSpecifier ] of iterableDeps ) { + if ( + ! packageName.startsWith( WORDPRESS_NAMESPACE ) || + ! versionSpecifier.startsWith( 'file:' ) || + packageName.startsWith( WORDPRESS_NAMESPACE + 'react-native' ) + ) { + continue; + } + const packageRequire = createRequire( + `${ rootPath }/${ versionSpecifier.substring( 5 ) }/` + ); + const depPackageJson = packageRequire( './package.json' ); + if ( ! Object.hasOwn( depPackageJson, 'wpScriptModuleExports' ) ) { + continue; + } + + const moduleName = packageName.substring( WORDPRESS_NAMESPACE.length ); + let { wpScriptModuleExports } = depPackageJson; + + // Special handling for { "wpScriptModuleExports": "./build-module/index.js" }. + if ( typeof wpScriptModuleExports === 'string' ) { + wpScriptModuleExports = { '.': wpScriptModuleExports }; + } + + if ( Object.getPrototypeOf( wpScriptModuleExports ) !== Object.prototype ) { + throw new Error( 'wpScriptModuleExports must be an object' ); + } + + for ( const [ exportName, exportPath ] of Object.entries( + wpScriptModuleExports + ) ) { + if ( typeof exportPath !== 'string' ) { + throw new Error( 'wpScriptModuleExports paths must be strings' ); + } + + if ( ! exportPath.startsWith( './' ) ) { + throw new Error( + 'wpScriptModuleExports paths must start with "./"' + ); + } + + const name = + exportName === '.' ? 'index' : exportName.replace( /^\.\/?/, '' ); + + gutenbergScriptModules.set( + `${ moduleName }/${ name }`, + packageRequire.resolve( exportPath ) + ); + } +} + module.exports = { ...baseConfig, name: 'script-modules', @@ -46,7 +110,6 @@ module.exports = { }, resolve: { extensions: [ '.js', '.ts', '.tsx' ], - exportsFields: [ 'wp-script-module-exports', 'exports' ], }, module: { rules: [ From 29fcea405e73e72a27222821608b5a9d58d4a963 Mon Sep 17 00:00:00 2001 From: Jon Surrell Date: Tue, 10 Sep 2024 15:23:48 +0200 Subject: [PATCH 11/17] Use the generated entrypoints --- tools/webpack/script-modules.js | 14 +------------- 1 file changed, 1 insertion(+), 13 deletions(-) diff --git a/tools/webpack/script-modules.js b/tools/webpack/script-modules.js index 9ae3a08aedfd3c..177c1bb8ce01ca 100644 --- a/tools/webpack/script-modules.js +++ b/tools/webpack/script-modules.js @@ -80,19 +80,7 @@ for ( const [ packageName, versionSpecifier ] of iterableDeps ) { module.exports = { ...baseConfig, name: 'script-modules', - entry: { - 'interactivity/index': './packages/interactivity', - 'interactivity/debug': './packages/interactivity/debug', - - 'interactivity-router': './packages/interactivity-router', - - 'block-library/file/view': './packages/block-library/file/view', - 'block-library/image/view': './packages/block-library/image/view', - 'block-library/navigation/view': - './packages/block-library/navigation/view', - 'block-library/query/view': './packages/block-library/query/view', - 'block-library/search/view': './packages/block-library/search/view', - }, + entry: gutenbergScriptModules, experiments: { outputModule: true, }, From df3488322426e93d788460256327202a33d1af93 Mon Sep 17 00:00:00 2001 From: Jon Surrell Date: Tue, 10 Sep 2024 15:24:57 +0200 Subject: [PATCH 12/17] Update interactivity-router script module path --- lib/interactivity-api.php | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/lib/interactivity-api.php b/lib/interactivity-api.php index f7f158cac1272f..90535f1ebaa42f 100644 --- a/lib/interactivity-api.php +++ b/lib/interactivity-api.php @@ -23,7 +23,7 @@ function gutenberg_reregister_interactivity_script_modules() { wp_register_script_module( '@wordpress/interactivity-router', - gutenberg_url( '/build-module/interactivity-router.min.js' ), + gutenberg_url( '/build-module/interactivity-router/index.min.js' ), array( '@wordpress/interactivity' ), $default_version ); From 73d9b5e38102344a49bc4b96cdebfa664f72ae35 Mon Sep 17 00:00:00 2001 From: Jon Surrell Date: Tue, 10 Sep 2024 16:12:21 +0200 Subject: [PATCH 13/17] Fix script-module entry --- tools/webpack/script-modules.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/tools/webpack/script-modules.js b/tools/webpack/script-modules.js index 177c1bb8ce01ca..a800beffe20ee2 100644 --- a/tools/webpack/script-modules.js +++ b/tools/webpack/script-modules.js @@ -80,7 +80,7 @@ for ( const [ packageName, versionSpecifier ] of iterableDeps ) { module.exports = { ...baseConfig, name: 'script-modules', - entry: gutenbergScriptModules, + entry: Object.fromEntries( gutenbergScriptModules.entries() ), experiments: { outputModule: true, }, From 5bf5899f5454ffcb333a4fc3d6ee4fc21f8deb07 Mon Sep 17 00:00:00 2001 From: Jon Surrell Date: Tue, 10 Sep 2024 19:37:34 +0200 Subject: [PATCH 14/17] Revert webpack configs reordering --- webpack.config.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/webpack.config.js b/webpack.config.js index c61d5e53fbc324..51889b06d1eb44 100644 --- a/webpack.config.js +++ b/webpack.config.js @@ -9,8 +9,8 @@ const vendorsConfig = require( './tools/webpack/vendors' ); module.exports = [ ...blocksConfig, + scriptModules, packagesConfig, - scriptModules, // Script modules build depends on the package build. ...developmentConfigs, ...vendorsConfig, ]; From f5e2162648276d8cf37b7597636cbd189a740283 Mon Sep 17 00:00:00 2001 From: Jon Surrell Date: Tue, 10 Sep 2024 19:57:24 +0200 Subject: [PATCH 15/17] Use URLs for improved cross platform support --- tools/webpack/script-modules.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/tools/webpack/script-modules.js b/tools/webpack/script-modules.js index a800beffe20ee2..0385372c846a7e 100644 --- a/tools/webpack/script-modules.js +++ b/tools/webpack/script-modules.js @@ -16,7 +16,7 @@ const { baseConfig, plugins } = require( './shared' ); const WORDPRESS_NAMESPACE = '@wordpress/'; const { createRequire } = require( 'node:module' ); -const rootPath = `${ __dirname }/../../`; +const rootPath = new URL( '..', `file://${ __dirname }` ); const fromRootRequire = createRequire( rootPath ); /** @type {Iterable<[string, string]>} */ @@ -35,7 +35,7 @@ for ( const [ packageName, versionSpecifier ] of iterableDeps ) { continue; } const packageRequire = createRequire( - `${ rootPath }/${ versionSpecifier.substring( 5 ) }/` + new URL( `${ versionSpecifier.substring( 5 ) }/`, rootPath ) ); const depPackageJson = packageRequire( './package.json' ); if ( ! Object.hasOwn( depPackageJson, 'wpScriptModuleExports' ) ) { From 30d64d34a4148993bde11249eb12beb90b37d6f6 Mon Sep 17 00:00:00 2001 From: Jon Surrell Date: Wed, 11 Sep 2024 11:17:47 +0200 Subject: [PATCH 16/17] Include build-module in plugin zip --- bin/build-plugin-zip.sh | 1 + 1 file changed, 1 insertion(+) diff --git a/bin/build-plugin-zip.sh b/bin/build-plugin-zip.sh index 4ba931c4a4aeb6..ad627e05f0c693 100755 --- a/bin/build-plugin-zip.sh +++ b/bin/build-plugin-zip.sh @@ -98,6 +98,7 @@ zip -r gutenberg.zip \ packages/block-serialization-default-parser/*.php \ post-content.php \ $build_files \ + build-module \ readme.txt \ changelog.txt \ README.md From 0a71b7dd74273501a52faf1c041f8addfdfedaea Mon Sep 17 00:00:00 2001 From: Jon Surrell Date: Wed, 11 Sep 2024 11:20:09 +0200 Subject: [PATCH 17/17] URL renames and cleanup --- tools/webpack/script-modules.js | 9 ++++++--- 1 file changed, 6 insertions(+), 3 deletions(-) diff --git a/tools/webpack/script-modules.js b/tools/webpack/script-modules.js index 0385372c846a7e..57652e0be28e2b 100644 --- a/tools/webpack/script-modules.js +++ b/tools/webpack/script-modules.js @@ -16,8 +16,8 @@ const { baseConfig, plugins } = require( './shared' ); const WORDPRESS_NAMESPACE = '@wordpress/'; const { createRequire } = require( 'node:module' ); -const rootPath = new URL( '..', `file://${ __dirname }` ); -const fromRootRequire = createRequire( rootPath ); +const rootURL = new URL( '..', `file://${ __dirname }` ); +const fromRootRequire = createRequire( rootURL ); /** @type {Iterable<[string, string]>} */ const iterableDeps = Object.entries( @@ -34,9 +34,12 @@ for ( const [ packageName, versionSpecifier ] of iterableDeps ) { ) { continue; } + const packageRequire = createRequire( - new URL( `${ versionSpecifier.substring( 5 ) }/`, rootPath ) + // Remove the leading "file:" specifier to build a package URL. + new URL( `${ versionSpecifier.substring( 5 ) }/`, rootURL ) ); + const depPackageJson = packageRequire( './package.json' ); if ( ! Object.hasOwn( depPackageJson, 'wpScriptModuleExports' ) ) { continue;