I think I'm missing obvious here, but here's the issue:

I used the current @wordpress/create-block to create a block plugin.

I'm looking to create three blocks in this plugin, so I setup the first one and it's working great in the editor and saving. The block details are all coming from the block.json, as it's setup by default in create-block.

So I added a folder called 'label' under src, moved the index.js, save.js, edit.js, and stylesheets into the folder. I setup an index.js in the root and import that file. The block continues to work, even after the folder change with NPM running.

With the block working, both the plugin PHP file with register_block_type_from_metadata() and the block.json are still in the root directory. With NPM running, the block continues to work fine. I have the attributes only defined in block.json, and content is saving to those attributes, so I know it's 100% working.

However...when I move the block.json to the 'label' folder - like I see in core blocks and elsewhere, and as it makes sense so I can define more blocks - it breaks. I followed the docs of adding the path to the directory:

function create_block_nutrition_facts_stacked_block_init() {
        __DIR__ . '/src/label'

Now the block isn't registered at all. I had renamed the label folder, so just as a test I moved the block.json to the root of the src folder and adjusted the path. Still not working. I took DIR out and gave it a direct path, I put the full file in (/src/label/block.json), I added and removed slashes and ./ and ../ and all kinds of things in case I'm just tired and was typing something wrong and it doesn't recognize it.

If I change it back to just DIR and move block.json back to the root, it works again fine. Attributes save. I've started and restarted NPM, I dug through tons of other plugins on Github, I dug through core plugins...I cannot find anyone using the new way of registering multiple blocks in a single plugin. Considering the "old way" will be depreciated according to the github pull request that merged block.json into the @wordpress/create-block...I'd really like to do it the "right" way here, but I'm stumped.

Any help is appreciated.

  • one way i found is - we can add multiple json files register_block_type_from_metadata it a folder or file name. so file names we can add by calling mutiples times. block.json, block2.json .. if no file name is given, i.e. only folder path mentioned then default block.js will be called. – bhv May 31 at 16:48

Figured it out, in the block.json script needs a new relative location to the build directory, so new code:

"editorScript": "file:../../build/index.js",
"editorStyle": "file:../../build/index.css",
"style": "file:../../build/style-index.css"
  • It is the correct answer, however I had a hard time to understand what does this mean. It means that the paths inside block.json must be set in a way, that the file locations are correct relative to the (new) location of block.json. – sbnc.eu May 21 at 19:48

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.