reactjs - 如何在 PhpStorm 中为 WordPress Gutenberg 创建 React.js 文件

Question

所以我正在学习如何使用古腾堡，.jsx我相信很多这些教程都在展示他们的代码。我已经做了很多查找，但不确定我是否做对了。

我尝试使用 TypeScript 文件，当我在其中粘贴 React 代码时，它会询问我是否要切换到 React 文件格式。我说是的，它会创建一个.jsx文件，然后编译成一个.js文件。

但是，我在 WordPress 中粘贴的代码给了我一个错误：

无效的正则表达式：缺少 /

我不确定我是否正确设置了文件，或者我做错了什么。我在下面粘贴了我的代码

.JSX

const { registerBlockType } = wp.blocks;

registerBlockType('base-theme/tile-block', {
    title: "Tile Block",
    icon: 'welcome-write-blog',
    category: 'common',
    edit() {
        return (
            <div>Only the editor will show this</div>
        );
    },
    save() {
        return (
            <div>Only the front end will show this</div>
        );
    }
});

.JS 编译

var registerBlockType = wp.blocks.registerBlockType;
registerBlockType('base-theme/tile-block', {
    title: "Tile Block",
    icon: 'welcome-write-blog',
    category: 'common',
    edit: function () {
        return Only;
        the;
        editor;
        will;
        show;
        this < /div>;
    }
});
save();
{
    return Only;
    the;
    front;
    end;
    will;
    show;
    this < /div>;
    ;
}
;

标签： reactjsphpstormwebstormwordpress-gutenberg