首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >Wordpress自定义Gutenberg块无法工作:未定义的TypeError:无法读取未定义的属性块

Wordpress自定义Gutenberg块无法工作:未定义的TypeError:无法读取未定义的属性块
EN

Stack Overflow用户
提问于 2021-06-08 14:14:43
回答 1查看 2.3K关注 0票数 1

我现在很绝望。根据这些教程,我尝试为Gutenberg编辑器构建我的第一个自定义块:

我完全遵循了教程,但在Gutenberg编辑器中甚至看不到第一个示例块。在浏览器控制台中发生错误。

代码语言:javascript
复制
Uncaught TypeError: Cannot read property 'blocks' of undefined  
at external ["wp","blocks"]:1  
at Object.@wordpress/blocks (external ["wp","blocks"]:1)  
at __webpack_require__ (bootstrap:19)  
at Module../src/block-zw-myfirstblock.js (block-zw-myfirstblock.js:1)  
at __webpack_require__ (bootstrap:19)  
at bootstrap:83  
at bootstrap:83  

你知道会有什么问题吗?谢谢你的帮助。

这个块看起来就像wordpress教程中的那个。

block-zw-myfirstblock.js

代码语言:javascript
复制
import { registerBlockType } from '@wordpress/blocks';
import { useBlockProps } from '@wordpress/block-editor';
 
const blockStyle = {
    backgroundColor: '#900',
    color: '#fff',
    padding: '20px',
};
 
registerBlockType( 'zw/firstblock', {
    apiVersion: 2,
    title: 'Example: Basic (esnext)',
    icon: 'universal-access-alt',
    category: 'design',
    example: {},
    edit() {
        const blockProps = useBlockProps( { style: blockStyle } );
 
        return (
            <div { ...blockProps }>Hello World (from the editor).</div>
        );
    },
    save() {
        const blockProps = useBlockProps.save( { style: blockStyle } );
 
        return (
            <div { ...blockProps }>
                Hello World (from the frontend).
            </div>
        );
    },
} );

我就是这样注册的:

代码语言:javascript
复制
function child_theme_register_block() {
    $asset_file = include(get_stylesheet_directory_uri() . '/assets/js/gutenberg/block-zw-myfirstblock.asset.php');
    
    wp_register_script(
        'zw-myfirstblock-js',
        get_stylesheet_directory_uri() . '/assets/js/gutenberg/block-zw-myfirstblock.js',
        $asset_file['dependencies'],
        $asset_file['version']
        );
    
    register_block_type(
        'zw/firstblock',
        array(
            'api_version' => 2,
            'editor_script' => 'zw-myfirstblock-js',
            )
        );
}
add_action( 'init', 'child_theme_register_block' );

这是块-zw- included block.asset.php,它包含在块注册代码的第一行中:

代码语言:javascript
复制
<?php return array('dependencies' => array('wp-block-editor', 'wp-blocks', 'wp-polyfill'), 'version' => 'f87489192d38e545310e69e40f6c907c');
EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2021-06-08 14:59:31

这可能是您的问题:include(get_stylesheet_directory_uri() ....

uri()函数返回一个URL。您希望在包含来自服务器的目录()文件时使用。

票数 1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/67888799

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档