Build: Update Gutenberg integration to checkout-and-build approach.

This changes WordPress Core's Gutenberg integration from npm packages to checking out and building Gutenberg directly. Instead of syncing individual npm packages, Core now checks out the Gutenberg repository, builds it, and copies the build artifacts.

This enables Core to use Gutenberg's advanced features like route-based navigation, full-page rendering, and the Font Library, while also streamlining future updates.

New commands:
  * `npm run gutenberg:checkout` - Clones Gutenberg at a specified ref
  * `npm run gutenberg:build` - Runs Gutenberg's build process
  * `npm run gutenberg:copy` - Copies and transforms build output to Core
  * `npm run gutenberg:integrate` - Runs all three steps

Main changes:
  * Removes webpack configs replaced by Gutenberg's build (blocks.js, packages.js, script-modules.js, development.js, vendors.js)
  * Adds Font Library page (`/wp-admin/font-library.php`)
  * Adds copy scripts to transform Gutenberg plugin paths to Core paths
  * Moves vendor copy step from webpack to Gruntfile

New year, new process. Happy New Year!

Props youknowriad, ellatrix, sirreal, westonruter, desrosj, tellthemachines.
Fixes #64393.


git-svn-id: https://develop.svn.wordpress.org/trunk@61438 602fd350-edb4-49c9-b593-d223f7449a82

Author: youknowriad

.github/workflows/reusable-phpunit-tests-v3.yml

@@ -165,6 +165,9 @@ jobs:
       - name: Install npm dependencies
         run: npm ci
 
+      - name: Build WordPress
+        run: npm run build:dev
+
       - name: General debug information
         run: |
           npm --version

.github/workflows/reusable-test-core-build-process.yml

@@ -39,6 +39,7 @@ on:
 
 env:
   PUPPETEER_SKIP_DOWNLOAD: ${{ true }}
+  NODE_OPTIONS: --max-old-space-size=4096
 
 # Disable permissions for all available scopes by default.
 # Any needed permissions should be configured at the job level.

.github/workflows/reusable-test-gutenberg-build-process.yml

@@ -120,6 +120,9 @@ jobs:
       - name: Install npm dependencies
         run: npm ci
 
+      - name: Build WordPress
+        run: npm run build:dev
+
       - name: General debug information
         run: |
           npm --version

.github/workflows/reusable-test-local-docker-environment-v1.yml

@@ -32,7 +32,6 @@ on:
       # Confirm any changes to relevant workflow files.
       - '.github/workflows/test-build-processes.yml'
       - '.github/workflows/reusable-test-core-build-process.yml'
-      - '.github/workflows/reusable-test-gutenberg-build-process.yml'
   workflow_dispatch:
 
 # Cancels all previous workflow runs for pull requests that have not completed.
@@ -98,54 +97,13 @@ jobs:
       os: ${{ matrix.os }}
       directory: ${{ matrix.directory }}
 
-  # Tests the Gutenberg plugin build process within a wordpress-develop checkout.
-  test-gutenberg-build-process:
-    name: Gutenberg running from ${{ matrix.directory }}
-    uses: ./.github/workflows/reusable-test-gutenberg-build-process.yml
-    permissions:
-      contents: read
-    if: ${{ github.repository == 'WordPress/wordpress-develop' }}
-    strategy:
-      fail-fast: false
-      matrix:
-        os: [ 'ubuntu-24.04' ]
-        directory: [ 'src', 'build' ]
-    with:
-      os: ${{ matrix.os }}
-      directory: ${{ matrix.directory }}
-
-  # Tests the Gutenberg plugin build process on additional operating systems.
-  #
-  # This is separate from the job above in order to use stricter conditions when determining when to test additional
-  # operating systems. This avoids unintentionally consuming excessive minutes. Windows-based jobs consume minutes at a
-  # 2x rate, and MacOS-based jobs at a 10x rate.
-  # See https://docs.github.com/en/billing/concepts/product-billing/github-actions#per-minute-rates.
-  #
-  # The `matrix` and `runner` contexts are not available for use within `if` expressions. So there is
-  # currently no way to determine the OS being used on a given job.
-  # See https://docs.github.com/en/actions/learn-github-actions/contexts#context-availability.
-  test-gutenberg-build-process-additional-os:
-    name: Gutenberg running from ${{ matrix.directory }}
-    uses: ./.github/workflows/reusable-test-gutenberg-build-process.yml
-    permissions:
-      contents: read
-    if: ${{ github.repository == 'WordPress/wordpress-develop' }}
-    strategy:
-      fail-fast: false
-      matrix:
-        os: [ 'macos-15', 'windows-2025' ]
-        directory: [ 'src', 'build' ]
-    with:
-      os: ${{ matrix.os }}
-      directory: ${{ matrix.directory }}
-
   slack-notifications:
     name: Slack Notifications
     uses: ./.github/workflows/slack-notifications.yml
     permissions:
       actions: read
       contents: read
-    needs: [ test-core-build-process, test-core-build-process-additional-os, test-gutenberg-build-process, test-gutenberg-build-process-additional-os ]
+    needs: [ test-core-build-process, test-core-build-process-additional-os ]
     if: ${{ github.repository == 'WordPress/wordpress-develop' && github.event_name != 'pull_request' && always() }}
     with:
       calling_status: ${{ contains( needs.*.result, 'cancelled' ) && 'cancelled' || contains( needs.*.result, 'failure' ) && 'failure' || 'success' }}

.github/workflows/test-build-processes.yml

@@ -20,6 +20,7 @@ wp-tests-config.php
 /node_modules
 /npm-debug.log
 /build
+/gutenberg
 /tests/phpunit/build
 /wp-cli.local.yml
 /jsdoc
@@ -30,15 +31,18 @@ wp-tests-config.php
 /src/wp-admin/css/colors/*/*.css
 /src/wp-admin/js
 /src/wp-includes/assets/*
-!/src/wp-includes/assets/script-loader-packages.min.php
-!/src/wp-includes/assets/script-modules-packages.min.php
 /src/wp-includes/js
 /src/wp-includes/css/dist
 /src/wp-includes/css/*.min.css
 /src/wp-includes/css/*-rtl.css
-/src/wp-includes/blocks/**/*.css
-/src/wp-includes/blocks/**/*.js
-/src/wp-includes/blocks/**/*.js.map
+/src/wp-includes/blocks/*
+!/src/wp-includes/blocks/index.php
+/src/wp-includes/build
+/src/wp-includes/class-wp-block-parser.php
+/src/wp-includes/class-wp-block-parser-block.php
+/src/wp-includes/class-wp-block-parser-frame.php
+/src/wp-includes/theme.json
+/src/wp-includes/theme-i18n.json
 /packagehash.txt
 /artifacts
 /setup.log

.gitignore

@@ -3,7 +3,6 @@
 /* globals Set */
 var webpackConfig = require( './webpack.config' );
 var installChanged = require( 'install-changed' );
-var json2php = require( 'json2php' );
 
 module.exports = function(grunt) {
 	var path = require('path'),
@@ -1279,6 +1278,14 @@ module.exports = function(grunt) {
 							BUILD_DIR + 'wp-includes/js/dist/commands.js',
 						],
 						dest: BUILD_DIR + 'wp-includes/js/dist/'
+					},
+					{
+						expand: true,
+						flatten: true,
+						src: [
+							BUILD_DIR + 'wp-includes/js/dist/vendor/**/*.js'
+						],
+						dest: BUILD_DIR + 'wp-includes/js/dist/vendor/'
 					}
 				]
 			}
@@ -1414,6 +1421,59 @@ module.exports = function(grunt) {
 		grunt.task.run( 'wp-packages:refresh-deps' );
 	} );
 
+	// Gutenberg integration tasks.
+	grunt.registerTask( 'gutenberg-checkout', 'Checks out the Gutenberg repository.', function() {
+		const done = this.async();
+		grunt.util.spawn( {
+			cmd: 'node',
+			args: [ 'tools/gutenberg/checkout-gutenberg.js' ],
+			opts: { stdio: 'inherit' }
+		}, function( error ) {
+			done( ! error );
+		} );
+	} );
+
+	grunt.registerTask( 'gutenberg-build', 'Builds the Gutenberg repository.', function() {
+		const done = this.async();
+		grunt.util.spawn( {
+			cmd: 'node',
+			args: [ 'tools/gutenberg/build-gutenberg.js' ],
+			opts: { stdio: 'inherit' }
+		}, function( error ) {
+			done( ! error );
+		} );
+	} );
+
+	grunt.registerTask( 'gutenberg-copy', 'Copies Gutenberg build output to WordPress Core.', function() {
+		const done = this.async();
+		const buildDir = grunt.option( 'dev' ) ? 'src' : 'build';
+		grunt.util.spawn( {
+			cmd: 'node',
+			args: [ 'tools/gutenberg/copy-gutenberg-build.js', `--build-dir=${ buildDir }` ],
+			opts: { stdio: 'inherit' }
+		}, function( error ) {
+			done( ! error );
+		} );
+	} );
+
+	grunt.registerTask( 'gutenberg-integrate', 'Complete Gutenberg integration workflow.', [
+		'gutenberg-checkout',
+		'gutenberg-build',
+		'gutenberg-copy'
+	] );
+
+	grunt.registerTask( 'copy-vendor-scripts', 'Copies vendor scripts from node_modules to wp-includes/js/dist/vendor/.', function() {
+		const done = this.async();
+		const buildDir = grunt.option( 'dev' ) ? 'src' : 'build';
+		grunt.util.spawn( {
+			cmd: 'node',
+			args: [ 'tools/vendors/copy-vendors.js', `--build-dir=${ buildDir }` ],
+			opts: { stdio: 'inherit' }
+		}, function( error ) {
+			done( ! error );
+		} );
+	} );
+
 	grunt.renameTask( 'watch', '_watch' );
 
 	grunt.registerTask( 'watch', function() {
@@ -1569,23 +1629,6 @@ module.exports = function(grunt) {
 		}
 	} );
 
-	grunt.registerTask( 'copy:block-json', 'Copies block.json file contents to block-json.php.', function() {
-		var blocks = {};
-		grunt.file.recurse( SOURCE_DIR + 'wp-includes/blocks', function( abspath, rootdir, subdir, filename ) {
-			if ( /^block\.json$/.test( filename ) ) {
-				blocks[ subdir ] = grunt.file.readJSON( abspath );
-			}
-		} );
-		grunt.file.write(
-			SOURCE_DIR + 'wp-includes/blocks/blocks-json.php',
-			'<?php return ' + json2php.make( {
-				linebreak: '\n',
-				indent: '  ',
-				shortArraySyntax: false
-			} )( blocks ) + ';'
-		);
-	} );
-
 	grunt.registerTask( 'copy:js', [
 		'copy:npm-packages',
 		'copy:vendor-js',
@@ -1723,7 +1766,6 @@ module.exports = function(grunt) {
 	grunt.registerTask( 'build:files', [
 		'clean:files',
 		'copy:files',
-		'copy:block-json',
 		'copy:version',
 	] );
 
@@ -1853,6 +1895,8 @@ module.exports = function(grunt) {
 			grunt.task.run( [
 				'build:js',
 				'build:css',
+				'gutenberg-integrate',
+				'copy-vendor-scripts',
 				'build:certificates'
 			] );
 		} else {
@@ -1861,6 +1905,8 @@ module.exports = function(grunt) {
 				'build:files',
 				'build:js',
 				'build:css',
+				'gutenberg-integrate',
+				'copy-vendor-scripts',
 				'replace:source-maps',
 				'verify:build'
 			] );