Using @wordpress/create-block tool in Block Development

If you have ever used WordPress starter themes, then you will absolutely love @wordpress/create-block command line tool.

I personally rarely used starter themes for my WordPress projects and usually I don’t rely on @wordpress/create-block tool when creating blocks. But anyway I think it is a great tool and you should know how to use it.

As a result of this lesson, we will have a really simple block inside the Block Editor.

Example of a block created with @wordpress/create-block tool
It is a “starter block” that was created by @wordpress/create-block tool.

Another reason why you should watch this lesson is that at the end of it you will have a fully functional and correctly created block. Yes, the block literally does nothing just displays the text, but you can explore its files, do some changes and see what will happen in the Block Editor.

How to Use @wordpress/create-block tool?

It is as simple as running a single NPM command npx @wordpress/create-block.

Interactive mode

By default the tool is going to be run in the interactive mode, so it is going to ask you questions right in the console:

running @wordpress/create-block in the interactive mode

Quick mode

But if you provide a block slug then the tool is not about to ask you anything during the process.

npx @wordpress/create-block my-block --title My Test Block --short-description It is just a test block --category text

In the command above we have:

There is also a couple more parameters you can find in the official tool documentation.

Starter Block Files Structure

Below are all the files that are about to be created by the tool:

@wordpress/create-block file structure

A couple notes about the file structure:

Misha Rudrastyh

Misha Rudrastyh

Hey guys and welcome to my website. For more than 10 years I've been doing my best to share with you some superb WordPress guides and tips for free.

Need some developer help? Contact me

Follow me on X