How to build a Gutenberg block the modern way
何时使用: You need a custom editor block and don't want to hand-roll outdated ESNext + webpack scaffolding.
步骤
-
Describe the blockBuild a Testimonial block: quote text, author name, author photo — edit and save views.✓ 已复制→ block.json + edit.js + save.js scaffolded, @wordpress/scripts build setup
-
Add attributes and controlsAdd an alignment control and a color picker.✓ 已复制→ BlockControls / InspectorControls added correctly
-
Bundle and registerWrite the PHP that registers the block from block.json.✓ 已复制→ register_block_type( __DIR__ . '/build/block.json' )
结果: A working modern Gutenberg block with proper packaging.
注意事项
- Missing i18n wrappers — Skill reminds Claude to wrap strings with __() and _x()