Javascript Wordpress自定义GutenBerg块未显示在插入器对话框中

所以，我正在WordPress中为woo commerce开发一个插件，现在我正在尝试构建一个小部件。 我已经成功构建了一个自定义小部件，它可以在整个商店中显示（在外观>小部件下）。 现在我想构建一个定制的Gutenberg块，用于页面编辑器。 现在的问题是，即使是一个简单的示例似乎也没有加载，但也没有任何错误消息，所以我对如何继续有点不知所措

我使用了WordPress文档本身的示例，正如它们所述，在这个简单的示例中，块应该在的“插入器对话框”中初始化

我的代码是>

block.jsx（使用的文件由webpack编译、加载并显示控制台日志）：

因此blockload.php中的任何语法错误都将抛出一个错误。 正如我现在发布的，一切都很好，没有任何错误（wp_窃听，真的） 但是在“插入器”对话框的“设计”类别下也没有额外的块

那么我现在从哪里开始寻找罪犯呢

编辑**

因此，基本上我不知道最初的js有什么问题，因为它来自dev.wordpress上的示例

我使用了一种稍微有点另类的方法，js如何返回内容，但它是有效的。 下面是这个示例（edit2>>tho它使用了我现在看到的一个不推荐使用的函数，因此不应该使用，但它有一些功能正在工作，因此其余部分超出了这个问题的范围）：

---

所以问题结束了

请使用

创建古腾堡区块

古腾堡区块开发开发工具包

---

我希望它能对您有所帮助。

我刚刚检查了我的正常设置，并且在我的依赖项数组（PHP）中有

wp块

和

wp块编辑器

，我正在使用

init

钩子来注册块，而不是

将块资产排队

。也许…你在做了更改后重新激活了插件吗？尝试了你的建议，但前端仍然没有任何响应。。还有，这是我需要做的事吗？我已经为woocommerce设置、编辑产品设置、插件选项卡等构建了一些东西，而不是一次需要重新激活我的插件？这似乎会生成一个全新的插件？我希望有一个解决方案，我创建的块是我目前正在开发的插件的一部分

import { registerBlockType } from '@wordpress/blocks';
import { useBlockProps } from '@wordpress/block-editor';

const blockStyle = {
    backgroundColor: '#900',
    color: '#fff',
    padding: '20px',
};
 console.log("test1");
registerBlockType('gutenberg-examples/example-01-basic-esnext', {
    apiVersion: 2,
    title: 'Example: Basic (esnext)',
    icon: 'universal-access-alt',
    category: 'design',
    example: {},
    edit() {
        const blockProps = useBlockProps( { style: blockStyle } );
        return <div {...blockProps}>Hello World, step 1 (from the editor).</div>;
    },
    save() {
        const blockProps = useBlockProps.save( { style: blockStyle } );
        return <div {...blockProps}>Hello World, step 1 (from the front-end).</div>;
    },
} );

<?php
// if (! defined( "ABSPATH")){
//     exit;
// };

function gutenberg_examples_01_register_block() {
 
 // automatically load dependencies and version
//  $asset_file = include( plugin_dir_path( __FILE__ ) . 'build/index.asset.php');
$asset_file = array('dependencies' => array('wp-element', 'wp-polyfill'), 'version' => 'fc93c4a9675c108725227db345898bcc');

 wp_register_script(
     'gutenberg-examples-01-esnext',
     plugins_url('wocom_bl/resources/Scripts/bundles/editpage/editpage.bundle.js'),
    //  plugins_url( 'build/index.js', __FILE__ ),
     $asset_file['dependencies'],
     $asset_file['version']
 );

 register_block_type( 'gutenberg-examples/example-01-basic-esnext', array(
     'editor_script' => 'gutenberg-examples-01-esnext',
 ) );

}
// add_action( 'init', 'gutenberg_examples_01_register_block' );
add_action('enqueue_block_assets', 'gutenberg_examples_01_register_block');

if ( wcmbl_isWooCommerceActivated() ) {
    require_once __DIR__ . '/includes/settings.php';
    require_once __DIR__ . '/includes/products/producttab.php';
    // require_once __DIR__ . '/includes/page/register_widgets.php';
     require_once __DIR__ . '/includes/page/blocks/blockload.php';
}