Skip to content

Commit

Permalink
Build: Introduce SCRIPT_DEBUG global in webpack processing
Browse files Browse the repository at this point in the history
Backports the same changes to the webpack config in the Gutenberg plugin with WordPress/gutenberg#50122.

The `warning` function from `@wordpress/warning` no longer worked correctly with webpack 5. In practice, it no longer called `console.warn`. To fix it, the usage of `process.env.NODE_ENV` check got replaced with another optional global: `SCRIPT_DEBUG`. All the tools used in the Gutenberg, get updated to work with this new constant, including `@wordpress/scripts`. This way, developers are able to guard code that should be run only in development mode. In WordPress core, the same constant needs to be added mostly to ensure that the code behind the check gets completely removed in production mode.

Fixes #59407.



git-svn-id: https://develop.svn.wordpress.org/trunk@56699 602fd350-edb4-49c9-b593-d223f7449a82
  • Loading branch information
gziolo authored and Anton Vlasenko committed Sep 29, 2023
1 parent 63d93e3 commit 84e41d3
Show file tree
Hide file tree
Showing 3 changed files with 21 additions and 24 deletions.
14 changes: 4 additions & 10 deletions tools/webpack/blocks.js
Original file line number Diff line number Diff line change
@@ -1,7 +1,6 @@
/**
* External dependencies
*/
const { DefinePlugin } = require( 'webpack' );
const CopyWebpackPlugin = require( 'copy-webpack-plugin' );

/**
Expand All @@ -12,7 +11,7 @@ const DependencyExtractionPlugin = require( '@wordpress/dependency-extraction-we
/**
* Internal dependencies
*/
const { normalizeJoin, stylesTransform, baseConfig, baseDir } = require( './shared' );
const { baseDir, getBaseConfig, normalizeJoin, stylesTransform } = require( './shared' );
const {
isDynamic,
toDirectoryName,
Expand Down Expand Up @@ -62,8 +61,9 @@ module.exports = function( env = { environment: 'production', watch: false, buil
noErrorOnMissing: true,
} ) );

const baseConfig = getBaseConfig( env );
const config = {
...baseConfig( env ),
...baseConfig,
entry: {
'file/view': normalizeJoin(baseDir, `node_modules/@wordpress/block-library/build-module/file/view` ),
'navigation/view': normalizeJoin(baseDir, `node_modules/@wordpress/block-library/build-module/navigation/view` ),
Expand All @@ -76,13 +76,7 @@ module.exports = function( env = { environment: 'production', watch: false, buil
path: normalizeJoin(baseDir, `${ buildTarget }/blocks` ),
},
plugins: [
new DefinePlugin( {
// Inject the `IS_GUTENBERG_PLUGIN` global, used for feature flagging.
'process.env.IS_GUTENBERG_PLUGIN': false,
'process.env.FORCE_REDUCED_MOTION': JSON.stringify(
process.env.FORCE_REDUCED_MOTION,
),
} ),
...baseConfig.plugins,
new DependencyExtractionPlugin( {
injectPolyfill: false,
} ),
Expand Down
16 changes: 4 additions & 12 deletions tools/webpack/packages.js
Original file line number Diff line number Diff line change
@@ -1,7 +1,6 @@
/**
* External dependencies
*/
const { DefinePlugin } = require( 'webpack' );
const CopyWebpackPlugin = require( 'copy-webpack-plugin' );
const LiveReloadPlugin = require( 'webpack-livereload-plugin' );
const UglifyJS = require( 'uglify-js' );
Expand All @@ -17,7 +16,7 @@ const DependencyExtractionPlugin = require( '@wordpress/dependency-extraction-we
/**
* Internal dependencies
*/
const { normalizeJoin, stylesTransform, baseConfig, baseDir } = require( './shared' );
const { baseDir, getBaseConfig, normalizeJoin, stylesTransform } = require( './shared' );
const { dependencies } = require( '../../package' );

const exportDefaultPackages = [
Expand Down Expand Up @@ -129,8 +128,9 @@ module.exports = function( env = { environment: 'production', watch: false, buil
to: normalizeJoin(baseDir, `src/${ phpFiles[ filename ] }` ),
} ) );

const baseConfig = getBaseConfig( env );
const config = {
...baseConfig( env ),
...baseConfig,
entry: packages.reduce( ( memo, packageName ) => {
memo[ packageName ] = {
import: normalizeJoin(baseDir, `node_modules/@wordpress/${ packageName }` ),
Expand All @@ -151,15 +151,7 @@ module.exports = function( env = { environment: 'production', watch: false, buil
path: normalizeJoin(baseDir, `${ buildTarget }/js/dist` ),
},
plugins: [
new DefinePlugin( {
// Inject the `IS_GUTENBERG_PLUGIN` global, used for feature flagging.
'process.env.IS_GUTENBERG_PLUGIN': false,
// Inject the `IS_WORDPRESS_CORE` global, used for feature flagging.
'process.env.IS_WORDPRESS_CORE': true,
'process.env.FORCE_REDUCED_MOTION': JSON.stringify(
process.env.FORCE_REDUCED_MOTION
),
} ),
...baseConfig.plugins,
new DependencyExtractionPlugin( {
injectPolyfill: true,
combineAssets: true,
Expand Down
15 changes: 13 additions & 2 deletions tools/webpack/shared.js
Original file line number Diff line number Diff line change
@@ -1,13 +1,14 @@
/**
* External dependencies
*/
const { DefinePlugin } = require( 'webpack' );
const TerserPlugin = require( 'terser-webpack-plugin' );
const postcss = require( 'postcss' );
const { join } = require( 'path' );

const baseDir = join( __dirname, '../../' );

const baseConfig = ( env ) => {
const getBaseConfig = ( env ) => {
const mode = env.environment;

const config = {
Expand Down Expand Up @@ -41,6 +42,16 @@ const baseConfig = ( env ) => {
},
stats: 'errors-only',
watch: env.watch,
plugins: [
new DefinePlugin( {
// Inject the `IS_GUTENBERG_PLUGIN` global, used for feature flagging.
'process.env.IS_GUTENBERG_PLUGIN': false,
// Inject the `IS_WORDPRESS_CORE` global, used for feature flagging.
'process.env.IS_WORDPRESS_CORE': true,
// Inject the `SCRIPT_DEBUG` global, used for dev versions of JavaScript.
SCRIPT_DEBUG: mode === 'development',
} ),
],
};

if ( mode === 'development' && env.buildTarget === 'build/' ) {
Expand Down Expand Up @@ -79,7 +90,7 @@ const normalizeJoin = ( ...paths ) => join( ...paths ).replace( /\\/g, '/' );

module.exports = {
baseDir,
baseConfig,
getBaseConfig,
normalizeJoin,
stylesTransform,
};

0 comments on commit 84e41d3

Please sign in to comment.