I was following a blocks tutorial that was using @wordpress/editor to import some components and everything was working correctly but I was getting tons of deprecation warnings in the browser all saying I should be using @wordpress/block-editor instead.
So I replaced it and installed the block editor in npm:
npm install @wordpress/block-editor --save
then in my plugins.php I added the dependency:
wp_register_script(
'testblocks-editor-script',
plugins_url('dist/editor.js', __FILE__),
array('wp-blocks', 'wp-i18n', 'wp-element', 'wp-block-editor')
);
added to my webpack.config.js:
externals: {
"@wordpress/blocks": ["wp", "blocks"],
"@wordpress/i18n": ["wp", "i18n"],
"@wordpress/element": ["wp", "element"],
"@wordpress/block-editor": ["wp", "blockEditor"]
}
So now any time I save my previously working post in Wordpress I get this error in the browser's console and I am not able to edit:
TypeError: _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_2__ is undefined parent.js:35
I would think this is the relevant line in parent.js:
import { InnerBlocks, InspectorControls } from "@wordpress/block-editor";
...
edit: ({ className, attributes, setAttributes }) => {
return (
<div className={`${className}-test`}> // this is line 35
Is my externals declaration incorrect?