Today I took the time to test the create-guten-block Node Package Runner, created and compiled some blocks.
It’s incredibly fast and really easy. Just run the npx create-guten-block <blockname> command and it will:
- Automatically creates the necessary plugin folder
- Install all the preprocessors like Babel, Sass, Autoprefixer and minifiers
If you then switch into the plugin folder and run npm start, the code is monitored and compiled as like as Grunt. In the end you can easily run npm run build and the final output will be exported. Pushing Git on the server will not be a problem. Otherwise you just have to upload the following content to the server to have it integrated directly:
- You have to create a plugin folder eg with the block name
- / dist/ **
If you have uploaded these elements, you have a fully functional block, but which is packed with advertising … I’ll show you the plugin file, which is shown in the backend. I called my block, which I wanted to create yesterday, jumbo-teaser:
/** * Plugin Name: jumbo-teaser — CGB Gutenberg Block Plugin * Plugin URI: https://github.com/ahmadawais/create-guten-block/ * Description: jumbo-teaser — is a Gutenberg plugin created via create-guten-block. * Author: mrahmadawais, maedahbatool * Author URI: https://AhmadAwais.com/ * Version: 1.0.0 * License: GPL2+ * License URI: https://www.gnu.org/licenses/gpl-2.0.txt * * @package CGB */
Please pay attention to how often your own data has been given here. This is not a problem and is everyone’s own business, but I think that I will write a script, where I will integrate a block into my template and then I will use this package runner only for initialization. It’s just not good that if you program a block for customers and then see so many other names and advertising in the backend. It is nowhere mentioned in the readme of the project that one is obliged to remove create-guten-block informations.
I’ll create my block tomorrow and implement it myself. Here I will document how and what I did.