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
- 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;
}
- Run build
- Open build/plugins.asset.php and take a note of the version string
- Open plugins/style.scss and change red to green
- Run build
- 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.
Please confirm that you have tested with all plugins deactivated except Gutenberg.
Please confirm which theme type you used for testing.
Description
My Webpack entry has a JS output:
plugins.js, which also produce astyle-plugins.cssandstyle-plugins-rtl.cssWhen you build
@wordpress/dependency-extraction-webpack-plugincreates a file calledplugins.asset.phpwhich describe this withdependenciesand aversionstring. The doc states that version is generated based on the file content. I think the problem is thatversionstring is only based on the JS file content and ignores CSS. So ig you only have CSS changes, thereversionstring 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.Step-by-step reproduction instructions
webpack.config.jspackage.jsonplugins/index.jsplugins/style.scssI 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.
Please confirm that you have tested with all plugins deactivated except Gutenberg.
Please confirm which theme type you used for testing.