zgordon / how-to-gutenberg-plugin Goto Github PK
View Code? Open in Web Editor NEWA demo WordPress plugin that teaches you how to build blocks with JavaScript
Home Page: https://gutenberg.courses/development
A demo WordPress plugin that teaches you how to build blocks with JavaScript
Home Page: https://gutenberg.courses/development
Just spinning up a new site and didn't have Gutenberg activated yet. Got a fatal error:
( ! ) Fatal error: Uncaught Error: Call to undefined function register_block_type() in /app/public/wp-content/plugins/jsforwp-how-to-gutenberg/jsforwp-how-to-gutenberg.php on line 130
Maybe an admin notice would be a helpful reminder.
In a fresh installation of the plugin i get several build errors:
[email protected] dev C:\xxx\wp-content\plugins\how-to-gutenberg-plugin-master
cross-env BABEL_ENV=default webpack --watch
Webpack is watching the files…
Hash: 92ab71e04b3c917dae58
Version: webpack 3.11.0
Time: 463ms
Asset Size Chunks Chunk Names
./assets/js/editor.blocks.js 7.73 kB 0 [emitted] ./assets/js/editor.blocks
[0] ./blocks/index.js 153 bytes {0} [built]
[1] ./blocks/i18n.js 50 bytes {0} [built]
[2] ./blocks/register-block-type/index.js 960 bytes {0} [built] [failed] [1 error]
[3] ./blocks/demo/index.js 1.24 kB {0} [built] [failed] [1 error]
ERROR in ./blocks/demo/index.js
Module build failed: SyntaxError: C:/xxx/wp-content/plugins/how-to-gutenberg-plugin-master/blocks/demo/index.js: Unexpected token (46:16)
44 | const onChangeMessage = message => { setAttributes( { message } ) };
45 | return (
> 46 | <div className={ className }>
| ^
47 | <h2>{ __( 'Call to Action', 'jsforwphowto' ) }</h2>
48 | <RichText
49 | tagName="div"
@ ./blocks/index.js 10:0-17
ERROR in ./blocks/register-block-type/index.js
Module build failed: SyntaxError: C:/xxx/wp-content/plugins/how-to-gutenberg-plugin-master/blocks/register-block-type/index.js: Unexpected token (34:20)
32 |
33 | // Create variable for block header since using it twice
> 34 | const blockHeader = <h2>{ __( 'registerBlockType Explained', 'jsforwphowto' ) }</h2>;
| ^
35 |
36 |
37 | /**
@ ./blocks/index.js 9:0-32
NPM runs on 5.6.0 and Node on 8.11.3.
Any idea?
Edit: Sorry for the terrible code display.
WP version: 5.4
Theme: Twenty Twenty 1.2
Wordpress is using built-in Gutenberg, when I create post and adding new demo custom block then remove it, there is a react warning in console (from react_devtools_backend.js file):
Warning: Can't perform a React state update on an unmounted component. This is a no-op, but it indicates a memory leak in your application. To fix, cancel all subscriptions and asynchronous tasks in the componentWillUnmount method.
Trying to follow your course, having a few setup issues when I run npm i
Wondering what version of node you're running?
throw er; // Unhandled 'error' event
^
Error: sha1-ILt0A9POo5jpHcRxCo/xuCdKJe0= integrity checksum failed when using sha1: wanted sha1-ILt0A9POo5jpHcRxCo/xuCdKJe0= but got sha1-ljRQKqEsRF3Vp8VzS1cruHOKrLs=. (8882 bytes)
at Transform.on (~/.nvm/versions/node/v8.11.4/lib/node_modules/npm/node_modules/ssri/index.js:275:19)
at emitNone (events.js:111:20)
at Transform.emit (events.js:208:7)
at endReadableNT (_stream_readable.js:1064:12)
at _combinedTickCallback (internal/process/next_tick.js:138:11)
at process._tickCallback (internal/process/next_tick.js:180:9)
events.js:183░░░░░░⸩ ⠹ extract:electron-releases: sill extract [email protected]
throw er; // Unhandled 'error' event
^
Error: sha1-ILt0A9POo5jpHcRxCo/xuCdKJe0= integrity checksum failed when using sha1: wanted sha1-ILt0A9POo5jpHcRxCo/xuCdKJe0= but got sha1-ljRQKqEsRF3Vp8VzS1cruHOKrLs=. (8882 bytes)
at Transform.on (~/.nvm/versions/node/v8.11.4/lib/node_modules/npm/node_modules/ssri/index.js:275:19)
at emitNone (events.js:111:20)
at Transform.emit (events.js:208:7)
at endReadableNT (_stream_readable.js:1064:12)
at _combinedTickCallback (internal/process/next_tick.js:138:11)
at process._tickCallback (internal/process/next_tick.js:180:9)
npm WARN [email protected] No repository field.
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: [email protected] (node_modules/fsevents):
npm WARN enoent SKIPPING OPTIONAL DEPENDENCY: ENOENT: no such file or directory, rename '/Users/Vishnu/Downloads/Practice/IL/industriallogic.dev.cc/wp-content/plugins/how-to-gutenberg-plugin/node_modules/.staging/fsevents-78d8192f/node_modules/strip-json-comments' -> '/Users/Vishnu/Downloads/Practice/IL/industriallogic.dev.cc/wp-content/plugins/how-to-gutenberg-plugin/node_modules/.staging/strip-json-comments-f9c83c18'
npm ERR! cancel after 1 retries!
npm ERR! A complete log of this run can be found in:
npm ERR! ~/.npm/_logs/2018-09-06T17_46_01_577Z-debug.log```
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.