-
Notifications
You must be signed in to change notification settings - Fork 4.2k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Scripts: Add RTLCSS to wp-scripts. #61540
Conversation
The following accounts have interacted with this PR and/or linked issues. I will continue to update these lists as activity occurs. You can also manually ask me to refresh this list by adding the If you're merging code through a pull request on GitHub, copy and paste the following into the bottom of the merge commit message.
To understand the WordPress project's expectations around crediting contributors, please review the Contributor Attribution page in the Core Handbook. |
There are now two additional CSS files, `style-index-rtl.css` and `index-rtl.css`.
Size Change: +2.26 kB (+0.13%) Total Size: 1.74 MB
ℹ️ View Unchanged
|
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Wooohooo finally! 🎉 |
🎉 Thanks for merging @gziolo! |
Thanks for this! Is there any option to opt-out of it, especially in instances where developers are extending |
Array.prototype.filter is your friend, you can use it to exclude certain plugins from the default list. Or just provide your own list. |
Here's how I was able to exclude RTL in my webpack config: const defaultConfig = require( '@wordpress/scripts/config/webpack.config' );
const RtlCssPlugin = require( 'rtlcss-webpack-plugin' );
module.exports = {
...defaultConfig,
...{
plugins: [
...defaultConfig.plugins.filter(
(filter) => ! (filter instanceof RtlCssPlugin)
),
// Other plugins.
]
}
}; |
Fixes #29605 — This simply adds an RTLCSS step to the webpack build process in wp-scripts.
Why?
Core supports switching out the CSS files automatically if a
[name]-rtl.css
exists, but wp-scripts doesn't generate that currently. This adds the rtlcss plugin, which automatically generates the RTL-ified file for any CSS files. These are then automatically loaded on RTL sites when registered inblock.json
(sinceregister_block_style_handle
handles this).How?
Adds the RTLCSS plugin.
Testing Instructions
/path-to/gutenberg/packages/scripts/bin/wp-scripts.js build
-rtl.css
filesNote: I also tested this with a project that already includes the custom webpack code mentioned in this comment, and there were no issues with there being two RTLCSS plugins.