WordPress.org
Get WordPress

Make WordPress Core

Changeset 56699


Ignore:
Timestamp:
09/26/2023 06:49:55 AM (3 years ago)
Author:
gziolo
Message:

Build: Introduce SCRIPT_DEBUG global in webpack processing

Backports the same changes to the webpack config in the Gutenberg plugin with ​https://github.com/WordPress/gutenberg/pull/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.

Location:
trunk/tools/webpack
Files:
3 edited

Legend:

Unmodified
Added
Removed

  • trunk/tools/webpack/blocks.js

    r56255 r56699  
    22 * External dependencies
    33 */
    4 const { DefinePlugin } = require( 'webpack' );
    54const CopyWebpackPlugin = require( 'copy-webpack-plugin' );
    65
    … …  
    1312 * Internal dependencies
    1413 */
    15 const { normalizeJoin, stylesTransform, baseConfig, baseDir } = require( './shared' );
     14const { baseDir, getBaseConfig, normalizeJoin, stylesTransform } = require( './shared' );
    1615const {
    1716    isDynamic,
    … …  
    6362    } ) );
    6463
     64    const baseConfig = getBaseConfig( env );
    6565    const config = {
    66         ...baseConfig( env ),
     66        ...baseConfig,
    6767        entry: {
    6868            'file/view': normalizeJoin(baseDir, `node_modules/@wordpress/block-library/build-module/file/view` ),
    … …  
    7777        },
    7878        plugins: [
    79             new DefinePlugin( {
    80                 // Inject the `IS_GUTENBERG_PLUGIN` global, used for feature flagging.
    81                 'process.env.IS_GUTENBERG_PLUGIN': false,
    82                 'process.env.FORCE_REDUCED_MOTION': JSON.stringify(
    83                     process.env.FORCE_REDUCED_MOTION,
    84                 ),
    85             } ),
     79            ...baseConfig.plugins,
    8680            new DependencyExtractionPlugin( {
    8781                injectPolyfill: false,

  • trunk/tools/webpack/packages.js

    r56048 r56699  
    22 * External dependencies
    33 */
    4 const { DefinePlugin } = require( 'webpack' );
    54const CopyWebpackPlugin = require( 'copy-webpack-plugin' );
    65const LiveReloadPlugin = require( 'webpack-livereload-plugin' );
    … …  
    1817 * Internal dependencies
    1918 */
    20 const { normalizeJoin, stylesTransform, baseConfig, baseDir } = require( './shared' );
     19const { baseDir, getBaseConfig, normalizeJoin, stylesTransform } = require( './shared' );
    2120const { dependencies } = require( '../../package' );
    2221
    … …  
    130129    } ) );
    131130
     131    const baseConfig = getBaseConfig( env );
    132132    const config = {
    133         ...baseConfig( env ),
     133        ...baseConfig,
    134134        entry: packages.reduce( ( memo, packageName ) => {
    135135            memo[ packageName ] = {
    … …  
    152152        },
    153153        plugins: [
    154             new DefinePlugin( {
    155                 // Inject the `IS_GUTENBERG_PLUGIN` global, used for feature flagging.
    156                 'process.env.IS_GUTENBERG_PLUGIN': false,
    157                 // Inject the `IS_WORDPRESS_CORE` global, used for feature flagging.
    158                 'process.env.IS_WORDPRESS_CORE': true,
    159                 'process.env.FORCE_REDUCED_MOTION': JSON.stringify(
    160                     process.env.FORCE_REDUCED_MOTION
    161                 ),
    162             } ),
     154            ...baseConfig.plugins,
    163155            new DependencyExtractionPlugin( {
    164156                injectPolyfill: true,

  • trunk/tools/webpack/shared.js

    r55193 r56699  
    22 * External dependencies
    33 */
     4const { DefinePlugin } = require( 'webpack' );
    45const TerserPlugin = require( 'terser-webpack-plugin' );
    56const postcss = require( 'postcss' );
    … …  
    89const baseDir = join( __dirname, '../../' );
    910
    10 const baseConfig = ( env ) => {
     11const getBaseConfig = ( env ) => {
    1112    const mode = env.environment;
    1213
    … …  
    4243        stats: 'errors-only',
    4344        watch: env.watch,
     45        plugins: [
     46            new DefinePlugin( {
     47                // Inject the `IS_GUTENBERG_PLUGIN` global, used for feature flagging.
     48                'process.env.IS_GUTENBERG_PLUGIN': false,
     49                // Inject the `IS_WORDPRESS_CORE` global, used for feature flagging.
     50                'process.env.IS_WORDPRESS_CORE': true,
     51                // Inject the `SCRIPT_DEBUG` global, used for dev versions of JavaScript.
     52                SCRIPT_DEBUG: mode === 'development',
     53            } ),
     54        ],
    4455    };
    4556
    … …  
    8091module.exports = {
    8192    baseDir,
    82     baseConfig,
     93    getBaseConfig,
    8394    normalizeJoin,
    8495    stylesTransform,
Note: See TracChangeset for help on using the changeset viewer.