Support

Account

Home Forums Gutenberg Load JS in editor with block.json Reply To: Load JS in editor with block.json

  • I had the same problem of my block JS file not loading when adding it this way. If you have wp_debug enabled you’ll probably see this notice which will show the name of the .asset.php file it’s expecting:

    “Function register_block_script_handle was called incorrectly…”.

    However, using this ACF forum post to start, I found how to load scripts via file name in blocks.json. I understand this is the better way to do it (now that it’s possible) instead of what Bill Erickson’s tutorial shows (enqueing the script manually via PHP).

    So since you are loading a JS file named custom.js you’d need to add in the same folder a file named custom.asset.php. In this file you can include the handle name, dependencies, and version number. Or you can leave them to be default generated. My js-file-name.asset.php looks like this:

    
    <?php
      return array(
        'dependencies' => array(
            'wp-blocks',
            'wp-element',
            'wp-i18n',
        ),
        'version'      => '1.0',
      );
    

    To read more about this, check out the WPDefinedAsset section in the WP Block Editor Handbook.