Skip to content

@wordpress/dependency-extraction-webpack-plugin changes the version only if the javascript output changed. #72571

@nextend

Description

@nextend

Description

My Webpack entry has a JS output: plugins.js, which also produce a style-plugins.css and style-plugins-rtl.css

When you build @wordpress/dependency-extraction-webpack-plugin creates a file called plugins.asset.php which describe this with dependencies and a version string. The doc states that version is generated based on the file content. I think the problem is that version string is only based on the JS file content and ignores CSS. So ig you only have CSS changes, there version string does not change and if you have cache on your site, the CSS url's version does not reflect that the file has been changed.

add_action('enqueue_block_assets', function () {
	$style_path = 'build/style-plugins.css';
	$asset_path = plugin_dir_path(__FILE__) . 'build/plugins.asset.php';
	$asset = include($asset_path) ;

	wp_enqueue_style('mb-plugins', plugins_url($style_path, __FILE__), false, $asset['version']);
});

Step-by-step reproduction instructions

  1. Create a new package

webpack.config.js

const path = require('path');
const defaultConfig = require('@wordpress/scripts/config/webpack.config');

const entries = {};

entries['plugins'] = path.resolve('./src/plugins/index.js');

module.exports = {
	...defaultConfig,
	entry: entries,
	output: {
		path: path.resolve(__dirname, 'build'),
		filename: '[name].js',
	},
};

package.json

	"scripts": {
		"build": "wp-scripts build",
	},
	"devDependencies": {
		"@wordpress/scripts": "^30.26.0"
	},
	"dependencies": {
		"@wordpress/block-editor": "^15.6.0",
		"@wordpress/blocks": "^15.6.0",
		"@wordpress/dom-ready": "^4.33.0",
		"@wordpress/hooks": "^4.33.0",
		"@wordpress/rich-text": "^7.33.0"
	}

plugins/index.js

import "./style.scss";
console.log('Hello World')

plugins/style.scss

html {
    background: red;
}
  1. Run build
  2. Open build/plugins.asset.php and take a note of the version string
  3. Open plugins/style.scss and change red to green
  4. Run build
  5. Open build/plugins.asset.php again and compare version string to step 3

I expect the version string to change, but it will be the same.

Screenshots, screen recording, code snippet

No response

Environment info

No response

Please confirm that you have searched existing issues in the repo.

  • Yes

Please confirm that you have tested with all plugins deactivated except Gutenberg.

  • Yes

Please confirm which theme type you used for testing.

  • Block
  • Classic
  • Hybrid (e.g. classic with theme.json)
  • Not sure

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions