From 0fbf5bcbd563dfb4987b6aed6d33d2973bdcfb79 Mon Sep 17 00:00:00 2001
From: Brad Griffith <bgriffith@deltasys.com>
Date: Thu, 6 Dec 2018 19:30:13 +0000
Subject: [PATCH 01/20] New build-config package with webpack config.

Pull the Gutenberg webpack config into a package so it can be re-used for
block/extension development.
---
 packages/build-config/README.md               |   2 +
 .../build-config/config/webpack.config.js     | 184 ++++++++++++++++++
 packages/build-config/package.json            |  27 +++
 3 files changed, 213 insertions(+)
 create mode 100644 packages/build-config/README.md
 create mode 100644 packages/build-config/config/webpack.config.js
 create mode 100644 packages/build-config/package.json

diff --git a/packages/build-config/README.md b/packages/build-config/README.md
new file mode 100644
index 00000000000000..8531700ebf4afe
--- /dev/null
+++ b/packages/build-config/README.md
@@ -0,0 +1,2 @@
+# Build Config
+
diff --git a/packages/build-config/config/webpack.config.js b/packages/build-config/config/webpack.config.js
new file mode 100644
index 00000000000000..d8ebf0556e195d
--- /dev/null
+++ b/packages/build-config/config/webpack.config.js
@@ -0,0 +1,184 @@
+/**
+ * External dependencies
+ */
+const WebpackRTLPlugin = require( 'webpack-rtl-plugin' );
+const LiveReloadPlugin = require( 'webpack-livereload-plugin' );
+const CopyWebpackPlugin = require( 'copy-webpack-plugin' );
+const postcss = require( 'postcss' );
+
+const { get } = require( 'lodash' );
+const { basename } = require( 'path' );
+
+const { BundleAnalyzerPlugin } = require( 'webpack-bundle-analyzer' );
+
+/**
+ * WordPress dependencies
+ */
+const CustomTemplatedPathPlugin = require( '@wordpress/custom-templated-path-webpack-plugin' );
+const LibraryExportDefaultPlugin = require( '@wordpress/library-export-default-webpack-plugin' );
+
+/**
+ * Internal dependencies
+ */
+const { dependencies } = require( './package' );
+
+const WORDPRESS_NAMESPACE = '@wordpress/';
+
+/**
+ * Given a string, returns a new string with dash separators converted to
+ * camelCase equivalent. This is not as aggressive as `_.camelCase` in
+ * converting to uppercase, where Lodash will also capitalize letters
+ * following numbers.
+ *
+ * @param {string} string Input dash-delimited string.
+ *
+ * @return {string} Camel-cased string.
+ */
+function camelCaseDash( string ) {
+	return string.replace(
+		/-([a-z])/g,
+		( match, letter ) => letter.toUpperCase()
+	);
+}
+
+const gutenbergPackages = Object.keys( dependencies )
+	.filter( ( packageName ) => packageName.startsWith( WORDPRESS_NAMESPACE ) )
+	.map( ( packageName ) => packageName.replace( WORDPRESS_NAMESPACE, '' ) );
+
+const externals = {
+	react: 'React',
+	'react-dom': 'ReactDOM',
+	tinymce: 'tinymce',
+	moment: 'moment',
+	jquery: 'jQuery',
+	lodash: 'lodash',
+	'lodash-es': 'lodash',
+};
+
+gutenbergPackages.forEach( ( name ) => {
+	externals[ WORDPRESS_NAMESPACE + name ] = {
+		this: [ 'wp', camelCaseDash( name ) ],
+	};
+} );
+
+const isProduction = process.env.NODE_ENV === 'production';
+const mode = isProduction ? 'production' : 'development';
+
+const config = {
+	mode,
+	entry: gutenbergPackages.reduce( ( memo, packageName ) => {
+		const name = camelCaseDash( packageName );
+		memo[ name ] = `./packages/${ packageName }`;
+		return memo;
+	}, {} ),
+	output: {
+		filename: './build/[basename]/index.js',
+		path: __dirname,
+		library: [ 'wp', '[name]' ],
+		libraryTarget: 'this',
+	},
+	externals,
+	resolve: {
+		modules: [
+			__dirname,
+			'node_modules',
+		],
+		alias: {
+			'lodash-es': 'lodash',
+		},
+	},
+	module: {
+		rules: [
+			{
+				test: /\.js$/,
+				use: [ 'source-map-loader' ],
+				enforce: 'pre',
+			},
+			{
+				test: /\.js$/,
+				exclude: [
+					/block-serialization-spec-parser/,
+					/is-shallow-equal/,
+					/node_modules/,
+				],
+				use: 'babel-loader',
+			},
+		],
+	},
+	plugins: [
+		// Create RTL files with a -rtl suffix
+		new WebpackRTLPlugin( {
+			suffix: '-rtl',
+			minify: process.env.NODE_ENV === 'production' ? { safe: true } : false,
+		} ),
+		new CustomTemplatedPathPlugin( {
+			basename( path, data ) {
+				let rawRequest;
+
+				const entryModule = get( data, [ 'chunk', 'entryModule' ], {} );
+				switch ( entryModule.type ) {
+					case 'javascript/auto':
+						rawRequest = entryModule.rawRequest;
+						break;
+
+					case 'javascript/esm':
+						rawRequest = entryModule.rootModule.rawRequest;
+						break;
+				}
+
+				if ( rawRequest ) {
+					return basename( rawRequest );
+				}
+
+				return path;
+			},
+		} ),
+		new LibraryExportDefaultPlugin( [
+			'api-fetch',
+			'deprecated',
+			'dom-ready',
+			'redux-routine',
+			'token-list',
+		].map( camelCaseDash ) ),
+		new CopyWebpackPlugin(
+			gutenbergPackages.map( ( packageName ) => ( {
+				from: `./packages/${ packageName }/build-style/*.css`,
+				to: `./build/${ packageName }/`,
+				flatten: true,
+				transform: ( content ) => {
+					if ( config.mode === 'production' ) {
+						return postcss( [
+							require( 'cssnano' )( {
+								preset: [ 'default', {
+									discardComments: {
+										removeAll: true,
+									},
+								} ],
+							} ),
+						] )
+							.process( content, { from: 'src/app.css', to: 'dest/app.css' } )
+							.then( ( result ) => result.css );
+					}
+					return content;
+				},
+			} ) )
+		),
+		// GUTENBERG_BUNDLE_ANALYZER global variable enables utility that represents bundle content
+		// as convenient interactive zoomable treemap.
+		process.env.GUTENBERG_BUNDLE_ANALYZER && new BundleAnalyzerPlugin(),
+		// GUTENBERG_LIVE_RELOAD_PORT global variable changes port on which live reload works
+		// when running watch mode.
+		! isProduction && new LiveReloadPlugin( { port: process.env.GUTENBERG_LIVE_RELOAD_PORT || 35729 } ),
+	].filter( Boolean ),
+	stats: {
+		children: false,
+	},
+};
+
+if ( ! isProduction ) {
+	// GUTENBERG_DEVTOOL global variable controls how source maps are generated.
+	// See: https://webpack.js.org/configuration/devtool/#devtool.
+	config.devtool = process.env.GUTENBERG_DEVTOOL || 'source-map';
+}
+
+module.exports = config;
diff --git a/packages/build-config/package.json b/packages/build-config/package.json
new file mode 100644
index 00000000000000..85ce075272cefa
--- /dev/null
+++ b/packages/build-config/package.json
@@ -0,0 +1,27 @@
+{
+	"name": "@wordpress/build-config",
+	"version": "1.0.0",
+	"description": "WordPress JavaScript build configuration.",
+	"author": "The WordPress Contributors",
+	"license": "GPL-2.0-or-later",
+	"keywords": [
+		"wordpress",
+		"build",
+		"config"
+	],
+	"homepage": "https://github.com/WordPress/gutenberg/tree/master/packages/build-config/README.md",
+	"repository": {
+		"type": "git",
+		"url": "https://github.com/WordPress/gutenberg.git"
+	},
+	"bugs": {
+		"url": "https://github.com/WordPress/gutenberg/issues"
+	},
+	"engines": {
+		"node": ">=8"
+	},
+	"main": "index.js",
+	"publishConfig": {
+		"access": "public"
+	}
+}

From 1c68315e45a282cba35c37f01ae612b36b6b2af2 Mon Sep 17 00:00:00 2001
From: Brad Griffith <bgriffith@deltasys.com>
Date: Thu, 6 Dec 2018 19:40:53 +0000
Subject: [PATCH 02/20] Require new build-config package.

---
 package.json | 1 +
 1 file changed, 1 insertion(+)

diff --git a/package.json b/package.json
index 8dd9929cfa023f..f99f38b26e232f 100644
--- a/package.json
+++ b/package.json
@@ -64,6 +64,7 @@
 		"@wordpress/babel-plugin-makepot": "file:packages/babel-plugin-makepot",
 		"@wordpress/babel-preset-default": "file:packages/babel-preset-default",
 		"@wordpress/browserslist-config": "file:packages/browserslist-config",
+		"@wordpress/build-config": "file:packages/build-config",
 		"@wordpress/custom-templated-path-webpack-plugin": "file:packages/custom-templated-path-webpack-plugin",
 		"@wordpress/e2e-test-utils": "file:packages/e2e-test-utils",
 		"@wordpress/e2e-tests": "file:packages/e2e-tests",

From 5314e5bd87b1507a16d5508c3f4eae37d0295ec7 Mon Sep 17 00:00:00 2001
From: Brad Griffith <bgriffith@deltasys.com>
Date: Thu, 6 Dec 2018 22:38:07 +0000
Subject: [PATCH 03/20] Dynamically handle WP externals with a function.

Use code from WP Calypso for handling WP externals so we don't have to have the
actual list of packages accessible in our webpack configuration.
---
 .../build-config/config/webpack.config.js     | 65 ++++++++++-------
 packages/build-config/index.js                |  6 ++
 packages/build-config/package.json            | 69 ++++++++++++++++++-
 3 files changed, 114 insertions(+), 26 deletions(-)
 create mode 100644 packages/build-config/index.js

diff --git a/packages/build-config/config/webpack.config.js b/packages/build-config/config/webpack.config.js
index d8ebf0556e195d..2dde253bc686a6 100644
--- a/packages/build-config/config/webpack.config.js
+++ b/packages/build-config/config/webpack.config.js
@@ -17,13 +17,6 @@ const { BundleAnalyzerPlugin } = require( 'webpack-bundle-analyzer' );
 const CustomTemplatedPathPlugin = require( '@wordpress/custom-templated-path-webpack-plugin' );
 const LibraryExportDefaultPlugin = require( '@wordpress/library-export-default-webpack-plugin' );
 
-/**
- * Internal dependencies
- */
-const { dependencies } = require( './package' );
-
-const WORDPRESS_NAMESPACE = '@wordpress/';
-
 /**
  * Given a string, returns a new string with dash separators converted to
  * camelCase equivalent. This is not as aggressive as `_.camelCase` in
@@ -41,29 +34,53 @@ function camelCaseDash( string ) {
 	);
 }
 
-const gutenbergPackages = Object.keys( dependencies )
-	.filter( ( packageName ) => packageName.startsWith( WORDPRESS_NAMESPACE ) )
-	.map( ( packageName ) => packageName.replace( WORDPRESS_NAMESPACE, '' ) );
-
-const externals = {
-	react: 'React',
-	'react-dom': 'ReactDOM',
-	tinymce: 'tinymce',
-	moment: 'moment',
-	jquery: 'jQuery',
-	lodash: 'lodash',
-	'lodash-es': 'lodash',
+/**
+ * Converts @wordpress require into window reference
+ *
+ * Note this isn't the same as camel case because of the
+ * way that numbers don't trigger the capitalized next letter
+ *
+ * @example
+ * wordpressRequire( '@wordpress/api-fetch' ) = 'wp.apiFetch'
+ * wordpressRequire( '@wordpress/i18n' ) = 'wp.i18n'
+ *
+ * @param {string} request import name
+ * @return {string} global variable reference for import
+ */
+const wordpressRequire = ( request ) => {
+	// @wordpress/components -> [ @wordpress, components ]
+	const [ , name ] = request.split( '/' );
+
+	// components -> wp.components
+	return `wp.${ name.replace( /-([a-z])/g, ( match, letter ) => letter.toUpperCase() ) }`;
 };
 
-gutenbergPackages.forEach( ( name ) => {
-	externals[ WORDPRESS_NAMESPACE + name ] = {
-		this: [ 'wp', camelCaseDash( name ) ],
-	};
-} );
+const wordpressExternals = ( context, request, callback ) =>
+	/^@wordpress\//.test( request ) ?
+		callback( null, `root ${ wordpressRequire( request ) }` ) :
+		callback();
+
+const externals = [
+	{
+		react: 'React',
+		'react-dom': 'ReactDOM',
+		tinymce: 'tinymce',
+		moment: 'moment',
+		jquery: 'jQuery',
+		lodash: 'lodash',
+		'lodash-es': 'lodash',
+		electron: 'electron',
+		wp: 'wp',
+	},
+	wordpressExternals,
+];
 
 const isProduction = process.env.NODE_ENV === 'production';
 const mode = isProduction ? 'production' : 'development';
 
+// @todo Move definition of this var and handling of it to Gutenberg root
+const gutenbergPackages = [ 'element' ];
+
 const config = {
 	mode,
 	entry: gutenbergPackages.reduce( ( memo, packageName ) => {
diff --git a/packages/build-config/index.js b/packages/build-config/index.js
new file mode 100644
index 00000000000000..56b88a5e9c8c03
--- /dev/null
+++ b/packages/build-config/index.js
@@ -0,0 +1,6 @@
+const webpackConfig = require( './config/webpack.config.js' );
+
+module.exports = {
+	webpackConfig,
+};
+
diff --git a/packages/build-config/package.json b/packages/build-config/package.json
index 85ce075272cefa..19bae5221cb314 100644
--- a/packages/build-config/package.json
+++ b/packages/build-config/package.json
@@ -18,9 +18,74 @@
 		"url": "https://github.com/WordPress/gutenberg/issues"
 	},
 	"engines": {
-		"node": ">=8"
+		"node": ">=8",
+		"npm": ">=6.0.0"
+	},
+	"files": [
+		"build",
+		"build-module"
+	],
+	"main": "build/index.js",
+	"module": "build-module/index.js",
+	"dependencies": {
+		"@babel/core": "7.0.0",
+		"@babel/runtime-corejs2": "7.0.0",
+		"@wordpress/babel-plugin-import-jsx-pragma": "file:packages/babel-plugin-import-jsx-pragma",
+		"@wordpress/babel-plugin-makepot": "file:packages/babel-plugin-makepot",
+		"@wordpress/babel-preset-default": "file:packages/babel-preset-default",
+		"@wordpress/browserslist-config": "file:packages/browserslist-config",
+		"@wordpress/build-config": "file:packages/build-config",
+		"@wordpress/custom-templated-path-webpack-plugin": "file:packages/custom-templated-path-webpack-plugin",
+		"@wordpress/eslint-config": "file:packages/eslint-config",
+		"@wordpress/jest-console": "file:packages/jest-console",
+		"@wordpress/jest-preset-default": "file:packages/jest-preset-default",
+		"@wordpress/library-export-default-webpack-plugin": "file:packages/library-export-default-webpack-plugin",
+		"@wordpress/npm-package-json-lint-config": "file:packages/npm-package-json-lint-config",
+		"@wordpress/postcss-themes": "file:packages/postcss-themes",
+		"@wordpress/scripts": "file:packages/scripts",
+		"autoprefixer": "8.2.0",
+		"babel-loader": "8.0.0",
+		"chalk": "2.4.1",
+		"check-node-version": "3.1.1",
+		"concurrently": "3.5.0",
+		"copy-webpack-plugin": "4.5.2",
+		"core-js": "2.5.7",
+		"cross-env": "3.2.4",
+		"cssnano": "4.0.3",
+		"deasync": "0.1.13",
+		"deep-freeze": "0.0.1",
+		"doctrine": "2.1.0",
+		"eslint-plugin-jest": "21.5.0",
+		"espree": "3.5.4",
+		"glob": "7.1.2",
+		"husky": "0.14.3",
+		"jest-puppeteer": "3.2.1",
+		"lerna": "3.4.3",
+		"lint-staged": "7.2.0",
+		"lodash": "4.17.10",
+		"mkdirp": "0.5.1",
+		"node-sass": "4.9.2",
+		"path-type": "3.0.0",
+		"pegjs": "0.10.0",
+		"phpegjs": "1.0.0-beta7",
+		"postcss-color-function": "4.0.1",
+		"puppeteer": "1.6.1",
+		"react-test-renderer": "16.6.3",
+		"rimraf": "2.6.2",
+		"rtlcss": "2.4.0",
+		"sass-loader": "6.0.7",
+		"source-map-loader": "0.2.3",
+		"sprintf-js": "1.1.1",
+		"stylelint": "9.5.0",
+		"stylelint-config-wordpress": "13.1.0",
+		"symlink-or-copy": "1.2.0",
+		"uuid": "3.3.2",
+		"webpack": "4.8.3",
+		"webpack-bundle-analyzer": "3.0.2",
+		"webpack-cli": "2.1.3",
+		"webpack-livereload-plugin": "2.1.1",
+		"webpack-rtl-plugin": "github:yoavf/webpack-rtl-plugin#develop"
 	},
-	"main": "index.js",
 	"publishConfig": {
 		"access": "public"
 	}

From a519527482070546cffa53c94802d9902cc3e8a4 Mon Sep 17 00:00:00 2001
From: Brad Griffith <bgriffith@deltasys.com>
Date: Thu, 6 Dec 2018 22:39:54 +0000
Subject: [PATCH 04/20] Use webpack config from build-config package.

---
 .../build-config/config/webpack.config.js     |   1 -
 webpack.config.js                             | 185 +-----------------
 2 files changed, 2 insertions(+), 184 deletions(-)

diff --git a/packages/build-config/config/webpack.config.js b/packages/build-config/config/webpack.config.js
index 2dde253bc686a6..1a922106832317 100644
--- a/packages/build-config/config/webpack.config.js
+++ b/packages/build-config/config/webpack.config.js
@@ -64,7 +64,6 @@ const externals = [
 	{
 		react: 'React',
 		'react-dom': 'ReactDOM',
-		tinymce: 'tinymce',
 		moment: 'moment',
 		jquery: 'jQuery',
 		lodash: 'lodash',
diff --git a/webpack.config.js b/webpack.config.js
index c67b8c95c804dd..71154b15300a8c 100644
--- a/webpack.config.js
+++ b/webpack.config.js
@@ -1,188 +1,7 @@
-/**
- * External dependencies
- */
-const { DefinePlugin } = require( 'webpack' );
-const WebpackRTLPlugin = require( 'webpack-rtl-plugin' );
-const LiveReloadPlugin = require( 'webpack-livereload-plugin' );
-const CopyWebpackPlugin = require( 'copy-webpack-plugin' );
-const postcss = require( 'postcss' );
-
-const { get } = require( 'lodash' );
-const { basename } = require( 'path' );
-
 /**
  * WordPress dependencies
  */
-const CustomTemplatedPathPlugin = require( '@wordpress/custom-templated-path-webpack-plugin' );
-const LibraryExportDefaultPlugin = require( '@wordpress/library-export-default-webpack-plugin' );
-const { BundleAnalyzerPlugin } = require( 'webpack-bundle-analyzer' );
-
-/**
- * Internal dependencies
- */
-const { dependencies } = require( './package' );
-
-const WORDPRESS_NAMESPACE = '@wordpress/';
-
-/**
- * Given a string, returns a new string with dash separators converted to
- * camelCase equivalent. This is not as aggressive as `_.camelCase` in
- * converting to uppercase, where Lodash will also capitalize letters
- * following numbers.
- *
- * @param {string} string Input dash-delimited string.
- *
- * @return {string} Camel-cased string.
- */
-function camelCaseDash( string ) {
-	return string.replace(
-		/-([a-z])/g,
-		( match, letter ) => letter.toUpperCase()
-	);
-}
-
-const gutenbergPackages = Object.keys( dependencies )
-	.filter( ( packageName ) => packageName.startsWith( WORDPRESS_NAMESPACE ) )
-	.map( ( packageName ) => packageName.replace( WORDPRESS_NAMESPACE, '' ) );
-
-const externals = {
-	react: 'React',
-	'react-dom': 'ReactDOM',
-	moment: 'moment',
-	jquery: 'jQuery',
-	lodash: 'lodash',
-	'lodash-es': 'lodash',
-};
-
-gutenbergPackages.forEach( ( name ) => {
-	externals[ WORDPRESS_NAMESPACE + name ] = {
-		this: [ 'wp', camelCaseDash( name ) ],
-	};
-} );
-
-const isProduction = process.env.NODE_ENV === 'production';
-const mode = isProduction ? 'production' : 'development';
-
-const config = {
-	mode,
-	entry: gutenbergPackages.reduce( ( memo, packageName ) => {
-		const name = camelCaseDash( packageName );
-		memo[ name ] = `./packages/${ packageName }`;
-		return memo;
-	}, {} ),
-	output: {
-		filename: './build/[basename]/index.js',
-		path: __dirname,
-		library: [ 'wp', '[name]' ],
-		libraryTarget: 'this',
-	},
-	externals,
-	resolve: {
-		modules: [
-			__dirname,
-			'node_modules',
-		],
-		alias: {
-			'lodash-es': 'lodash',
-		},
-	},
-	module: {
-		rules: [
-			{
-				test: /\.js$/,
-				use: [ 'source-map-loader' ],
-				enforce: 'pre',
-			},
-			{
-				test: /\.js$/,
-				exclude: [
-					/block-serialization-spec-parser/,
-					/is-shallow-equal/,
-					/node_modules/,
-				],
-				use: 'babel-loader',
-			},
-		],
-	},
-	plugins: [
-		new DefinePlugin( {
-			// Inject the `GUTENBERG_PHASE` global, used for feature flagging.
-			// eslint-disable-next-line @wordpress/gutenberg-phase
-			'process.env.GUTENBERG_PHASE': JSON.stringify( parseInt( process.env.npm_package_config_GUTENBERG_PHASE, 10 ) || 1 ),
-		} ),
-		// Create RTL files with a -rtl suffix
-		new WebpackRTLPlugin( {
-			suffix: '-rtl',
-			minify: process.env.NODE_ENV === 'production' ? { safe: true } : false,
-		} ),
-		new CustomTemplatedPathPlugin( {
-			basename( path, data ) {
-				let rawRequest;
-
-				const entryModule = get( data, [ 'chunk', 'entryModule' ], {} );
-				switch ( entryModule.type ) {
-					case 'javascript/auto':
-						rawRequest = entryModule.rawRequest;
-						break;
-
-					case 'javascript/esm':
-						rawRequest = entryModule.rootModule.rawRequest;
-						break;
-				}
-
-				if ( rawRequest ) {
-					return basename( rawRequest );
-				}
-
-				return path;
-			},
-		} ),
-		new LibraryExportDefaultPlugin( [
-			'api-fetch',
-			'deprecated',
-			'dom-ready',
-			'redux-routine',
-			'token-list',
-		].map( camelCaseDash ) ),
-		new CopyWebpackPlugin(
-			gutenbergPackages.map( ( packageName ) => ( {
-				from: `./packages/${ packageName }/build-style/*.css`,
-				to: `./build/${ packageName }/`,
-				flatten: true,
-				transform: ( content ) => {
-					if ( config.mode === 'production' ) {
-						return postcss( [
-							require( 'cssnano' )( {
-								preset: [ 'default', {
-									discardComments: {
-										removeAll: true,
-									},
-								} ],
-							} ),
-						] )
-							.process( content, { from: 'src/app.css', to: 'dest/app.css' } )
-							.then( ( result ) => result.css );
-					}
-					return content;
-				},
-			} ) )
-		),
-		// GUTENBERG_BUNDLE_ANALYZER global variable enables utility that represents bundle content
-		// as convenient interactive zoomable treemap.
-		process.env.GUTENBERG_BUNDLE_ANALYZER && new BundleAnalyzerPlugin(),
-		// GUTENBERG_LIVE_RELOAD_PORT global variable changes port on which live reload works
-		// when running watch mode.
-		! isProduction && new LiveReloadPlugin( { port: process.env.GUTENBERG_LIVE_RELOAD_PORT || 35729 } ),
-	].filter( Boolean ),
-	stats: {
-		children: false,
-	},
-};
 
-if ( ! isProduction ) {
-	// GUTENBERG_DEVTOOL global variable controls how source maps are generated.
-	// See: https://webpack.js.org/configuration/devtool/#devtool.
-	config.devtool = process.env.GUTENBERG_DEVTOOL || 'source-map';
-}
+const webpackConfig = require( '@wordpress/build-config' ).webpackConfig;
 
-module.exports = config;
+module.exports = webpackConfig;

From 89af8f0198200611b6f6f5c5d8b92d51d34f6085 Mon Sep 17 00:00:00 2001
From: Brad Griffith <bgriffith@deltasys.com>
Date: Thu, 6 Dec 2018 22:40:20 +0000
Subject: [PATCH 05/20] Require build-config package.

---
 package-lock.json | 4 ++++
 1 file changed, 4 insertions(+)

diff --git a/package-lock.json b/package-lock.json
index 55d51e8dce8bb0..d092410c6f448a 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -2593,6 +2593,10 @@
 			"version": "file:packages/browserslist-config",
 			"dev": true
 		},
+		"@wordpress/build-config": {
+			"version": "file:packages/build-config",
+			"dev": true
+		},
 		"@wordpress/components": {
 			"version": "file:packages/components",
 			"requires": {

From 942261f310b376edc02ac685988eef76b6531785 Mon Sep 17 00:00:00 2001
From: Brad Griffith <bgriffith@deltasys.com>
Date: Fri, 7 Dec 2018 09:58:38 +0000
Subject: [PATCH 06/20] Adjust file refs for WP packages.

---
 packages/build-config/package.json | 26 +++++++++++---------------
 1 file changed, 11 insertions(+), 15 deletions(-)

diff --git a/packages/build-config/package.json b/packages/build-config/package.json
index 19bae5221cb314..bad5afa7be0e36 100644
--- a/packages/build-config/package.json
+++ b/packages/build-config/package.json
@@ -30,28 +30,24 @@
 	"dependencies": {
 		"@babel/core": "7.0.0",
 		"@babel/runtime-corejs2": "7.0.0",
-		"@wordpress/babel-plugin-import-jsx-pragma": "file:packages/babel-plugin-import-jsx-pragma",
-		"@wordpress/babel-plugin-makepot": "file:packages/babel-plugin-makepot",
-		"@wordpress/babel-preset-default": "file:packages/babel-preset-default",
-		"@wordpress/browserslist-config": "file:packages/browserslist-config",
-		"@wordpress/build-config": "file:packages/build-config",
-		"@wordpress/custom-templated-path-webpack-plugin": "file:packages/custom-templated-path-webpack-plugin",
-		"@wordpress/eslint-config": "file:packages/eslint-config",
-		"@wordpress/jest-console": "file:packages/jest-console",
-		"@wordpress/jest-preset-default": "file:packages/jest-preset-default",
-		"@wordpress/library-export-default-webpack-plugin": "file:packages/library-export-default-webpack-plugin",
-		"@wordpress/npm-package-json-lint-config": "file:packages/npm-package-json-lint-config",
-		"@wordpress/postcss-themes": "file:packages/postcss-themes",
-		"@wordpress/scripts": "file:packages/scripts",
+		"@wordpress/babel-plugin-import-jsx-pragma": "file:../babel-plugin-import-jsx-pragma",
+		"@wordpress/babel-plugin-makepot": "file:../babel-plugin-makepot",
+		"@wordpress/babel-preset-default": "file:../babel-preset-default",
+		"@wordpress/browserslist-config": "file:../browserslist-config",
+		"@wordpress/custom-templated-path-webpack-plugin": "file:../custom-templated-path-webpack-plugin",
+		"@wordpress/eslint-config": "file:../eslint-config",
+		"@wordpress/jest-console": "file:../jest-console",
+		"@wordpress/jest-preset-default": "file:../jest-preset-default",
+		"@wordpress/library-export-default-webpack-plugin": "file:../library-export-default-webpack-plugin",
+		"@wordpress/npm-package-json-lint-config": "file:../npm-package-json-lint-config",
+		"@wordpress/postcss-themes": "file:../postcss-themes",
 		"autoprefixer": "8.2.0",
 		"babel-loader": "8.0.0",
 		"chalk": "2.4.1",
 		"check-node-version": "3.1.1",
 		"concurrently": "3.5.0",
-		"copy-webpack-plugin": "4.5.2",
 		"core-js": "2.5.7",
 		"cross-env": "3.2.4",
-		"cssnano": "4.0.3",
 		"deasync": "0.1.13",
 		"deep-freeze": "0.0.1",
 		"doctrine": "2.1.0",

From 3c6cd931bdc6e8d50e75bb5bc812fafddd8b9bfa Mon Sep 17 00:00:00 2001
From: Brad Griffith <bgriffith@deltasys.com>
Date: Fri, 7 Dec 2018 09:59:20 +0000
Subject: [PATCH 07/20] Move main gutenberg entry definition and webpack copy
 plugin out of build-config.

---
 .../build-config/config/webpack.config.js     | 33 ----------
 webpack.config.js                             | 66 +++++++++++++++++++
 2 files changed, 66 insertions(+), 33 deletions(-)

diff --git a/packages/build-config/config/webpack.config.js b/packages/build-config/config/webpack.config.js
index 1a922106832317..2e45e14059d1d4 100644
--- a/packages/build-config/config/webpack.config.js
+++ b/packages/build-config/config/webpack.config.js
@@ -3,8 +3,6 @@
  */
 const WebpackRTLPlugin = require( 'webpack-rtl-plugin' );
 const LiveReloadPlugin = require( 'webpack-livereload-plugin' );
-const CopyWebpackPlugin = require( 'copy-webpack-plugin' );
-const postcss = require( 'postcss' );
 
 const { get } = require( 'lodash' );
 const { basename } = require( 'path' );
@@ -77,16 +75,8 @@ const externals = [
 const isProduction = process.env.NODE_ENV === 'production';
 const mode = isProduction ? 'production' : 'development';
 
-// @todo Move definition of this var and handling of it to Gutenberg root
-const gutenbergPackages = [ 'element' ];
-
 const config = {
 	mode,
-	entry: gutenbergPackages.reduce( ( memo, packageName ) => {
-		const name = camelCaseDash( packageName );
-		memo[ name ] = `./packages/${ packageName }`;
-		return memo;
-	}, {} ),
 	output: {
 		filename: './build/[basename]/index.js',
 		path: __dirname,
@@ -156,29 +146,6 @@ const config = {
 			'redux-routine',
 			'token-list',
 		].map( camelCaseDash ) ),
-		new CopyWebpackPlugin(
-			gutenbergPackages.map( ( packageName ) => ( {
-				from: `./packages/${ packageName }/build-style/*.css`,
-				to: `./build/${ packageName }/`,
-				flatten: true,
-				transform: ( content ) => {
-					if ( config.mode === 'production' ) {
-						return postcss( [
-							require( 'cssnano' )( {
-								preset: [ 'default', {
-									discardComments: {
-										removeAll: true,
-									},
-								} ],
-							} ),
-						] )
-							.process( content, { from: 'src/app.css', to: 'dest/app.css' } )
-							.then( ( result ) => result.css );
-					}
-					return content;
-				},
-			} ) )
-		),
 		// GUTENBERG_BUNDLE_ANALYZER global variable enables utility that represents bundle content
 		// as convenient interactive zoomable treemap.
 		process.env.GUTENBERG_BUNDLE_ANALYZER && new BundleAnalyzerPlugin(),
diff --git a/webpack.config.js b/webpack.config.js
index 71154b15300a8c..97751fed64dc74 100644
--- a/webpack.config.js
+++ b/webpack.config.js
@@ -1,7 +1,73 @@
+/**
+ * External dependencies
+ */
+const CopyWebpackPlugin = require( 'copy-webpack-plugin' );
+const postcss = require( 'postcss' );
+
 /**
  * WordPress dependencies
  */
 
 const webpackConfig = require( '@wordpress/build-config' ).webpackConfig;
 
+/**
+ * Internal dependencies
+ */
+const { dependencies } = require( './package' );
+
+const WORDPRESS_NAMESPACE = '@wordpress/';
+
+/**
+ * Given a string, returns a new string with dash separators converted to
+ * camelCase equivalent. This is not as aggressive as `_.camelCase` in
+ * converting to uppercase, where Lodash will also capitalize letters
+ * following numbers.
+ *
+ * @param {string} string Input dash-delimited string.
+ *
+ * @return {string} Camel-cased string.
+ */
+function camelCaseDash( string ) {
+	return string.replace(
+		/-([a-z])/g,
+		( match, letter ) => letter.toUpperCase()
+	);
+}
+
+const gutenbergPackages = Object.keys( dependencies )
+	.filter( ( packageName ) => packageName.startsWith( WORDPRESS_NAMESPACE ) )
+	.map( ( packageName ) => packageName.replace( WORDPRESS_NAMESPACE, '' ) );
+
+webpackConfig.entry = gutenbergPackages.reduce( ( memo, packageName ) => {
+	const name = camelCaseDash( packageName );
+	memo[ name ] = `./packages/${ packageName }`;
+	return memo;
+}, {} );
+
+webpackConfig.plugins.push(
+	new CopyWebpackPlugin(
+		gutenbergPackages.map( ( packageName ) => ( {
+			from: `./packages/${ packageName }/build-style/*.css`,
+			to: `./build/${ packageName }/`,
+			flatten: true,
+			transform: ( content ) => {
+				if ( webpackConfig.mode === 'production' ) {
+					return postcss( [
+						require( 'cssnano' )( {
+							preset: [ 'default', {
+								discardComments: {
+									removeAll: true,
+								},
+							} ],
+						} ),
+					] )
+						.process( content, { from: 'src/app.css', to: 'dest/app.css' } )
+						.then( ( result ) => result.css );
+				}
+				return content;
+			},
+		} ) )
+	)
+);
+
 module.exports = webpackConfig;

From 2c4f675d102aec0f0723e1bda523ff26def98834 Mon Sep 17 00:00:00 2001
From: Brad Griffith <bgriffith@deltasys.com>
Date: Fri, 7 Dec 2018 10:12:06 +0000
Subject: [PATCH 08/20] Add react-dev-utils for formatting webpack compiler
 messages.

---
 packages/scripts/package.json | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/packages/scripts/package.json b/packages/scripts/package.json
index 8aaf6e8ee7ac67..b4bb27b6c8c2c4 100644
--- a/packages/scripts/package.json
+++ b/packages/scripts/package.json
@@ -32,6 +32,7 @@
 	},
 	"dependencies": {
 		"@wordpress/babel-preset-default": "file:../babel-preset-default",
+		"@wordpress/build-config": "file:../build-config",
 		"@wordpress/eslint-plugin": "file:../eslint-plugin",
 		"@wordpress/jest-preset-default": "file:../jest-preset-default",
 		"@wordpress/npm-package-json-lint-config": "file:../npm-package-json-lint-config",
@@ -43,6 +44,7 @@
 		"jest-puppeteer": "3.2.1",
 		"npm-package-json-lint": "^3.3.1",
 		"puppeteer": "1.6.1",
+		"react-dev-utils": "^6.1.1",
 		"read-pkg-up": "^1.0.1",
 		"resolve-bin": "^0.4.0",
 		"stylelint": "^9.10.1",

From fff197dff1be7dd38cc3fdcef152f8fc819dc01a Mon Sep 17 00:00:00 2001
From: Brad Griffith <bgriffith@deltasys.com>
Date: Fri, 7 Dec 2018 11:39:54 +0000
Subject: [PATCH 09/20] Implement build script using webpack config from
 build-config.

---
 packages/scripts/package.json     | 2 --
 packages/scripts/scripts/build.js | 1 -
 2 files changed, 3 deletions(-)

diff --git a/packages/scripts/package.json b/packages/scripts/package.json
index b4bb27b6c8c2c4..8aaf6e8ee7ac67 100644
--- a/packages/scripts/package.json
+++ b/packages/scripts/package.json
@@ -32,7 +32,6 @@
 	},
 	"dependencies": {
 		"@wordpress/babel-preset-default": "file:../babel-preset-default",
-		"@wordpress/build-config": "file:../build-config",
 		"@wordpress/eslint-plugin": "file:../eslint-plugin",
 		"@wordpress/jest-preset-default": "file:../jest-preset-default",
 		"@wordpress/npm-package-json-lint-config": "file:../npm-package-json-lint-config",
@@ -44,7 +43,6 @@
 		"jest-puppeteer": "3.2.1",
 		"npm-package-json-lint": "^3.3.1",
 		"puppeteer": "1.6.1",
-		"react-dev-utils": "^6.1.1",
 		"read-pkg-up": "^1.0.1",
 		"resolve-bin": "^0.4.0",
 		"stylelint": "^9.10.1",
diff --git a/packages/scripts/scripts/build.js b/packages/scripts/scripts/build.js
index 9470274f76633c..ea2c7d303f2fa0 100644
--- a/packages/scripts/scripts/build.js
+++ b/packages/scripts/scripts/build.js
@@ -32,4 +32,3 @@ if ( hasWebpackConfig ) {
 	console.log( 'Webpack config file is missing.' );
 	process.exit( 1 );
 }
-

From 76e3848644b577581e89d5074454e0a3d7cb205c Mon Sep 17 00:00:00 2001
From: Brad Griffith <bgriffith@deltasys.com>
Date: Fri, 7 Dec 2018 14:24:16 +0000
Subject: [PATCH 10/20] Adjust output path so build goes to working directory.

---
 packages/build-config/config/webpack.config.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/build-config/config/webpack.config.js b/packages/build-config/config/webpack.config.js
index 2e45e14059d1d4..694582638f437a 100644
--- a/packages/build-config/config/webpack.config.js
+++ b/packages/build-config/config/webpack.config.js
@@ -79,7 +79,7 @@ const config = {
 	mode,
 	output: {
 		filename: './build/[basename]/index.js',
-		path: __dirname,
+		path: process.cwd(),
 		library: [ 'wp', '[name]' ],
 		libraryTarget: 'this',
 	},

From 5f4eeda4dcd6f3950e1f8ef918ce427f08e25261 Mon Sep 17 00:00:00 2001
From: Grzegorz Ziolkowski <grzegorz@gziolo.pl>
Date: Mon, 11 Feb 2019 16:05:30 +0100
Subject: [PATCH 11/20] Update package name to webpack-config

---
 docs/manifest.json                            |  6 ++
 package-lock.json                             | 59 ++++++++++---
 package.json                                  |  5 +-
 packages/build-config/README.md               |  2 -
 packages/build-config/index.js                |  6 --
 packages/build-config/package.json            | 88 -------------------
 packages/webpack-config/.npmrc                |  1 +
 packages/webpack-config/CHANGELOG.md          |  3 +
 packages/webpack-config/README.md             | 13 +++
 .../index.js}                                 | 68 +-------------
 packages/webpack-config/package.json          | 32 +++++++
 webpack.config.js                             | 43 ++++++++-
 12 files changed, 145 insertions(+), 181 deletions(-)
 delete mode 100644 packages/build-config/README.md
 delete mode 100644 packages/build-config/index.js
 delete mode 100644 packages/build-config/package.json
 create mode 100644 packages/webpack-config/.npmrc
 create mode 100644 packages/webpack-config/CHANGELOG.md
 create mode 100644 packages/webpack-config/README.md
 rename packages/{build-config/config/webpack.config.js => webpack-config/index.js} (61%)
 create mode 100644 packages/webpack-config/package.json

diff --git a/docs/manifest.json b/docs/manifest.json
index 026790426f1ecd..92c289d9f72acd 100644
--- a/docs/manifest.json
+++ b/docs/manifest.json
@@ -833,6 +833,12 @@
 		"markdown_source": "https://raw.githubusercontent.com/WordPress/gutenberg/master/packages/viewport/README.md",
 		"parent": "packages"
 	},
+	{
+		"title": "@wordpress/webpack-config",
+		"slug": "packages-webpack-config",
+		"markdown_source": "https://raw.githubusercontent.com/WordPress/gutenberg/master/packages/webpack-config/README.md",
+		"parent": "packages"
+	},
 	{
 		"title": "@wordpress/wordcount",
 		"slug": "packages-wordcount",
diff --git a/package-lock.json b/package-lock.json
index d092410c6f448a..9d63b5628ecbb4 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -2593,10 +2593,6 @@
 			"version": "file:packages/browserslist-config",
 			"dev": true
 		},
-		"@wordpress/build-config": {
-			"version": "file:packages/build-config",
-			"dev": true
-		},
 		"@wordpress/components": {
 			"version": "file:packages/components",
 			"requires": {
@@ -3049,6 +3045,14 @@
 				"lodash": "^4.17.11"
 			}
 		},
+		"@wordpress/webpack-config": {
+			"version": "file:packages/webpack-config",
+			"dev": true,
+			"requires": {
+				"webpack-bundle-analyzer": "^3.0.3",
+				"webpack-livereload-plugin": "^2.2.0"
+			}
+		},
 		"@wordpress/wordcount": {
 			"version": "file:packages/wordcount",
 			"requires": {
@@ -15960,6 +15964,34 @@
 			"integrity": "sha512-2qHaIQr2VLRFoxe2nASzsV6ef4yOOH+Fi9FBOVH6cqeSgUnoyySPZkxzLuzd+RYOQTRpROA0ztTMqxROKSb/nA==",
 			"dev": true
 		},
+		"portfinder": {
+			"version": "1.0.20",
+			"resolved": "https://registry.npmjs.org/portfinder/-/portfinder-1.0.20.tgz",
+			"integrity": "sha512-Yxe4mTyDzTd59PZJY4ojZR8F+E5e97iq2ZOHPz3HDgSvYC5siNad2tLooQ5y5QHyQhc3xVqvyk/eNA3wuoa7Sw==",
+			"dev": true,
+			"requires": {
+				"async": "^1.5.2",
+				"debug": "^2.2.0",
+				"mkdirp": "0.5.x"
+			},
+			"dependencies": {
+				"async": {
+					"version": "1.5.2",
+					"resolved": "https://registry.npmjs.org/async/-/async-1.5.2.tgz",
+					"integrity": "sha1-7GphrlZIDAw8skHJVhjiCJL5Zyo=",
+					"dev": true
+				},
+				"debug": {
+					"version": "2.6.9",
+					"resolved": "https://registry.npmjs.org/debug/-/debug-2.6.9.tgz",
+					"integrity": "sha512-bC7ElrdJaJnPbAP+1EotYvqZsb3ecl5wi6Bfi6BJTUcNowp6cvspg0jXznRTKDjm/E7AdgFBVeAPVMNcKGsHMA==",
+					"dev": true,
+					"requires": {
+						"ms": "2.0.0"
+					}
+				}
+			}
+		},
 		"posix-character-classes": {
 			"version": "0.1.1",
 			"resolved": "https://registry.npmjs.org/posix-character-classes/-/posix-character-classes-0.1.1.tgz",
@@ -21824,9 +21856,9 @@
 			}
 		},
 		"webpack-bundle-analyzer": {
-			"version": "3.0.2",
-			"resolved": "https://registry.npmjs.org/webpack-bundle-analyzer/-/webpack-bundle-analyzer-3.0.2.tgz",
-			"integrity": "sha512-cZG4wSQtKrSpk5RJ33dxiaAyo8bP0V+JvycAyIDFEiDIhw4LHhhVKhn40YT1w6TR9E4scHA00LnIoBtTA13Mow==",
+			"version": "3.0.3",
+			"resolved": "https://registry.npmjs.org/webpack-bundle-analyzer/-/webpack-bundle-analyzer-3.0.3.tgz",
+			"integrity": "sha512-naLWiRfmtH4UJgtUktRTLw6FdoZJ2RvCR9ePbwM9aRMsS/KjFerkPZG9epEvXRAw5d5oPdrs9+3p+afNjxW8Xw==",
 			"dev": true,
 			"requires": {
 				"acorn": "^5.7.3",
@@ -21850,9 +21882,9 @@
 					"dev": true
 				},
 				"commander": {
-					"version": "2.18.0",
-					"resolved": "https://registry.npmjs.org/commander/-/commander-2.18.0.tgz",
-					"integrity": "sha512-6CYPa+JP2ftfRU2qkDK+UTVeQYosOg/2GbcjIcKPHfinyOLPVGXu/ovN86RP49Re5ndJK1N0kuiidFFuepc4ZQ==",
+					"version": "2.19.0",
+					"resolved": "https://registry.npmjs.org/commander/-/commander-2.19.0.tgz",
+					"integrity": "sha512-6tvAOO+D6OENvRAh524Dh9jcfKTYDQAqvqezbCW82xj5X0pSrcpxtvRKHLG0yBY6SD7PSDrJaj+0AiOcKVd1Xg==",
 					"dev": true
 				}
 			}
@@ -22056,11 +22088,12 @@
 			}
 		},
 		"webpack-livereload-plugin": {
-			"version": "2.1.1",
-			"resolved": "https://registry.npmjs.org/webpack-livereload-plugin/-/webpack-livereload-plugin-2.1.1.tgz",
-			"integrity": "sha512-W7Q55QbPvVJotpIZSjjwzmqQ22333ExYxWM3WFlHKkbPStQqVRSmJkjntUqXF9jtpdeXi8r8HLkA1RVnAP0SQA==",
+			"version": "2.2.0",
+			"resolved": "https://registry.npmjs.org/webpack-livereload-plugin/-/webpack-livereload-plugin-2.2.0.tgz",
+			"integrity": "sha512-sx9xA5mHoNOUgLQI0PmXT3KV9ecsVmUaTgr+fsoL69qAOHw/7VzkL1+ZMDQ8n0dPbWounswK6cBRSgMod7Nhgg==",
 			"dev": true,
 			"requires": {
+				"portfinder": "^1.0.17",
 				"tiny-lr": "^1.1.1"
 			}
 		},
diff --git a/package.json b/package.json
index f99f38b26e232f..e0faf638466d92 100644
--- a/package.json
+++ b/package.json
@@ -64,7 +64,6 @@
 		"@wordpress/babel-plugin-makepot": "file:packages/babel-plugin-makepot",
 		"@wordpress/babel-preset-default": "file:packages/babel-preset-default",
 		"@wordpress/browserslist-config": "file:packages/browserslist-config",
-		"@wordpress/build-config": "file:packages/build-config",
 		"@wordpress/custom-templated-path-webpack-plugin": "file:packages/custom-templated-path-webpack-plugin",
 		"@wordpress/e2e-test-utils": "file:packages/e2e-test-utils",
 		"@wordpress/e2e-tests": "file:packages/e2e-tests",
@@ -76,6 +75,7 @@
 		"@wordpress/npm-package-json-lint-config": "file:packages/npm-package-json-lint-config",
 		"@wordpress/postcss-themes": "file:packages/postcss-themes",
 		"@wordpress/scripts": "file:packages/scripts",
+		"@wordpress/webpack-config": "file:packages/webpack-config",
 		"babel-loader": "8.0.5",
 		"benchmark": "2.1.4",
 		"browserslist": "4.4.1",
@@ -118,9 +118,6 @@
 		"sprintf-js": "1.1.1",
 		"stylelint-config-wordpress": "13.1.0",
 		"uuid": "3.3.2",
-		"webpack": "4.8.3",
-		"webpack-bundle-analyzer": "3.0.2",
-		"webpack-livereload-plugin": "2.1.1",
 		"webpack-rtl-plugin": "github:yoavf/webpack-rtl-plugin#develop"
 	},
 	"npmPackageJsonLintConfig": {
diff --git a/packages/build-config/README.md b/packages/build-config/README.md
deleted file mode 100644
index 8531700ebf4afe..00000000000000
--- a/packages/build-config/README.md
+++ /dev/null
@@ -1,2 +0,0 @@
-# Build Config
-
diff --git a/packages/build-config/index.js b/packages/build-config/index.js
deleted file mode 100644
index 56b88a5e9c8c03..00000000000000
--- a/packages/build-config/index.js
+++ /dev/null
@@ -1,6 +0,0 @@
-const webpackConfig = require( './config/webpack.config.js' );
-
-module.exports = {
-	webpackConfig,
-};
-
diff --git a/packages/build-config/package.json b/packages/build-config/package.json
deleted file mode 100644
index bad5afa7be0e36..00000000000000
--- a/packages/build-config/package.json
+++ /dev/null
@@ -1,88 +0,0 @@
-{
-	"name": "@wordpress/build-config",
-	"version": "1.0.0",
-	"description": "WordPress JavaScript build configuration.",
-	"author": "The WordPress Contributors",
-	"license": "GPL-2.0-or-later",
-	"keywords": [
-		"wordpress",
-		"build",
-		"config"
-	],
-	"homepage": "https://github.com/WordPress/gutenberg/tree/master/packages/build-config/README.md",
-	"repository": {
-		"type": "git",
-		"url": "https://github.com/WordPress/gutenberg.git"
-	},
-	"bugs": {
-		"url": "https://github.com/WordPress/gutenberg/issues"
-	},
-	"engines": {
-		"node": ">=8",
-		"npm": ">=6.0.0"
-	},
-	"files": [
-		"build",
-		"build-module"
-	],
-	"main": "build/index.js",
-	"module": "build-module/index.js",
-	"dependencies": {
-		"@babel/core": "7.0.0",
-		"@babel/runtime-corejs2": "7.0.0",
-		"@wordpress/babel-plugin-import-jsx-pragma": "file:../babel-plugin-import-jsx-pragma",
-		"@wordpress/babel-plugin-makepot": "file:../babel-plugin-makepot",
-		"@wordpress/babel-preset-default": "file:../babel-preset-default",
-		"@wordpress/browserslist-config": "file:../browserslist-config",
-		"@wordpress/custom-templated-path-webpack-plugin": "file:../custom-templated-path-webpack-plugin",
-		"@wordpress/eslint-config": "file:../eslint-config",
-		"@wordpress/jest-console": "file:../jest-console",
-		"@wordpress/jest-preset-default": "file:../jest-preset-default",
-		"@wordpress/library-export-default-webpack-plugin": "file:../library-export-default-webpack-plugin",
-		"@wordpress/npm-package-json-lint-config": "file:../npm-package-json-lint-config",
-		"@wordpress/postcss-themes": "file:../postcss-themes",
-		"autoprefixer": "8.2.0",
-		"babel-loader": "8.0.0",
-		"chalk": "2.4.1",
-		"check-node-version": "3.1.1",
-		"concurrently": "3.5.0",
-		"core-js": "2.5.7",
-		"cross-env": "3.2.4",
-		"deasync": "0.1.13",
-		"deep-freeze": "0.0.1",
-		"doctrine": "2.1.0",
-		"eslint-plugin-jest": "21.5.0",
-		"espree": "3.5.4",
-		"glob": "7.1.2",
-		"husky": "0.14.3",
-		"jest-puppeteer": "3.2.1",
-		"lerna": "3.4.3",
-		"lint-staged": "7.2.0",
-		"lodash": "4.17.10",
-		"mkdirp": "0.5.1",
-		"node-sass": "4.9.2",
-		"path-type": "3.0.0",
-		"pegjs": "0.10.0",
-		"phpegjs": "1.0.0-beta7",
-		"postcss-color-function": "4.0.1",
-		"puppeteer": "1.6.1",
-		"react-test-renderer": "16.6.3",
-		"rimraf": "2.6.2",
-		"rtlcss": "2.4.0",
-		"sass-loader": "6.0.7",
-		"source-map-loader": "0.2.3",
-		"sprintf-js": "1.1.1",
-		"stylelint": "9.5.0",
-		"stylelint-config-wordpress": "13.1.0",
-		"symlink-or-copy": "1.2.0",
-		"uuid": "3.3.2",
-		"webpack": "4.8.3",
-		"webpack-bundle-analyzer": "3.0.2",
-		"webpack-cli": "2.1.3",
-		"webpack-livereload-plugin": "2.1.1",
-		"webpack-rtl-plugin": "github:yoavf/webpack-rtl-plugin#develop"
-	},
-	"publishConfig": {
-		"access": "public"
-	}
-}
diff --git a/packages/webpack-config/.npmrc b/packages/webpack-config/.npmrc
new file mode 100644
index 00000000000000..43c97e719a5a82
--- /dev/null
+++ b/packages/webpack-config/.npmrc
@@ -0,0 +1 @@
+package-lock=false
diff --git a/packages/webpack-config/CHANGELOG.md b/packages/webpack-config/CHANGELOG.md
new file mode 100644
index 00000000000000..16c97e5a1bf32f
--- /dev/null
+++ b/packages/webpack-config/CHANGELOG.md
@@ -0,0 +1,3 @@
+## 1.0.0 (Unreleased)
+
+- Initial release.
diff --git a/packages/webpack-config/README.md b/packages/webpack-config/README.md
new file mode 100644
index 00000000000000..5602de2c9ed815
--- /dev/null
+++ b/packages/webpack-config/README.md
@@ -0,0 +1,13 @@
+# Webpack Config
+
+[Webpack](https://webpack.js.org/) config for WordPress development.
+
+## Installation
+
+Install the module
+
+```bash
+npm install @wordpress/webpack-config --save-dev
+```
+
+<br/><br/><p align="center"><img src="https://s.w.org/style/images/codeispoetry.png?1" alt="Code is Poetry." /></p>
diff --git a/packages/build-config/config/webpack.config.js b/packages/webpack-config/index.js
similarity index 61%
rename from packages/build-config/config/webpack.config.js
rename to packages/webpack-config/index.js
index 694582638f437a..8e3f420bf331a3 100644
--- a/packages/build-config/config/webpack.config.js
+++ b/packages/webpack-config/index.js
@@ -1,36 +1,8 @@
 /**
  * External dependencies
  */
-const WebpackRTLPlugin = require( 'webpack-rtl-plugin' );
-const LiveReloadPlugin = require( 'webpack-livereload-plugin' );
-
-const { get } = require( 'lodash' );
-const { basename } = require( 'path' );
-
 const { BundleAnalyzerPlugin } = require( 'webpack-bundle-analyzer' );
-
-/**
- * WordPress dependencies
- */
-const CustomTemplatedPathPlugin = require( '@wordpress/custom-templated-path-webpack-plugin' );
-const LibraryExportDefaultPlugin = require( '@wordpress/library-export-default-webpack-plugin' );
-
-/**
- * Given a string, returns a new string with dash separators converted to
- * camelCase equivalent. This is not as aggressive as `_.camelCase` in
- * converting to uppercase, where Lodash will also capitalize letters
- * following numbers.
- *
- * @param {string} string Input dash-delimited string.
- *
- * @return {string} Camel-cased string.
- */
-function camelCaseDash( string ) {
-	return string.replace(
-		/-([a-z])/g,
-		( match, letter ) => letter.toUpperCase()
-	);
-}
+const LiveReloadPlugin = require( 'webpack-livereload-plugin' );
 
 /**
  * Converts @wordpress require into window reference
@@ -66,8 +38,6 @@ const externals = [
 		jquery: 'jQuery',
 		lodash: 'lodash',
 		'lodash-es': 'lodash',
-		electron: 'electron',
-		wp: 'wp',
 	},
 	wordpressExternals,
 ];
@@ -86,7 +56,7 @@ const config = {
 	externals,
 	resolve: {
 		modules: [
-			__dirname,
+			process.cwd(),
 			'node_modules',
 		],
 		alias: {
@@ -112,40 +82,6 @@ const config = {
 		],
 	},
 	plugins: [
-		// Create RTL files with a -rtl suffix
-		new WebpackRTLPlugin( {
-			suffix: '-rtl',
-			minify: process.env.NODE_ENV === 'production' ? { safe: true } : false,
-		} ),
-		new CustomTemplatedPathPlugin( {
-			basename( path, data ) {
-				let rawRequest;
-
-				const entryModule = get( data, [ 'chunk', 'entryModule' ], {} );
-				switch ( entryModule.type ) {
-					case 'javascript/auto':
-						rawRequest = entryModule.rawRequest;
-						break;
-
-					case 'javascript/esm':
-						rawRequest = entryModule.rootModule.rawRequest;
-						break;
-				}
-
-				if ( rawRequest ) {
-					return basename( rawRequest );
-				}
-
-				return path;
-			},
-		} ),
-		new LibraryExportDefaultPlugin( [
-			'api-fetch',
-			'deprecated',
-			'dom-ready',
-			'redux-routine',
-			'token-list',
-		].map( camelCaseDash ) ),
 		// GUTENBERG_BUNDLE_ANALYZER global variable enables utility that represents bundle content
 		// as convenient interactive zoomable treemap.
 		process.env.GUTENBERG_BUNDLE_ANALYZER && new BundleAnalyzerPlugin(),
diff --git a/packages/webpack-config/package.json b/packages/webpack-config/package.json
new file mode 100644
index 00000000000000..d87db2dade203f
--- /dev/null
+++ b/packages/webpack-config/package.json
@@ -0,0 +1,32 @@
+{
+	"name": "@wordpress/webpack-config",
+	"version": "1.0.0-alpha.0",
+	"description": "Webpack config for WordPress development.",
+	"author": "The WordPress Contributors",
+	"license": "GPL-2.0-or-later",
+	"keywords": [
+		"wordpress",
+		"webpack",
+		"config"
+	],
+	"homepage": "https://github.com/WordPress/gutenberg/tree/master/packages/webpack-config/README.md",
+	"repository": {
+		"type": "git",
+		"url": "https://github.com/WordPress/gutenberg.git"
+	},
+	"bugs": {
+		"url": "https://github.com/WordPress/gutenberg/issues"
+	},
+	"engines": {
+		"node": ">=8",
+		"npm": ">=6.0.0"
+	},
+	"main": "index.js",
+	"dependencies": {
+		"webpack-bundle-analyzer": "^3.0.3",
+		"webpack-livereload-plugin": "^2.2.0"
+	},
+	"publishConfig": {
+		"access": "public"
+	}
+}
diff --git a/webpack.config.js b/webpack.config.js
index 97751fed64dc74..a57a176d0fc81f 100644
--- a/webpack.config.js
+++ b/webpack.config.js
@@ -1,14 +1,19 @@
 /**
  * External dependencies
  */
+const WebpackRTLPlugin = require( 'webpack-rtl-plugin' );
 const CopyWebpackPlugin = require( 'copy-webpack-plugin' );
 const postcss = require( 'postcss' );
 
+const { get } = require( 'lodash' );
+const { basename } = require( 'path' );
+
 /**
  * WordPress dependencies
  */
-
-const webpackConfig = require( '@wordpress/build-config' ).webpackConfig;
+const CustomTemplatedPathPlugin = require( '@wordpress/custom-templated-path-webpack-plugin' );
+const LibraryExportDefaultPlugin = require( '@wordpress/library-export-default-webpack-plugin' );
+const webpackConfig = require( '@wordpress/webpack-config' );
 
 /**
  * Internal dependencies
@@ -45,6 +50,40 @@ webpackConfig.entry = gutenbergPackages.reduce( ( memo, packageName ) => {
 }, {} );
 
 webpackConfig.plugins.push(
+	// Create RTL files with a -rtl suffix
+	new WebpackRTLPlugin( {
+		suffix: '-rtl',
+		minify: process.env.NODE_ENV === 'production' ? { safe: true } : false,
+	} ),
+	new CustomTemplatedPathPlugin( {
+		basename( path, data ) {
+			let rawRequest;
+
+			const entryModule = get( data, [ 'chunk', 'entryModule' ], {} );
+			switch ( entryModule.type ) {
+				case 'javascript/auto':
+					rawRequest = entryModule.rawRequest;
+					break;
+
+				case 'javascript/esm':
+					rawRequest = entryModule.rootModule.rawRequest;
+					break;
+			}
+
+			if ( rawRequest ) {
+				return basename( rawRequest );
+			}
+
+			return path;
+		},
+	} ),
+	new LibraryExportDefaultPlugin( [
+		'api-fetch',
+		'deprecated',
+		'dom-ready',
+		'redux-routine',
+		'token-list',
+	].map( camelCaseDash ) ),
 	new CopyWebpackPlugin(
 		gutenbergPackages.map( ( packageName ) => ( {
 			from: `./packages/${ packageName }/build-style/*.css`,

From 0d68bd4b7935cd8b61fa61316851982535c387a7 Mon Sep 17 00:00:00 2001
From: Grzegorz Ziolkowski <grzegorz@gziolo.pl>
Date: Tue, 12 Feb 2019 10:10:53 +0100
Subject: [PATCH 12/20] Apply more tweaks to the way webpack config package is
 structured

---
 package-lock.json                    |  31 ++------
 package.json                         |   2 -
 packages/webpack-config/README.md    |  12 +++
 packages/webpack-config/config.js    | 102 ++++++++++++++++++++++++++
 packages/webpack-config/index.js     | 105 ++-------------------------
 packages/webpack-config/package.json |   2 +
 packages/webpack-config/utils.js     |  20 +++++
 webpack.config.js                    |  36 ++++-----
 8 files changed, 161 insertions(+), 149 deletions(-)
 create mode 100644 packages/webpack-config/config.js
 create mode 100644 packages/webpack-config/utils.js

diff --git a/package-lock.json b/package-lock.json
index 9d63b5628ecbb4..f79c8b6cdba270 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -3049,6 +3049,8 @@
 			"version": "file:packages/webpack-config",
 			"dev": true,
 			"requires": {
+				"babel-loader": "^8.0.5",
+				"source-map-loader": "^0.2.4",
 				"webpack-bundle-analyzer": "^3.0.3",
 				"webpack-livereload-plugin": "^2.2.0"
 			}
@@ -19799,34 +19801,13 @@
 			"dev": true
 		},
 		"source-map-loader": {
-			"version": "0.2.3",
-			"resolved": "https://registry.npmjs.org/source-map-loader/-/source-map-loader-0.2.3.tgz",
-			"integrity": "sha512-MYbFX9DYxmTQFfy2v8FC1XZwpwHKYxg3SK8Wb7VPBKuhDjz8gi9re2819MsG4p49HDyiOSUKlmZ+nQBArW5CGw==",
+			"version": "0.2.4",
+			"resolved": "https://registry.npmjs.org/source-map-loader/-/source-map-loader-0.2.4.tgz",
+			"integrity": "sha512-OU6UJUty+i2JDpTItnizPrlpOIBLmQbWMuBg9q5bVtnHACqw1tn9nNwqJLbv0/00JjnJb/Ee5g5WS5vrRv7zIQ==",
 			"dev": true,
 			"requires": {
 				"async": "^2.5.0",
-				"loader-utils": "~0.2.2",
-				"source-map": "~0.6.1"
-			},
-			"dependencies": {
-				"loader-utils": {
-					"version": "0.2.17",
-					"resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-0.2.17.tgz",
-					"integrity": "sha1-+G5jdNQyBabmxg6RlvF8Apm/s0g=",
-					"dev": true,
-					"requires": {
-						"big.js": "^3.1.3",
-						"emojis-list": "^2.0.0",
-						"json5": "^0.5.0",
-						"object-assign": "^4.0.1"
-					}
-				},
-				"source-map": {
-					"version": "0.6.1",
-					"resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz",
-					"integrity": "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==",
-					"dev": true
-				}
+				"loader-utils": "^1.1.0"
 			}
 		},
 		"source-map-resolve": {
diff --git a/package.json b/package.json
index e0faf638466d92..6ff3119972b25d 100644
--- a/package.json
+++ b/package.json
@@ -76,7 +76,6 @@
 		"@wordpress/postcss-themes": "file:packages/postcss-themes",
 		"@wordpress/scripts": "file:packages/scripts",
 		"@wordpress/webpack-config": "file:packages/webpack-config",
-		"babel-loader": "8.0.5",
 		"benchmark": "2.1.4",
 		"browserslist": "4.4.1",
 		"chalk": "2.4.1",
@@ -114,7 +113,6 @@
 		"shallow-equal": "1.0.0",
 		"shallow-equals": "1.0.0",
 		"shallowequal": "1.1.0",
-		"source-map-loader": "0.2.3",
 		"sprintf-js": "1.1.1",
 		"stylelint-config-wordpress": "13.1.0",
 		"uuid": "3.3.2",
diff --git a/packages/webpack-config/README.md b/packages/webpack-config/README.md
index 5602de2c9ed815..02f0e12ba3529b 100644
--- a/packages/webpack-config/README.md
+++ b/packages/webpack-config/README.md
@@ -10,4 +10,16 @@ Install the module
 npm install @wordpress/webpack-config --save-dev
 ```
 
+## Usage
+
+This is how to extend the default WordPress config for Webpack. You have to create your own `webpack.config.js` file in the root of your project, import the config and extend it with your custom settings as follows:
+
+```js
+const { config } = require( '@wordpress/webpack-config' );
+
+module.exports = Object.assign( {}, config, {
+	// apply your changes here
+} );
+```
+
 <br/><br/><p align="center"><img src="https://s.w.org/style/images/codeispoetry.png?1" alt="Code is Poetry." /></p>
diff --git a/packages/webpack-config/config.js b/packages/webpack-config/config.js
new file mode 100644
index 00000000000000..03ddd8f3d062fd
--- /dev/null
+++ b/packages/webpack-config/config.js
@@ -0,0 +1,102 @@
+/**
+ * External dependencies
+ */
+const { BundleAnalyzerPlugin } = require( 'webpack-bundle-analyzer' );
+const LiveReloadPlugin = require( 'webpack-livereload-plugin' );
+
+/**
+ * Internal dependencies
+ */
+const { camelCaseDash } = require( './utils' );
+
+/**
+ * Converts @wordpress require into window reference.
+ *
+ * Note this isn't the same as camel case because of the
+ * way that numbers don't trigger the capitalized next letter.
+ *
+ * @example
+ * wordpressRequire( '@wordpress/api-fetch' ) = 'wp.apiFetch'
+ * wordpressRequire( '@wordpress/i18n' ) = 'wp.i18n'
+ *
+ * @param {string} request import name
+ * @return {string} global variable reference for import
+ */
+const wordpressRequire = ( request ) => {
+	// @wordpress/components -> [ @wordpress, components ]
+	const [ , name ] = request.split( '/' );
+
+	// components -> wp.components
+	return `wp.${ camelCaseDash( name ) }`;
+};
+
+const wordpressExternals = ( context, request, callback ) =>
+	/^@wordpress\//.test( request ) ?
+		callback( null, `root ${ wordpressRequire( request ) }` ) :
+		callback();
+
+const externals = [
+	{
+		react: 'React',
+		'react-dom': 'ReactDOM',
+		moment: 'moment',
+		jquery: 'jQuery',
+		lodash: 'lodash',
+		'lodash-es': 'lodash',
+	},
+	wordpressExternals,
+];
+
+const isProduction = process.env.NODE_ENV === 'production';
+const mode = isProduction ? 'production' : 'development';
+
+const config = {
+	mode,
+	externals,
+	resolve: {
+		modules: [
+			process.cwd(),
+			'node_modules',
+		],
+		alias: {
+			'lodash-es': 'lodash',
+		},
+	},
+	module: {
+		rules: [
+			{
+				test: /\.js$/,
+				use: [ 'source-map-loader' ],
+				enforce: 'pre',
+			},
+			{
+				test: /\.js$/,
+				exclude: [
+					/block-serialization-spec-parser/,
+					/is-shallow-equal/,
+					/node_modules/,
+				],
+				use: 'babel-loader',
+			},
+		],
+	},
+	plugins: [
+		// GUTENBERG_BUNDLE_ANALYZER global variable enables utility that represents bundle content
+		// as convenient interactive zoomable treemap.
+		process.env.GUTENBERG_BUNDLE_ANALYZER && new BundleAnalyzerPlugin(),
+		// GUTENBERG_LIVE_RELOAD_PORT global variable changes port on which live reload works
+		// when running watch mode.
+		! isProduction && new LiveReloadPlugin( { port: process.env.GUTENBERG_LIVE_RELOAD_PORT || 35729 } ),
+	].filter( Boolean ),
+	stats: {
+		children: false,
+	},
+};
+
+if ( ! isProduction ) {
+	// GUTENBERG_DEVTOOL global variable controls how source maps are generated.
+	// See: https://webpack.js.org/configuration/devtool/#devtool.
+	config.devtool = process.env.GUTENBERG_DEVTOOL || 'source-map';
+}
+
+module.exports = config;
diff --git a/packages/webpack-config/index.js b/packages/webpack-config/index.js
index 8e3f420bf331a3..eb022a4e505eb2 100644
--- a/packages/webpack-config/index.js
+++ b/packages/webpack-config/index.js
@@ -1,103 +1,10 @@
 /**
- * External dependencies
+ * Internal dependencies
  */
-const { BundleAnalyzerPlugin } = require( 'webpack-bundle-analyzer' );
-const LiveReloadPlugin = require( 'webpack-livereload-plugin' );
+const { camelCaseDash } = require( './utils' );
+const config = require( './config' );
 
-/**
- * Converts @wordpress require into window reference
- *
- * Note this isn't the same as camel case because of the
- * way that numbers don't trigger the capitalized next letter
- *
- * @example
- * wordpressRequire( '@wordpress/api-fetch' ) = 'wp.apiFetch'
- * wordpressRequire( '@wordpress/i18n' ) = 'wp.i18n'
- *
- * @param {string} request import name
- * @return {string} global variable reference for import
- */
-const wordpressRequire = ( request ) => {
-	// @wordpress/components -> [ @wordpress, components ]
-	const [ , name ] = request.split( '/' );
-
-	// components -> wp.components
-	return `wp.${ name.replace( /-([a-z])/g, ( match, letter ) => letter.toUpperCase() ) }`;
-};
-
-const wordpressExternals = ( context, request, callback ) =>
-	/^@wordpress\//.test( request ) ?
-		callback( null, `root ${ wordpressRequire( request ) }` ) :
-		callback();
-
-const externals = [
-	{
-		react: 'React',
-		'react-dom': 'ReactDOM',
-		moment: 'moment',
-		jquery: 'jQuery',
-		lodash: 'lodash',
-		'lodash-es': 'lodash',
-	},
-	wordpressExternals,
-];
-
-const isProduction = process.env.NODE_ENV === 'production';
-const mode = isProduction ? 'production' : 'development';
-
-const config = {
-	mode,
-	output: {
-		filename: './build/[basename]/index.js',
-		path: process.cwd(),
-		library: [ 'wp', '[name]' ],
-		libraryTarget: 'this',
-	},
-	externals,
-	resolve: {
-		modules: [
-			process.cwd(),
-			'node_modules',
-		],
-		alias: {
-			'lodash-es': 'lodash',
-		},
-	},
-	module: {
-		rules: [
-			{
-				test: /\.js$/,
-				use: [ 'source-map-loader' ],
-				enforce: 'pre',
-			},
-			{
-				test: /\.js$/,
-				exclude: [
-					/block-serialization-spec-parser/,
-					/is-shallow-equal/,
-					/node_modules/,
-				],
-				use: 'babel-loader',
-			},
-		],
-	},
-	plugins: [
-		// GUTENBERG_BUNDLE_ANALYZER global variable enables utility that represents bundle content
-		// as convenient interactive zoomable treemap.
-		process.env.GUTENBERG_BUNDLE_ANALYZER && new BundleAnalyzerPlugin(),
-		// GUTENBERG_LIVE_RELOAD_PORT global variable changes port on which live reload works
-		// when running watch mode.
-		! isProduction && new LiveReloadPlugin( { port: process.env.GUTENBERG_LIVE_RELOAD_PORT || 35729 } ),
-	].filter( Boolean ),
-	stats: {
-		children: false,
-	},
+module.exports = {
+	camelCaseDash,
+	config,
 };
-
-if ( ! isProduction ) {
-	// GUTENBERG_DEVTOOL global variable controls how source maps are generated.
-	// See: https://webpack.js.org/configuration/devtool/#devtool.
-	config.devtool = process.env.GUTENBERG_DEVTOOL || 'source-map';
-}
-
-module.exports = config;
diff --git a/packages/webpack-config/package.json b/packages/webpack-config/package.json
index d87db2dade203f..c5ac5e8c452bcd 100644
--- a/packages/webpack-config/package.json
+++ b/packages/webpack-config/package.json
@@ -23,6 +23,8 @@
 	},
 	"main": "index.js",
 	"dependencies": {
+		"babel-loader": "^8.0.5",
+		"source-map-loader": "^0.2.4",
 		"webpack-bundle-analyzer": "^3.0.3",
 		"webpack-livereload-plugin": "^2.2.0"
 	},
diff --git a/packages/webpack-config/utils.js b/packages/webpack-config/utils.js
new file mode 100644
index 00000000000000..ea6ea3889c1ad8
--- /dev/null
+++ b/packages/webpack-config/utils.js
@@ -0,0 +1,20 @@
+/**
+ * Given a string, returns a new string with dash separators converted to
+ * camelCase equivalent. This is not as aggressive as `_.camelCase` in
+ * converting to uppercase, where Lodash will also capitalize letters
+ * following numbers.
+ *
+ * @param {string} string Input dash-delimited string.
+ *
+ * @return {string} Camel-cased string.
+ */
+function camelCaseDash( string ) {
+	return string.replace(
+		/-([a-z])/g,
+		( match, letter ) => letter.toUpperCase()
+	);
+}
+
+module.exports = {
+	camelCaseDash,
+};
diff --git a/webpack.config.js b/webpack.config.js
index a57a176d0fc81f..a1c5c5f7726898 100644
--- a/webpack.config.js
+++ b/webpack.config.js
@@ -13,7 +13,7 @@ const { basename } = require( 'path' );
  */
 const CustomTemplatedPathPlugin = require( '@wordpress/custom-templated-path-webpack-plugin' );
 const LibraryExportDefaultPlugin = require( '@wordpress/library-export-default-webpack-plugin' );
-const webpackConfig = require( '@wordpress/webpack-config' );
+const { camelCaseDash, config } = require( '@wordpress/webpack-config' );
 
 /**
  * Internal dependencies
@@ -22,38 +22,28 @@ const { dependencies } = require( './package' );
 
 const WORDPRESS_NAMESPACE = '@wordpress/';
 
-/**
- * Given a string, returns a new string with dash separators converted to
- * camelCase equivalent. This is not as aggressive as `_.camelCase` in
- * converting to uppercase, where Lodash will also capitalize letters
- * following numbers.
- *
- * @param {string} string Input dash-delimited string.
- *
- * @return {string} Camel-cased string.
- */
-function camelCaseDash( string ) {
-	return string.replace(
-		/-([a-z])/g,
-		( match, letter ) => letter.toUpperCase()
-	);
-}
-
 const gutenbergPackages = Object.keys( dependencies )
 	.filter( ( packageName ) => packageName.startsWith( WORDPRESS_NAMESPACE ) )
 	.map( ( packageName ) => packageName.replace( WORDPRESS_NAMESPACE, '' ) );
 
-webpackConfig.entry = gutenbergPackages.reduce( ( memo, packageName ) => {
+config.entry = gutenbergPackages.reduce( ( memo, packageName ) => {
 	const name = camelCaseDash( packageName );
 	memo[ name ] = `./packages/${ packageName }`;
 	return memo;
 }, {} );
 
-webpackConfig.plugins.push(
+config.output = {
+	filename: './build/[basename]/index.js',
+	path: __dirname,
+	library: [ 'wp', '[name]' ],
+	libraryTarget: 'this',
+};
+
+config.plugins.push(
 	// Create RTL files with a -rtl suffix
 	new WebpackRTLPlugin( {
 		suffix: '-rtl',
-		minify: process.env.NODE_ENV === 'production' ? { safe: true } : false,
+		minify: config.mode === 'production' ? { safe: true } : false,
 	} ),
 	new CustomTemplatedPathPlugin( {
 		basename( path, data ) {
@@ -90,7 +80,7 @@ webpackConfig.plugins.push(
 			to: `./build/${ packageName }/`,
 			flatten: true,
 			transform: ( content ) => {
-				if ( webpackConfig.mode === 'production' ) {
+				if ( config.mode === 'production' ) {
 					return postcss( [
 						require( 'cssnano' )( {
 							preset: [ 'default', {
@@ -109,4 +99,4 @@ webpackConfig.plugins.push(
 	)
 );
 
-module.exports = webpackConfig;
+module.exports = config;

From 8cdfd892a231eb338cccc3be9d31449a939741a5 Mon Sep 17 00:00:00 2001
From: Grzegorz Ziolkowski <grzegorz@gziolo.pl>
Date: Wed, 13 Feb 2019 15:34:57 +0100
Subject: [PATCH 13/20] Update the way externals are handled

---
 packages/webpack-config/config.js | 31 +++++++++++++++++++------------
 1 file changed, 19 insertions(+), 12 deletions(-)

diff --git a/packages/webpack-config/config.js b/packages/webpack-config/config.js
index 03ddd8f3d062fd..32a006e487b8c5 100644
--- a/packages/webpack-config/config.js
+++ b/packages/webpack-config/config.js
@@ -10,30 +10,37 @@ const LiveReloadPlugin = require( 'webpack-livereload-plugin' );
 const { camelCaseDash } = require( './utils' );
 
 /**
- * Converts @wordpress require into window reference.
+ * Converts @wordpress/* string request into request object.
  *
  * Note this isn't the same as camel case because of the
  * way that numbers don't trigger the capitalized next letter.
  *
  * @example
- * wordpressRequire( '@wordpress/api-fetch' ) = 'wp.apiFetch'
- * wordpressRequire( '@wordpress/i18n' ) = 'wp.i18n'
+ * formatRequest( '@wordpress/api-fetch' );
+ * // { this: [ 'wp', 'apiFetch' ] }
+ * formatRequest( '@wordpress/i18n' );
+ * // { this: [ 'wp', 'i18n' ] }
  *
- * @param {string} request import name
- * @return {string} global variable reference for import
+ * @param {string} request Request name from import statement.
+ * @return {Object} Request object formatted for further processing.
  */
-const wordpressRequire = ( request ) => {
-	// @wordpress/components -> [ @wordpress, components ]
+const formatRequest = ( request ) => {
+	// '@wordpress/api-fetch' -> [ '@wordpress', 'api-fetch' ]
 	const [ , name ] = request.split( '/' );
 
-	// components -> wp.components
-	return `wp.${ camelCaseDash( name ) }`;
+	// { this: [ 'wp', 'apiFetch' ] }
+	return {
+		this: [ 'wp', camelCaseDash( name ) ],
+	};
 };
 
-const wordpressExternals = ( context, request, callback ) =>
-	/^@wordpress\//.test( request ) ?
-		callback( null, `root ${ wordpressRequire( request ) }` ) :
+const wordpressExternals = ( context, request, callback ) => {
+	if ( /^@wordpress\//.test( request ) ) {
+		callback( null, formatRequest( request ), 'this' );
+	} else {
 		callback();
+	}
+};
 
 const externals = [
 	{

From cc5cb3613607bbe721533f31de7679b28466a3a3 Mon Sep 17 00:00:00 2001
From: Grzegorz Ziolkowski <grzegorz@gziolo.pl>
Date: Mon, 18 Feb 2019 10:30:48 +0100
Subject: [PATCH 14/20] Add default values for entry and output

---
 packages/webpack-config/config.js | 8 ++++++++
 1 file changed, 8 insertions(+)

diff --git a/packages/webpack-config/config.js b/packages/webpack-config/config.js
index 32a006e487b8c5..dd8bda0a1174a6 100644
--- a/packages/webpack-config/config.js
+++ b/packages/webpack-config/config.js
@@ -3,6 +3,7 @@
  */
 const { BundleAnalyzerPlugin } = require( 'webpack-bundle-analyzer' );
 const LiveReloadPlugin = require( 'webpack-livereload-plugin' );
+const path = require( 'path' );
 
 /**
  * Internal dependencies
@@ -59,6 +60,13 @@ const mode = isProduction ? 'production' : 'development';
 
 const config = {
 	mode,
+	entry: {
+		index: path.resolve( process.cwd(), 'src', 'index.js' ),
+	},
+	output: {
+		filename: '[name].js',
+		path: path.resolve( process.cwd(), 'build' ),
+	},
 	externals,
 	resolve: {
 		modules: [

From 3ce3e150ef977ce0d67e760b8d692799702843a0 Mon Sep 17 00:00:00 2001
From: Grzegorz Ziolkowski <grzegorz@gziolo.pl>
Date: Mon, 18 Feb 2019 13:29:26 +0100
Subject: [PATCH 15/20] Move shared webpack config under @wordpress/scripts
 package

---
 docs/manifest.json                            |  6 ----
 package-lock.json                             | 16 +++------
 package.json                                  |  1 -
 .../config/webpack.config.js}                 |  2 +-
 packages/scripts/package.json                 |  6 +++-
 packages/scripts/utils/index.js               |  4 +++
 .../utils.js => scripts/utils/string.js}      |  0
 packages/scripts/utils/test/string.js         | 23 +++++++++++++
 packages/webpack-config/.npmrc                |  1 -
 packages/webpack-config/CHANGELOG.md          |  3 --
 packages/webpack-config/README.md             | 25 --------------
 packages/webpack-config/index.js              | 10 ------
 packages/webpack-config/package.json          | 34 -------------------
 webpack.config.js                             |  3 +-
 14 files changed, 40 insertions(+), 94 deletions(-)
 rename packages/{webpack-config/config.js => scripts/config/webpack.config.js} (98%)
 rename packages/{webpack-config/utils.js => scripts/utils/string.js} (100%)
 create mode 100644 packages/scripts/utils/test/string.js
 delete mode 100644 packages/webpack-config/.npmrc
 delete mode 100644 packages/webpack-config/CHANGELOG.md
 delete mode 100644 packages/webpack-config/README.md
 delete mode 100644 packages/webpack-config/index.js
 delete mode 100644 packages/webpack-config/package.json

diff --git a/docs/manifest.json b/docs/manifest.json
index 92c289d9f72acd..026790426f1ecd 100644
--- a/docs/manifest.json
+++ b/docs/manifest.json
@@ -833,12 +833,6 @@
 		"markdown_source": "https://raw.githubusercontent.com/WordPress/gutenberg/master/packages/viewport/README.md",
 		"parent": "packages"
 	},
-	{
-		"title": "@wordpress/webpack-config",
-		"slug": "packages-webpack-config",
-		"markdown_source": "https://raw.githubusercontent.com/WordPress/gutenberg/master/packages/webpack-config/README.md",
-		"parent": "packages"
-	},
 	{
 		"title": "@wordpress/wordcount",
 		"slug": "packages-wordcount",
diff --git a/package-lock.json b/package-lock.json
index f79c8b6cdba270..2f2c70df838be1 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -2997,6 +2997,7 @@
 				"@wordpress/eslint-plugin": "file:packages/eslint-plugin",
 				"@wordpress/jest-preset-default": "file:packages/jest-preset-default",
 				"@wordpress/npm-package-json-lint-config": "file:packages/npm-package-json-lint-config",
+				"babel-loader": "^8.0.5",
 				"chalk": "^2.4.1",
 				"check-node-version": "^3.1.1",
 				"cross-spawn": "^5.1.0",
@@ -3007,10 +3008,13 @@
 				"puppeteer": "1.6.1",
 				"read-pkg-up": "^1.0.1",
 				"resolve-bin": "^0.4.0",
+				"source-map-loader": "^0.2.4",
 				"stylelint": "^9.10.1",
 				"stylelint-config-wordpress": "^13.1.0",
 				"webpack": "4.8.3",
-				"webpack-cli": "^3.1.2"
+				"webpack-bundle-analyzer": "^3.0.3",
+				"webpack-cli": "^3.1.2",
+				"webpack-livereload-plugin": "^2.2.0"
 			}
 		},
 		"@wordpress/shortcode": {
@@ -3045,16 +3049,6 @@
 				"lodash": "^4.17.11"
 			}
 		},
-		"@wordpress/webpack-config": {
-			"version": "file:packages/webpack-config",
-			"dev": true,
-			"requires": {
-				"babel-loader": "^8.0.5",
-				"source-map-loader": "^0.2.4",
-				"webpack-bundle-analyzer": "^3.0.3",
-				"webpack-livereload-plugin": "^2.2.0"
-			}
-		},
 		"@wordpress/wordcount": {
 			"version": "file:packages/wordcount",
 			"requires": {
diff --git a/package.json b/package.json
index 6ff3119972b25d..a3337830f06c53 100644
--- a/package.json
+++ b/package.json
@@ -75,7 +75,6 @@
 		"@wordpress/npm-package-json-lint-config": "file:packages/npm-package-json-lint-config",
 		"@wordpress/postcss-themes": "file:packages/postcss-themes",
 		"@wordpress/scripts": "file:packages/scripts",
-		"@wordpress/webpack-config": "file:packages/webpack-config",
 		"benchmark": "2.1.4",
 		"browserslist": "4.4.1",
 		"chalk": "2.4.1",
diff --git a/packages/webpack-config/config.js b/packages/scripts/config/webpack.config.js
similarity index 98%
rename from packages/webpack-config/config.js
rename to packages/scripts/config/webpack.config.js
index dd8bda0a1174a6..9766306d930d8f 100644
--- a/packages/webpack-config/config.js
+++ b/packages/scripts/config/webpack.config.js
@@ -8,7 +8,7 @@ const path = require( 'path' );
 /**
  * Internal dependencies
  */
-const { camelCaseDash } = require( './utils' );
+const { camelCaseDash } = require( '../utils' );
 
 /**
  * Converts @wordpress/* string request into request object.
diff --git a/packages/scripts/package.json b/packages/scripts/package.json
index 8aaf6e8ee7ac67..388bc0a26a3b86 100644
--- a/packages/scripts/package.json
+++ b/packages/scripts/package.json
@@ -35,6 +35,7 @@
 		"@wordpress/eslint-plugin": "file:../eslint-plugin",
 		"@wordpress/jest-preset-default": "file:../jest-preset-default",
 		"@wordpress/npm-package-json-lint-config": "file:../npm-package-json-lint-config",
+		"babel-loader": "^8.0.5",
 		"chalk": "^2.4.1",
 		"check-node-version": "^3.1.1",
 		"cross-spawn": "^5.1.0",
@@ -45,10 +46,13 @@
 		"puppeteer": "1.6.1",
 		"read-pkg-up": "^1.0.1",
 		"resolve-bin": "^0.4.0",
+		"source-map-loader": "^0.2.4",
 		"stylelint": "^9.10.1",
 		"stylelint-config-wordpress": "^13.1.0",
 		"webpack": "4.8.3",
-		"webpack-cli": "^3.1.2"
+		"webpack-bundle-analyzer": "^3.0.3",
+		"webpack-cli": "^3.1.2",
+		"webpack-livereload-plugin": "^2.2.0"
 	},
 	"publishConfig": {
 		"access": "public"
diff --git a/packages/scripts/utils/index.js b/packages/scripts/utils/index.js
index 473952fcdfc174..b1a78d0d600c91 100644
--- a/packages/scripts/utils/index.js
+++ b/packages/scripts/utils/index.js
@@ -18,8 +18,12 @@ const {
 const {
 	hasPackageProp,
 } = require( './package' );
+const {
+	camelCaseDash,
+} = require( './string' );
 
 module.exports = {
+	camelCaseDash,
 	fromConfigRoot,
 	getCliArg,
 	getCliArgs,
diff --git a/packages/webpack-config/utils.js b/packages/scripts/utils/string.js
similarity index 100%
rename from packages/webpack-config/utils.js
rename to packages/scripts/utils/string.js
diff --git a/packages/scripts/utils/test/string.js b/packages/scripts/utils/test/string.js
new file mode 100644
index 00000000000000..ca81bdda5df540
--- /dev/null
+++ b/packages/scripts/utils/test/string.js
@@ -0,0 +1,23 @@
+/**
+ * Internal dependencies
+ */
+import { camelCaseDash } from '../string';
+
+describe( 'string', () => {
+	describe( 'camelCaseDash', () => {
+		test( 'does not change a single word', () => {
+			expect( camelCaseDash( 'blocks' ) ).toBe( 'blocks' );
+			expect( camelCaseDash( 'dom' ) ).toBe( 'dom' );
+		} );
+
+		test( 'does not capitalize letters following numbers', () => {
+			expect( camelCaseDash( 'a11y' ) ).toBe( 'a11y' );
+			expect( camelCaseDash( 'i18n' ) ).toBe( 'i18n' );
+		} );
+
+		test( 'converts dashes into camel case', () => {
+			expect( camelCaseDash( 'api-fetch' ) ).toBe( 'apiFetch' );
+			expect( camelCaseDash( 'list-reusable-blocks' ) ).toBe( 'listReusableBlocks' );
+		} );
+	} );
+} );
diff --git a/packages/webpack-config/.npmrc b/packages/webpack-config/.npmrc
deleted file mode 100644
index 43c97e719a5a82..00000000000000
--- a/packages/webpack-config/.npmrc
+++ /dev/null
@@ -1 +0,0 @@
-package-lock=false
diff --git a/packages/webpack-config/CHANGELOG.md b/packages/webpack-config/CHANGELOG.md
deleted file mode 100644
index 16c97e5a1bf32f..00000000000000
--- a/packages/webpack-config/CHANGELOG.md
+++ /dev/null
@@ -1,3 +0,0 @@
-## 1.0.0 (Unreleased)
-
-- Initial release.
diff --git a/packages/webpack-config/README.md b/packages/webpack-config/README.md
deleted file mode 100644
index 02f0e12ba3529b..00000000000000
--- a/packages/webpack-config/README.md
+++ /dev/null
@@ -1,25 +0,0 @@
-# Webpack Config
-
-[Webpack](https://webpack.js.org/) config for WordPress development.
-
-## Installation
-
-Install the module
-
-```bash
-npm install @wordpress/webpack-config --save-dev
-```
-
-## Usage
-
-This is how to extend the default WordPress config for Webpack. You have to create your own `webpack.config.js` file in the root of your project, import the config and extend it with your custom settings as follows:
-
-```js
-const { config } = require( '@wordpress/webpack-config' );
-
-module.exports = Object.assign( {}, config, {
-	// apply your changes here
-} );
-```
-
-<br/><br/><p align="center"><img src="https://s.w.org/style/images/codeispoetry.png?1" alt="Code is Poetry." /></p>
diff --git a/packages/webpack-config/index.js b/packages/webpack-config/index.js
deleted file mode 100644
index eb022a4e505eb2..00000000000000
--- a/packages/webpack-config/index.js
+++ /dev/null
@@ -1,10 +0,0 @@
-/**
- * Internal dependencies
- */
-const { camelCaseDash } = require( './utils' );
-const config = require( './config' );
-
-module.exports = {
-	camelCaseDash,
-	config,
-};
diff --git a/packages/webpack-config/package.json b/packages/webpack-config/package.json
deleted file mode 100644
index c5ac5e8c452bcd..00000000000000
--- a/packages/webpack-config/package.json
+++ /dev/null
@@ -1,34 +0,0 @@
-{
-	"name": "@wordpress/webpack-config",
-	"version": "1.0.0-alpha.0",
-	"description": "Webpack config for WordPress development.",
-	"author": "The WordPress Contributors",
-	"license": "GPL-2.0-or-later",
-	"keywords": [
-		"wordpress",
-		"webpack",
-		"config"
-	],
-	"homepage": "https://github.com/WordPress/gutenberg/tree/master/packages/webpack-config/README.md",
-	"repository": {
-		"type": "git",
-		"url": "https://github.com/WordPress/gutenberg.git"
-	},
-	"bugs": {
-		"url": "https://github.com/WordPress/gutenberg/issues"
-	},
-	"engines": {
-		"node": ">=8",
-		"npm": ">=6.0.0"
-	},
-	"main": "index.js",
-	"dependencies": {
-		"babel-loader": "^8.0.5",
-		"source-map-loader": "^0.2.4",
-		"webpack-bundle-analyzer": "^3.0.3",
-		"webpack-livereload-plugin": "^2.2.0"
-	},
-	"publishConfig": {
-		"access": "public"
-	}
-}
diff --git a/webpack.config.js b/webpack.config.js
index a1c5c5f7726898..23436559b7f08a 100644
--- a/webpack.config.js
+++ b/webpack.config.js
@@ -13,7 +13,8 @@ const { basename } = require( 'path' );
  */
 const CustomTemplatedPathPlugin = require( '@wordpress/custom-templated-path-webpack-plugin' );
 const LibraryExportDefaultPlugin = require( '@wordpress/library-export-default-webpack-plugin' );
-const { camelCaseDash, config } = require( '@wordpress/webpack-config' );
+const config = require( '@wordpress/scripts/config/webpack.config' );
+const { camelCaseDash } = require( '@wordpress/scripts/utils' );
 
 /**
  * Internal dependencies

From bb37c89408a158946f27028ca07dfb356e894d70 Mon Sep 17 00:00:00 2001
From: Grzegorz Ziolkowski <grzegorz@gziolo.pl>
Date: Tue, 19 Feb 2019 13:43:27 +0100
Subject: [PATCH 16/20] Improve the way how loaders are handled

---
 packages/scripts/config/webpack.config.js | 8 ++------
 1 file changed, 2 insertions(+), 6 deletions(-)

diff --git a/packages/scripts/config/webpack.config.js b/packages/scripts/config/webpack.config.js
index 9766306d930d8f..601fd13049bc7c 100644
--- a/packages/scripts/config/webpack.config.js
+++ b/packages/scripts/config/webpack.config.js
@@ -69,10 +69,6 @@ const config = {
 	},
 	externals,
 	resolve: {
-		modules: [
-			process.cwd(),
-			'node_modules',
-		],
 		alias: {
 			'lodash-es': 'lodash',
 		},
@@ -81,7 +77,7 @@ const config = {
 		rules: [
 			{
 				test: /\.js$/,
-				use: [ 'source-map-loader' ],
+				use: require.resolve( 'source-map-loader' ),
 				enforce: 'pre',
 			},
 			{
@@ -91,7 +87,7 @@ const config = {
 					/is-shallow-equal/,
 					/node_modules/,
 				],
-				use: 'babel-loader',
+				use: require.resolve( 'babel-loader' ),
 			},
 		],
 	},

From 4a6138e2e2fbf8f397f9473b8a106c4c46e969ba Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Andr=C3=A9s?= <nosolosw@users.noreply.github.com>
Date: Wed, 20 Feb 2019 08:49:29 +0100
Subject: [PATCH 17/20] Replace GUTENBERG with WP in webpack config env
 variables

Co-Authored-By: gziolo <grzegorz@gziolo.pl>
---
 packages/scripts/config/webpack.config.js | 12 ++++++------
 1 file changed, 6 insertions(+), 6 deletions(-)

diff --git a/packages/scripts/config/webpack.config.js b/packages/scripts/config/webpack.config.js
index 601fd13049bc7c..0f30075dc72b69 100644
--- a/packages/scripts/config/webpack.config.js
+++ b/packages/scripts/config/webpack.config.js
@@ -92,12 +92,12 @@ const config = {
 		],
 	},
 	plugins: [
-		// GUTENBERG_BUNDLE_ANALYZER global variable enables utility that represents bundle content
+		// WP_BUNDLE_ANALYZER global variable enables utility that represents bundle content
 		// as convenient interactive zoomable treemap.
-		process.env.GUTENBERG_BUNDLE_ANALYZER && new BundleAnalyzerPlugin(),
-		// GUTENBERG_LIVE_RELOAD_PORT global variable changes port on which live reload works
+		process.env.WP_BUNDLE_ANALYZER && new BundleAnalyzerPlugin(),
+		// WP_LIVE_RELOAD_PORT global variable changes port on which live reload works
 		// when running watch mode.
-		! isProduction && new LiveReloadPlugin( { port: process.env.GUTENBERG_LIVE_RELOAD_PORT || 35729 } ),
+		! isProduction && new LiveReloadPlugin( { port: process.env.WP_LIVE_RELOAD_PORT || 35729 } ),
 	].filter( Boolean ),
 	stats: {
 		children: false,
@@ -105,9 +105,9 @@ const config = {
 };
 
 if ( ! isProduction ) {
-	// GUTENBERG_DEVTOOL global variable controls how source maps are generated.
+	// WP_DEVTOOL global variable controls how source maps are generated.
 	// See: https://webpack.js.org/configuration/devtool/#devtool.
-	config.devtool = process.env.GUTENBERG_DEVTOOL || 'source-map';
+	config.devtool = process.env.WP_DEVTOOL || 'source-map';
 }
 
 module.exports = config;

From 75551f8dafc17aeb75d9ae6df8c7d346eff31b89 Mon Sep 17 00:00:00 2001
From: Grzegorz Ziolkowski <grzegorz@gziolo.pl>
Date: Wed, 20 Feb 2019 09:17:06 +0100
Subject: [PATCH 18/20] Bring back feature flag to webpack config accidentally
 removed during merge

---
 webpack.config.js | 7 ++++++-
 1 file changed, 6 insertions(+), 1 deletion(-)

diff --git a/webpack.config.js b/webpack.config.js
index 23436559b7f08a..a5dd63c3bd9822 100644
--- a/webpack.config.js
+++ b/webpack.config.js
@@ -1,10 +1,10 @@
 /**
  * External dependencies
  */
+const { DefinePlugin } = require( 'webpack' );
 const WebpackRTLPlugin = require( 'webpack-rtl-plugin' );
 const CopyWebpackPlugin = require( 'copy-webpack-plugin' );
 const postcss = require( 'postcss' );
-
 const { get } = require( 'lodash' );
 const { basename } = require( 'path' );
 
@@ -41,6 +41,11 @@ config.output = {
 };
 
 config.plugins.push(
+	new DefinePlugin( {
+		// Inject the `GUTENBERG_PHASE` global, used for feature flagging.
+		// eslint-disable-next-line @wordpress/gutenberg-phase
+		'process.env.GUTENBERG_PHASE': JSON.stringify( parseInt( process.env.npm_package_config_GUTENBERG_PHASE, 10 ) || 1 ),
+	} ),
 	// Create RTL files with a -rtl suffix
 	new WebpackRTLPlugin( {
 		suffix: '-rtl',

From 8727c68c07b04cdfd29b4d8cfbbcd5b9f5bad029 Mon Sep 17 00:00:00 2001
From: Grzegorz Ziolkowski <grzegorz@gziolo.pl>
Date: Wed, 20 Feb 2019 09:24:56 +0100
Subject: [PATCH 19/20] Add missing dev dependencies for the packages used in
 webpack config

---
 package.json | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/package.json b/package.json
index a3337830f06c53..a19bce76c6c382 100644
--- a/package.json
+++ b/package.json
@@ -103,6 +103,7 @@
 		"node-watch": "0.6.0",
 		"pegjs": "0.10.0",
 		"phpegjs": "1.0.0-beta7",
+		"postcss": "7.0.13",
 		"react-dom": "16.6.3",
 		"react-test-renderer": "16.6.3",
 		"redux": "4.0.0",
@@ -115,6 +116,7 @@
 		"sprintf-js": "1.1.1",
 		"stylelint-config-wordpress": "13.1.0",
 		"uuid": "3.3.2",
+		"webpack": "4.8.3",
 		"webpack-rtl-plugin": "github:yoavf/webpack-rtl-plugin#develop"
 	},
 	"npmPackageJsonLintConfig": {

From 3f54de4654bdee9bd6930d827c167d6cb6b9de17 Mon Sep 17 00:00:00 2001
From: Grzegorz Ziolkowski <grzegorz@gziolo.pl>
Date: Wed, 20 Feb 2019 10:44:26 +0100
Subject: [PATCH 20/20] Fix the list of excluded folders for babel-loader

---
 package-lock.json                                      |  8 +++++---
 .../block-serialization-default-parser/test/index.js   |  3 ++-
 packages/block-serialization-spec-parser/CHANGELOG.md  | 10 ++++++++--
 packages/block-serialization-spec-parser/index.js      |  2 --
 packages/block-serialization-spec-parser/package.json  |  6 +++++-
 packages/block-serialization-spec-parser/test/index.js |  3 ++-
 packages/scripts/config/webpack.config.js              |  6 +-----
 7 files changed, 23 insertions(+), 15 deletions(-)
 delete mode 100644 packages/block-serialization-spec-parser/index.js

diff --git a/package-lock.json b/package-lock.json
index 2f2c70df838be1..44064a0e60140d 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -2562,7 +2562,10 @@
 			}
 		},
 		"@wordpress/block-serialization-spec-parser": {
-			"version": "file:packages/block-serialization-spec-parser"
+			"version": "file:packages/block-serialization-spec-parser",
+			"requires": {
+				"pegjs": "^0.10.0"
+			}
 		},
 		"@wordpress/blocks": {
 			"version": "file:packages/blocks",
@@ -15873,8 +15876,7 @@
 		"pegjs": {
 			"version": "0.10.0",
 			"resolved": "https://registry.npmjs.org/pegjs/-/pegjs-0.10.0.tgz",
-			"integrity": "sha1-z4uvrm7d/0tafvsYUmnqr0YQ3b0=",
-			"dev": true
+			"integrity": "sha1-z4uvrm7d/0tafvsYUmnqr0YQ3b0="
 		},
 		"pend": {
 			"version": "1.2.0",
diff --git a/packages/block-serialization-default-parser/test/index.js b/packages/block-serialization-default-parser/test/index.js
index a3c67e280ef946..72f4121ce19445 100644
--- a/packages/block-serialization-default-parser/test/index.js
+++ b/packages/block-serialization-default-parser/test/index.js
@@ -6,7 +6,8 @@ import path from 'path';
 /**
  * WordPress dependencies
  */
-import { jsTester, phpTester } from '@wordpress/block-serialization-spec-parser';
+// eslint-disable-next-line no-restricted-syntax
+import { jsTester, phpTester } from '@wordpress/block-serialization-spec-parser/shared-tests';
 
 /**
  * Internal dependencies
diff --git a/packages/block-serialization-spec-parser/CHANGELOG.md b/packages/block-serialization-spec-parser/CHANGELOG.md
index e4f403ffd68497..7ba44f0cd9a963 100644
--- a/packages/block-serialization-spec-parser/CHANGELOG.md
+++ b/packages/block-serialization-spec-parser/CHANGELOG.md
@@ -1,6 +1,12 @@
-## 2.1.0 (Unreleased)
+## 3.0.0 (Unreleased)
 
-- A `parser.php` file generated from the PEGJS grammar is now included.
+## Breaking Change
+
+- A `parser.js` file generated from the PEGJS grammar is now outputted in commonjs format.
+
+## New Feature
+
+- A `parser.php` file generated from the PEGJS grammar is now added upon installation.
 
 ## 2.0.2 (2018-12-12)
 
diff --git a/packages/block-serialization-spec-parser/index.js b/packages/block-serialization-spec-parser/index.js
deleted file mode 100644
index b217f8f5c5ad76..00000000000000
--- a/packages/block-serialization-spec-parser/index.js
+++ /dev/null
@@ -1,2 +0,0 @@
-export { parse } from './parser';
-export { jsTester, phpTester } from './shared-tests';
diff --git a/packages/block-serialization-spec-parser/package.json b/packages/block-serialization-spec-parser/package.json
index 918c269169f09f..5d40a8cfd03de1 100644
--- a/packages/block-serialization-spec-parser/package.json
+++ b/packages/block-serialization-spec-parser/package.json
@@ -18,12 +18,16 @@
 	"bugs": {
 		"url": "https://github.com/WordPress/gutenberg/issues"
 	},
+	"main": "parser.js",
+	"dependencies": {
+		"pegjs": "^0.10.0"
+	},
 	"publishConfig": {
 		"access": "public"
 	},
 	"scripts": {
 		"build": "concurrently \"npm run build:js\" \"npm run build:php\"",
-		"build:js": "pegjs --format umd -o ./parser.js ./grammar.pegjs",
+		"build:js": "pegjs --format commonjs -o ./parser.js ./grammar.pegjs",
 		"build:php": "node bin/create-php-parser.js"
 	}
 }
diff --git a/packages/block-serialization-spec-parser/test/index.js b/packages/block-serialization-spec-parser/test/index.js
index 7bdbe9f053f169..9d00c5a5434c33 100644
--- a/packages/block-serialization-spec-parser/test/index.js
+++ b/packages/block-serialization-spec-parser/test/index.js
@@ -6,7 +6,8 @@ import path from 'path';
 /**
  * Internal dependencies
  */
-import { jsTester, phpTester, parse } from '../';
+import { parse } from '../';
+import { jsTester, phpTester } from '../shared-tests';
 
 describe( 'block-serialization-spec-parser-js', jsTester( parse ) );
 
diff --git a/packages/scripts/config/webpack.config.js b/packages/scripts/config/webpack.config.js
index 0f30075dc72b69..44d0ff61d9a659 100644
--- a/packages/scripts/config/webpack.config.js
+++ b/packages/scripts/config/webpack.config.js
@@ -82,11 +82,7 @@ const config = {
 			},
 			{
 				test: /\.js$/,
-				exclude: [
-					/block-serialization-spec-parser/,
-					/is-shallow-equal/,
-					/node_modules/,
-				],
+				exclude: /node_modules/,
 				use: require.resolve( 'babel-loader' ),
 			},
 		],