Build Tools: Integrate DependencyExtractionWebpackPlugin in the JS build.
This patch integrates DependencyExtractionWebpackPlugin which was battle-tested in Gutenberg. This will greatly simplify the process of upgrading npm packages which change after every Gutenberg release. It might even useful during the WordPress release cycle as we might need to publish more often as we discover critical bugs and regressions. Props jonsurrell, adamsilverstein, youknowriad, ocean90, netweb. Fixes #48154. git-svn-id: https://develop.svn.wordpress.org/trunk@47035 602fd350-edb4-49c9-b593-d223f7449a82
This commit is contained in:
Grzegorz (Greg) Ziółkowski
parent
c27ab74ca9
commit
a35e46a937
1
.gitignore
vendored
1
.gitignore
vendored
@ -24,6 +24,7 @@ wp-tests-config.php
|
||||
/src/wp-admin/css/*-rtl.css
|
||||
/src/wp-admin/css/colors/*/*.css
|
||||
/src/wp-admin/js
|
||||
/src/wp-includes/assets
|
||||
/src/wp-includes/js
|
||||
/src/wp-includes/css/dist
|
||||
/src/wp-includes/css/*.min.css
|
||||
|
||||
21
Gruntfile.js
21
Gruntfile.js
@ -108,8 +108,12 @@ module.exports = function(grunt) {
|
||||
],
|
||||
js: [
|
||||
WORKING_DIR + 'wp-admin/js/',
|
||||
WORKING_DIR + 'wp-includes/assets/',
|
||||
WORKING_DIR + 'wp-includes/js/'
|
||||
],
|
||||
'webpack-assets': [
|
||||
WORKING_DIR + 'wp-includes/js/**/*.asset.php'
|
||||
],
|
||||
dynamic: {
|
||||
dot: true,
|
||||
expand: true,
|
||||
@ -137,6 +141,7 @@ module.exports = function(grunt) {
|
||||
expand: true,
|
||||
cwd: SOURCE_DIR,
|
||||
src: buildFiles.concat( [
|
||||
'!assets/**', // Assets is extracted into separate copy tasks.
|
||||
'!js/**', // JavaScript is extracted into separate copy tasks.
|
||||
'!.{svn,git}', // Exclude version control folders.
|
||||
'!wp-includes/version.php', // Exclude version.php
|
||||
@ -345,6 +350,12 @@ module.exports = function(grunt) {
|
||||
}
|
||||
]
|
||||
},
|
||||
'webpack-assets': {
|
||||
expand: true,
|
||||
cwd: WORKING_DIR + 'wp-includes/js/',
|
||||
src: 'dist/*.asset.php',
|
||||
dest: WORKING_DIR + 'wp-includes/assets/'
|
||||
},
|
||||
version: {
|
||||
options: {
|
||||
processContent: function( src ) {
|
||||
@ -1350,10 +1361,16 @@ module.exports = function(grunt) {
|
||||
'uglify:jqueryform'
|
||||
] );
|
||||
|
||||
grunt.registerTask( 'build:js', [
|
||||
'clean:js',
|
||||
grunt.registerTask( 'build:webpack', [
|
||||
'webpack:prod',
|
||||
'webpack:dev',
|
||||
'copy:webpack-assets',
|
||||
'clean:webpack-assets',
|
||||
] );
|
||||
|
||||
grunt.registerTask( 'build:js', [
|
||||
'clean:js',
|
||||
'build:webpack',
|
||||
'copy:js',
|
||||
'file_append',
|
||||
'uglify:all',
|
||||
|
||||
2304
package-lock.json
generated
2304
package-lock.json
generated
File diff suppressed because it is too large
Load Diff
@ -26,9 +26,10 @@
|
||||
],
|
||||
"devDependencies": {
|
||||
"@wordpress/custom-templated-path-webpack-plugin": "1.5.0",
|
||||
"@wordpress/e2e-test-utils": "2.4.3",
|
||||
"@wordpress/library-export-default-webpack-plugin": "1.4.1",
|
||||
"@wordpress/scripts": "5.1.0",
|
||||
"@wordpress/dependency-extraction-webpack-plugin": "2.1.0",
|
||||
"@wordpress/e2e-test-utils": "3.0.0",
|
||||
"@wordpress/library-export-default-webpack-plugin": "1.5.0",
|
||||
"@wordpress/scripts": "6.0.0",
|
||||
"autoprefixer": "9.6.2",
|
||||
"check-node-version": "4.0.1",
|
||||
"copy-webpack-plugin": "^5.0.4",
|
||||
@ -76,6 +77,7 @@
|
||||
"@wordpress/api-fetch": "3.6.4",
|
||||
"@wordpress/autop": "2.5.1",
|
||||
"@wordpress/blob": "2.5.1",
|
||||
"@wordpress/block-directory": "1.0.5",
|
||||
"@wordpress/block-editor": "3.2.5",
|
||||
"@wordpress/block-library": "2.9.6",
|
||||
"@wordpress/block-serialization-default-parser": "3.4.1",
|
||||
|
||||
@ -127,6 +127,7 @@
|
||||
<exclude-pattern>/src/wp-includes/pluggable-deprecated\.php</exclude-pattern>
|
||||
<exclude-pattern>/src/wp-includes/rss\.php</exclude-pattern>
|
||||
|
||||
<exclude-pattern>/src/wp-includes/assets/*</exclude-pattern>
|
||||
<exclude-pattern>/src/wp-includes/blocks/*</exclude-pattern>
|
||||
<exclude-pattern>/src/wp-includes/ID3/*</exclude-pattern>
|
||||
<exclude-pattern>/src/wp-includes/IXR/*</exclude-pattern>
|
||||
|
||||
@ -223,395 +223,56 @@ function wp_get_script_polyfill( &$scripts, $tests ) {
|
||||
function wp_default_packages_scripts( &$scripts ) {
|
||||
$suffix = wp_scripts_get_suffix();
|
||||
|
||||
$packages_versions = array(
|
||||
'a11y' => '2.5.1',
|
||||
'annotations' => '1.7.2',
|
||||
'api-fetch' => '3.6.4',
|
||||
'autop' => '2.5.1',
|
||||
'blob' => '2.5.1',
|
||||
'block-editor' => '3.2.5',
|
||||
'block-library' => '2.9.6',
|
||||
'block-serialization-default-parser' => '3.4.1',
|
||||
'blocks' => '6.7.2',
|
||||
'components' => '8.3.2',
|
||||
'compose' => '3.7.2',
|
||||
'core-data' => '2.7.5',
|
||||
'data-controls' => '1.3.4',
|
||||
'data' => '4.9.2',
|
||||
'date' => '3.5.0',
|
||||
'deprecated' => '2.6.1',
|
||||
'dom-ready' => '2.5.1',
|
||||
'dom' => '2.5.2',
|
||||
'edit-post' => '3.8.6',
|
||||
'editor' => '9.7.6',
|
||||
'element' => '2.8.2',
|
||||
'escape-html' => '1.5.1',
|
||||
'format-library' => '1.9.5',
|
||||
'hooks' => '2.6.0',
|
||||
'html-entities' => '2.5.0',
|
||||
'i18n' => '3.6.1',
|
||||
'is-shallow-equal' => '1.6.1',
|
||||
'keycodes' => '2.6.2',
|
||||
'list-reusable-blocks' => '1.8.4',
|
||||
'media-utils' => '1.2.4',
|
||||
'notices' => '1.8.2',
|
||||
'nux' => '3.7.2',
|
||||
'plugins' => '2.7.2',
|
||||
'priority-queue' => '1.3.1',
|
||||
'redux-routine' => '3.6.2',
|
||||
'rich-text' => '3.7.2',
|
||||
'shortcode' => '2.4.1',
|
||||
'server-side-render' => '1.3.4',
|
||||
'token-list' => '1.6.1',
|
||||
'url' => '2.8.2',
|
||||
'viewport' => '2.8.2',
|
||||
'wordcount' => '2.6.2',
|
||||
);
|
||||
|
||||
$packages_dependencies = array(
|
||||
'a11y' => array(
|
||||
'wp-dom-ready',
|
||||
'wp-polyfill',
|
||||
),
|
||||
'annotations' => array(
|
||||
'lodash',
|
||||
'wp-data',
|
||||
'wp-hooks',
|
||||
'wp-i18n',
|
||||
'wp-polyfill',
|
||||
'wp-rich-text',
|
||||
),
|
||||
'api-fetch' => array(
|
||||
'wp-i18n',
|
||||
'wp-polyfill',
|
||||
'wp-url',
|
||||
),
|
||||
'autop' => array(
|
||||
'wp-polyfill',
|
||||
),
|
||||
'blob' => array(
|
||||
'wp-polyfill',
|
||||
),
|
||||
'block-editor' => array(
|
||||
'lodash',
|
||||
'wp-a11y',
|
||||
'wp-blob',
|
||||
'wp-blocks',
|
||||
'wp-components',
|
||||
'wp-compose',
|
||||
'wp-data',
|
||||
'wp-deprecated',
|
||||
'wp-dom',
|
||||
'wp-element',
|
||||
'wp-hooks',
|
||||
'wp-html-entities',
|
||||
'wp-i18n',
|
||||
'wp-is-shallow-equal',
|
||||
'wp-keycodes',
|
||||
'wp-polyfill',
|
||||
'wp-rich-text',
|
||||
'wp-token-list',
|
||||
'wp-url',
|
||||
'wp-viewport',
|
||||
'wp-wordcount',
|
||||
),
|
||||
'block-library' => array(
|
||||
'editor',
|
||||
'lodash',
|
||||
'moment',
|
||||
'wp-a11y',
|
||||
'wp-api-fetch',
|
||||
'wp-autop',
|
||||
'wp-blob',
|
||||
'wp-block-editor',
|
||||
'wp-blocks',
|
||||
'wp-components',
|
||||
'wp-compose',
|
||||
'wp-core-data',
|
||||
'wp-data',
|
||||
'wp-date',
|
||||
'wp-deprecated',
|
||||
'wp-editor',
|
||||
'wp-element',
|
||||
'wp-i18n',
|
||||
'wp-is-shallow-equal',
|
||||
'wp-keycodes',
|
||||
'wp-polyfill',
|
||||
'wp-rich-text',
|
||||
'wp-server-side-render',
|
||||
'wp-url',
|
||||
'wp-viewport',
|
||||
),
|
||||
'block-serialization-default-parser' => array(
|
||||
'wp-polyfill',
|
||||
),
|
||||
'blocks' => array(
|
||||
'lodash',
|
||||
'wp-autop',
|
||||
'wp-blob',
|
||||
'wp-block-serialization-default-parser',
|
||||
'wp-compose',
|
||||
'wp-data',
|
||||
'wp-dom',
|
||||
'wp-element',
|
||||
'wp-hooks',
|
||||
'wp-html-entities',
|
||||
'wp-i18n',
|
||||
'wp-is-shallow-equal',
|
||||
'wp-polyfill',
|
||||
'wp-shortcode',
|
||||
),
|
||||
'components' => array(
|
||||
'lodash',
|
||||
'moment',
|
||||
'wp-a11y',
|
||||
'wp-compose',
|
||||
'wp-deprecated',
|
||||
'wp-dom',
|
||||
'wp-element',
|
||||
'wp-hooks',
|
||||
'wp-i18n',
|
||||
'wp-is-shallow-equal',
|
||||
'wp-keycodes',
|
||||
'wp-polyfill',
|
||||
'wp-rich-text',
|
||||
),
|
||||
'compose' => array(
|
||||
'lodash',
|
||||
'wp-element',
|
||||
'wp-is-shallow-equal',
|
||||
'wp-polyfill',
|
||||
),
|
||||
'core-data' => array(
|
||||
'lodash',
|
||||
'wp-api-fetch',
|
||||
'wp-data',
|
||||
'wp-deprecated',
|
||||
'wp-is-shallow-equal',
|
||||
'wp-polyfill',
|
||||
'wp-url',
|
||||
),
|
||||
'data' => array(
|
||||
'lodash',
|
||||
'wp-compose',
|
||||
'wp-deprecated',
|
||||
'wp-element',
|
||||
'wp-is-shallow-equal',
|
||||
'wp-polyfill',
|
||||
'wp-priority-queue',
|
||||
'wp-redux-routine',
|
||||
),
|
||||
'data-controls' => array(
|
||||
'wp-api-fetch',
|
||||
'wp-data',
|
||||
'wp-polyfill',
|
||||
),
|
||||
'date' => array(
|
||||
'moment',
|
||||
'wp-polyfill',
|
||||
),
|
||||
'deprecated' => array(
|
||||
'wp-hooks',
|
||||
'wp-polyfill',
|
||||
),
|
||||
'dom' => array(
|
||||
'lodash',
|
||||
'wp-polyfill',
|
||||
),
|
||||
'dom-ready' => array(
|
||||
'wp-polyfill',
|
||||
),
|
||||
'edit-post' => array(
|
||||
'lodash',
|
||||
'postbox',
|
||||
'media-models',
|
||||
'media-views',
|
||||
'wp-a11y',
|
||||
'wp-api-fetch',
|
||||
'wp-block-editor',
|
||||
'wp-block-library',
|
||||
'wp-blocks',
|
||||
'wp-components',
|
||||
'wp-compose',
|
||||
'wp-core-data',
|
||||
'wp-data',
|
||||
'wp-dom-ready',
|
||||
'wp-editor',
|
||||
'wp-element',
|
||||
'wp-hooks',
|
||||
'wp-i18n',
|
||||
'wp-keycodes',
|
||||
'wp-media-utils',
|
||||
'wp-notices',
|
||||
'wp-nux',
|
||||
'wp-plugins',
|
||||
'wp-polyfill',
|
||||
'wp-url',
|
||||
'wp-viewport',
|
||||
),
|
||||
'editor' => array(
|
||||
'lodash',
|
||||
'wp-api-fetch',
|
||||
'wp-autop',
|
||||
'wp-block-editor',
|
||||
'wp-blocks',
|
||||
'wp-components',
|
||||
'wp-compose',
|
||||
'wp-core-data',
|
||||
'wp-data',
|
||||
'wp-data-controls',
|
||||
'wp-date',
|
||||
'wp-deprecated',
|
||||
'wp-element',
|
||||
'wp-hooks',
|
||||
'wp-html-entities',
|
||||
'wp-i18n',
|
||||
'wp-is-shallow-equal',
|
||||
'wp-keycodes',
|
||||
'wp-media-utils',
|
||||
'wp-notices',
|
||||
'wp-nux',
|
||||
'wp-polyfill',
|
||||
'wp-rich-text',
|
||||
'wp-server-side-render',
|
||||
'wp-url',
|
||||
'wp-viewport',
|
||||
'wp-wordcount',
|
||||
),
|
||||
'element' => array(
|
||||
'lodash',
|
||||
'react',
|
||||
'react-dom',
|
||||
'wp-escape-html',
|
||||
'wp-polyfill',
|
||||
),
|
||||
'escape-html' => array(
|
||||
'wp-polyfill',
|
||||
),
|
||||
'format-library' => array(
|
||||
'lodash',
|
||||
'wp-block-editor',
|
||||
'wp-components',
|
||||
'wp-dom',
|
||||
'wp-element',
|
||||
'wp-html-entities',
|
||||
'wp-i18n',
|
||||
'wp-keycodes',
|
||||
'wp-polyfill',
|
||||
'wp-rich-text',
|
||||
'wp-url',
|
||||
),
|
||||
'hooks' => array(
|
||||
'wp-polyfill',
|
||||
),
|
||||
'html-entities' => array(
|
||||
'wp-polyfill',
|
||||
),
|
||||
'i18n' => array(
|
||||
'wp-polyfill',
|
||||
),
|
||||
'is-shallow-equal' => array(
|
||||
'wp-polyfill',
|
||||
),
|
||||
'keycodes' => array(
|
||||
'lodash',
|
||||
'wp-i18n',
|
||||
'wp-polyfill',
|
||||
),
|
||||
'list-reusable-blocks' => array(
|
||||
'lodash',
|
||||
'wp-api-fetch',
|
||||
'wp-components',
|
||||
'wp-compose',
|
||||
'wp-element',
|
||||
'wp-i18n',
|
||||
'wp-polyfill',
|
||||
),
|
||||
'media-utils' => array(
|
||||
'lodash',
|
||||
'wp-api-fetch',
|
||||
'wp-blob',
|
||||
'wp-element',
|
||||
'wp-i18n',
|
||||
'wp-polyfill',
|
||||
),
|
||||
'notices' => array(
|
||||
'lodash',
|
||||
'wp-a11y',
|
||||
'wp-data',
|
||||
'wp-polyfill',
|
||||
),
|
||||
'nux' => array(
|
||||
'lodash',
|
||||
'wp-components',
|
||||
'wp-compose',
|
||||
'wp-data',
|
||||
'wp-element',
|
||||
'wp-i18n',
|
||||
'wp-polyfill',
|
||||
),
|
||||
'plugins' => array(
|
||||
'lodash',
|
||||
'wp-compose',
|
||||
'wp-element',
|
||||
'wp-hooks',
|
||||
'wp-polyfill',
|
||||
),
|
||||
'priority-queue' => array(
|
||||
'wp-polyfill',
|
||||
),
|
||||
'redux-routine' => array(
|
||||
'lodash',
|
||||
'wp-polyfill',
|
||||
),
|
||||
'rich-text' => array(
|
||||
'lodash',
|
||||
'wp-compose',
|
||||
'wp-data',
|
||||
'wp-element',
|
||||
'wp-escape-html',
|
||||
'wp-hooks',
|
||||
'wp-is-shallow-equal',
|
||||
'wp-keycodes',
|
||||
'wp-polyfill',
|
||||
),
|
||||
'server-side-render' => array(
|
||||
'lodash',
|
||||
'wp-api-fetch',
|
||||
'wp-components',
|
||||
'wp-data',
|
||||
'wp-deprecated',
|
||||
'wp-element',
|
||||
'wp-i18n',
|
||||
'wp-polyfill',
|
||||
'wp-url',
|
||||
),
|
||||
'shortcode' => array(
|
||||
'lodash',
|
||||
'wp-polyfill',
|
||||
),
|
||||
'token-list' => array(
|
||||
'lodash',
|
||||
'wp-polyfill',
|
||||
),
|
||||
'url' => array(
|
||||
'wp-polyfill',
|
||||
),
|
||||
'viewport' => array(
|
||||
'lodash',
|
||||
'wp-compose',
|
||||
'wp-data',
|
||||
'wp-polyfill',
|
||||
),
|
||||
'wordcount' => array(
|
||||
'lodash',
|
||||
'wp-polyfill',
|
||||
),
|
||||
$packages = array(
|
||||
'a11y',
|
||||
'annotations',
|
||||
'api-fetch',
|
||||
'autop',
|
||||
'blob',
|
||||
'block-directory',
|
||||
'block-editor',
|
||||
'block-library',
|
||||
'block-serialization-default-parser',
|
||||
'blocks',
|
||||
'components',
|
||||
'compose',
|
||||
'core-data',
|
||||
'data',
|
||||
'data-controls',
|
||||
'date',
|
||||
'deprecated',
|
||||
'dom',
|
||||
'dom-ready',
|
||||
'edit-post',
|
||||
'editor',
|
||||
'element',
|
||||
'escape-html',
|
||||
'format-library',
|
||||
'hooks',
|
||||
'html-entities',
|
||||
'i18n',
|
||||
'is-shallow-equal',
|
||||
'keycodes',
|
||||
'list-reusable-blocks',
|
||||
'media-utils',
|
||||
'notices',
|
||||
'nux',
|
||||
'plugins',
|
||||
'priority-queue',
|
||||
'redux-routine',
|
||||
'rich-text',
|
||||
'shortcode',
|
||||
'server-side-render',
|
||||
'token-list',
|
||||
'url',
|
||||
'viewport',
|
||||
'wordcount',
|
||||
);
|
||||
|
||||
$package_translations = array(
|
||||
'api-fetch',
|
||||
'blocks',
|
||||
'block-directory',
|
||||
'block-editor',
|
||||
'block-library',
|
||||
'components',
|
||||
@ -623,12 +284,23 @@ function wp_default_packages_scripts( &$scripts ) {
|
||||
'nux',
|
||||
);
|
||||
|
||||
foreach ( $packages_dependencies as $package => $dependencies ) {
|
||||
$handle = 'wp-' . $package;
|
||||
$path = "/wp-includes/js/dist/$package$suffix.js";
|
||||
$version = $packages_versions[ $package ];
|
||||
foreach ( $packages as $package ) {
|
||||
$handle = 'wp-' . $package;
|
||||
$path = "/wp-includes/js/dist/$package$suffix.js";
|
||||
$asset_file = include( ABSPATH . WPINC . "/assets/dist/$package$suffix.asset.php" );
|
||||
$dependencies = $asset_file['dependencies'];
|
||||
|
||||
$scripts->add( $handle, $path, $dependencies, $version, 1 );
|
||||
// Add dependencies that cannot be detected and generated by build tools.
|
||||
switch ( $handle ) {
|
||||
case 'wp-block-library':
|
||||
array_push( $dependencies, 'editor' );
|
||||
break;
|
||||
case 'wp-edit-post':
|
||||
array_push( $dependencies, 'media-models', 'media-views', 'postbox', 'wp-dom-ready' );
|
||||
break;
|
||||
}
|
||||
|
||||
$scripts->add( $handle, $path, $dependencies, $asset_file['version'], 1 );
|
||||
|
||||
if ( in_array( $package, $package_translations, true ) ) {
|
||||
$scripts->set_translations( $handle );
|
||||
|
||||
@ -6163,7 +6163,7 @@ mockedApiResponse.UsersCollection = [
|
||||
{
|
||||
"id": 1,
|
||||
"name": "admin",
|
||||
"url": "",
|
||||
"url": "http://example.org",
|
||||
"description": "",
|
||||
"link": "http://example.org/?author=1",
|
||||
"slug": "admin",
|
||||
|
||||
@ -2,8 +2,8 @@
|
||||
* External dependencies
|
||||
*/
|
||||
const { DefinePlugin } = require( 'webpack' );
|
||||
const LiveReloadPlugin = require( 'webpack-livereload-plugin' );
|
||||
const CopyWebpackPlugin = require( 'copy-webpack-plugin' );
|
||||
const LiveReloadPlugin = require( 'webpack-livereload-plugin' );
|
||||
const postcss = require( 'postcss' );
|
||||
const UglifyJS = require( 'uglify-js' );
|
||||
|
||||
@ -14,6 +14,7 @@ const { get } = require( 'lodash' );
|
||||
* WordPress dependencies
|
||||
*/
|
||||
const CustomTemplatedPathPlugin = require( '@wordpress/custom-templated-path-webpack-plugin' );
|
||||
const DependencyExtractionPlugin = require( '@wordpress/dependency-extraction-webpack-plugin' );
|
||||
const LibraryExportDefaultPlugin = require( '@wordpress/library-export-default-webpack-plugin' );
|
||||
|
||||
/**
|
||||
@ -107,22 +108,6 @@ module.exports = function( env = { environment: 'production', watch: false, buil
|
||||
'block-library/src/tag-cloud/index.php': 'wp-includes/blocks/tag-cloud.php',
|
||||
};
|
||||
|
||||
const externals = {
|
||||
react: 'React',
|
||||
'react-dom': 'ReactDOM',
|
||||
tinymce: 'tinymce',
|
||||
moment: 'moment',
|
||||
jquery: 'jQuery',
|
||||
lodash: 'lodash',
|
||||
'lodash-es': 'lodash',
|
||||
};
|
||||
|
||||
packages.forEach( ( name ) => {
|
||||
externals[ `@wordpress/${ name }` ] = {
|
||||
this: [ 'wp', camelCaseDash( name ) ],
|
||||
};
|
||||
} );
|
||||
|
||||
const developmentCopies = mapVendorCopies( vendors, buildTarget );
|
||||
const minifiedCopies = mapVendorCopies( minifiedVendors, buildTarget );
|
||||
const minifyCopies = mapVendorCopies( minifyVendors, buildTarget ).map( ( copyCommand ) => {
|
||||
@ -184,7 +169,6 @@ module.exports = function( env = { environment: 'production', watch: false, buil
|
||||
},
|
||||
libraryTarget: 'this',
|
||||
},
|
||||
externals,
|
||||
resolve: {
|
||||
modules: [
|
||||
baseDir,
|
||||
@ -239,6 +223,9 @@ module.exports = function( env = { environment: 'production', watch: false, buil
|
||||
return path;
|
||||
},
|
||||
} ),
|
||||
new DependencyExtractionPlugin( {
|
||||
injectPolyfill: true,
|
||||
} ),
|
||||
new CopyWebpackPlugin(
|
||||
[
|
||||
...vendorCopies,
|
||||
|
||||
Loading…
Reference in New Issue
Block a user