Split up the webpack configuration

bin/paths.js

@@ -0,0 +1,9 @@
+/**
+ * External dependencies.
+ */
+const path = require( 'path' );
+
+module.exports = {
+	classicBuildPath: path.resolve( __dirname, '..', 'build', 'classic' ),
+	gutenbergBuildPath: path.resolve( __dirname, '..', 'build', 'gutenberg' ),
+};

bin/webpack.base.js

@@ -0,0 +1,21 @@
+module.exports = {
+	module: {
+		rules: [
+			{
+				test: /\.js$/,
+				exclude: /node_modules/,
+				use: {
+					loader: 'babel-loader',
+					options: {
+						cacheDirectory: true
+					}
+				}
+			}
+		]
+	},
+	stats: {
+		modules: false,
+		hash: false,
+		builtAt: false
+	}
+};

bin/webpack.core.js

@@ -0,0 +1,42 @@
+/**
+ * External dependencies.
+ */
+const merge = require( 'webpack-merge' );
+
+/**
+ * Internal dependencies.
+ */
+const base = require( './webpack.base' );
+const paths = require( './paths' );
+const wpPackages = require( './wp-packages' );
+
+const config = {
+	entry: './packages/core/index.js',
+	output: {
+		filename: 'core.js',
+		library: [ 'cf', 'core' ],
+		libraryTarget: 'this'
+	},
+	externals: {
+		'classnames': [ 'cf', 'vendor', 'classnames' ]
+	}
+};
+
+module.exports = [
+	merge( base, config, {
+		output: {
+			path: paths.gutenbergBuildPath
+		},
+		externals: Object.assign( {}, wpPackages.externals, {
+			'lodash': 'lodash'
+		} )
+	} ),
+	merge( base, config, {
+		output: {
+			path: paths.classicBuildPath
+		},
+		externals: Object.assign( {}, wpPackages.proxyExternals, {
+			'lodash': [ 'cf', 'vendor', 'lodash' ]
+		} )
+	} )
+];

bin/webpack.env.js

@@ -0,0 +1,38 @@
+/**
+ * External dependencies.
+ */
+const webpack = require( 'webpack' );
+const merge = require( 'webpack-merge' );
+
+/**
+ * Internal dependencies.
+ */
+const base = require( './webpack.base' );
+const paths = require( './paths' );
+const wpPackages = require( './wp-packages' );
+
+const config = {
+	entry: './packages/env/index.js',
+	output: {
+		filename: 'env.js'
+	}
+};
+
+module.exports = [
+	merge( base, config, {
+		output: {
+			path: paths.gutenbergBuildPath
+		},
+		externals: Object.assign( {}, wpPackages.externals, {
+			'lodash': 'lodash'
+		} )
+	} ),
+	merge( base, config, {
+		output: {
+			path: paths.classicBuildPath
+		},
+		plugins: [
+			new webpack.ProvidePlugin( wpPackages.providers )
+		]
+	} )
+];

bin/webpack.gutenberg.js

@@ -0,0 +1,28 @@
+/**
+ * External dependencies.
+ */
+const merge = require( 'webpack-merge' );
+
+/**
+ * Internal dependencies.
+ */
+const base = require( './webpack.base' );
+const paths = require( './paths' );
+const wpPackages = require( './wp-packages' );
+
+module.exports = [
+	merge( base, {
+		entry: './packages/gutenberg/index.js',
+		output: {
+			path: paths.gutenbergBuildPath,
+			filename: 'gutenberg.js'
+		},
+		externals: Object.assign( {}, wpPackages.externals, {
+			'@wordpress/components': 'wp.components',
+			'@wordpress/blocks': 'wp.blocks',
+			'@wordpress/editor': 'wp.editor',
+			'@carbon-fields/core': 'cf.core',
+			'lodash': 'lodash'
+		 } )
+	} )
+];

bin/webpack.metaboxes.js

@@ -0,0 +1,41 @@
+/**
+ * External dependencies.
+ */
+const merge = require( 'webpack-merge' );
+
+/**
+ * Internal dependencies.
+ */
+const base = require( './webpack.base' );
+const paths = require( './paths' );
+const wpPackages = require( './wp-packages' );
+
+const config = {
+	entry: './packages/metaboxes/index.js',
+	output: {
+		filename: 'metaboxes.js'
+	},
+	externals: {
+		'@carbon-fields/core': 'cf.core',
+		'classnames': [ 'cf', 'vendor', 'classnames' ]
+	},
+};
+
+module.exports = [
+	merge( base, config, {
+		output: {
+			path: paths.gutenbergBuildPath
+		},
+		externals: Object.assign( {}, wpPackages.externals, {
+			'lodash': 'lodash'
+		} )
+	} ),
+	merge( base, config, {
+		output: {
+			path: paths.classicBuildPath
+		},
+		externals: Object.assign( {}, wpPackages.proxyExternals, {
+			'lodash': [ 'cf', 'vendor', 'lodash' ]
+		} )
+	} )
+];

bin/wp-packages.js

@@ -0,0 +1,54 @@
+/**
+ * The WordPress packages used across the code and exposed globally on `cf.vendor` variable.
+ *
+ * @type {string[]}
+ */
+module.exports.packages = [
+	'@wordpress/compose',
+	'@wordpress/element',
+	'@wordpress/hooks',
+	'@wordpress/data'
+];
+
+/**
+ * Get the packages as an external configuration.
+ *
+ * @type {string[]}
+ */
+module.exports.externals = module.exports.packages.reduce( ( externals, package ) => {
+	externals[ package ] = [
+		'wp',
+		package.replace( '@wordpress/', '' )
+	];
+
+	return externals;
+}, {} );
+
+/**
+ * Get the packages as an external configuration.
+ * This variant is useful for the classic bundles where we
+ * provide those dependencies manually.
+ *
+ * @type {string[]}
+ */
+module.exports.proxyExternals = module.exports.packages.reduce( ( externals, package ) => {
+	externals[ package ] = [
+		'cf',
+		'vendor',
+		package
+	];
+
+	return externals;
+}, {} );
+
+/**
+ * Get the packages as a provider configuration.
+ * The providers should be used in combination with `proxyExternals` configuration.
+ *
+ * @type {Object}
+ */
+module.exports.providers = module.exports.packages.reduce( ( providers, package ) => {
+	providers[ module.exports.externals[ package ].join( '.' ) ] = package;
+
+	return providers;
+}, {} );