Editor styles not loading in WP6.3 with bud dev

sage
,
19

Hi @raffjones,

It sounds like you have add_editor_style() set up correctly, as the prod build works.

WordPress is now processing and inlining <style> tags in the iframe body itself. This process relies on a CSS file being on disk. Bud / Webpack will not emit assets to disk in dev mode, and instead produces JS chunks which allow for hot module reloading. This is where the issue you’re experiencing stems from.

There are a couple of solutions:

  • Use a Webpack plugin like mini-css-extract-plugin to emit CSS assets in dev
  • Use a more specific approach to target styles and emit CSS assets. I wrote a Bud extension a while ago which attempts to handle this - bud-wp-editor-query

Either way, to my knowledge, there is no way to enable HMR inside the FSE editor iframe. The design approach taken by WordPress to inline the styles prohibits this.

2 Likes