Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Create Block: Allow custom folder name for a block #37612

Merged
merged 1 commit into from
Jan 11, 2022
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Create Block: Allow custom folder name for a block
  • Loading branch information
gziolo committed Jan 11, 2022
commit c73dba2515346e140d86821caef8bb208420fd4b
2 changes: 1 addition & 1 deletion docs/reference-guides/block-api/block-metadata.md
Original file line number Diff line number Diff line change
Expand Up @@ -56,7 +56,7 @@ From a performance perspective, when themes support lazy loading assets, blocks

Furthermore, because the [Block Type REST API Endpoint](https://developer.wordpress.org/rest-api/reference/block-types/) can only list blocks registered on the server, registering blocks server-side is recommended; using the `block.json` file simplifies this registration.

The [WordPress Plugins Directory](https://wordpress.org/plugins/) can detect `block.json` files, highlight blocks included in plugins, and extract their metadata. If you wish to [submit your block(s) to the Block Directory](/docs/getting-started/tutorials/create-block/submitting-to-block-directory.md), all blocks contained in your plugin must have a `block.json` file for the Block Directory to recognize them.
The [WordPress Plugins Directory](https://wordpress.org/plugins/) can detect `block.json` files, highlight blocks included in plugins, and extract their metadata. If you wish to [submit your block(s) to the Block Directory](/docs/getting-started/create-block/submitting-to-block-directory.md), all blocks contained in your plugin must have a `block.json` file for the Block Directory to recognize them.

Development is improved by using a defined schema definition file. Supported editors can provide help like tooltips, autocomplete, and schema validation. To use the schema, add the following to the top of the `block.json`.

Expand Down
197 changes: 64 additions & 133 deletions package-lock.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

2 changes: 1 addition & 1 deletion package.json
Original file line number Diff line number Diff line change
Expand Up @@ -159,7 +159,7 @@
"chalk": "4.1.1",
"commander": "4.1.0",
"concurrently": "3.5.0",
"copy-webpack-plugin": "9.0.1",
"copy-webpack-plugin": "10.2.0",
"core-js-builder": "3.19.1",
"cross-env": "3.2.4",
"css-loader": "6.2.0",
Expand Down
2 changes: 2 additions & 0 deletions packages/create-block/CHANGELOG.md
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,8 @@
### New Features

- Integrated a new `plugin-zip` command to create a zip file for a WordPress plugin ([#37687](https://github.com/WordPress/gutenberg/pull/37687)).
- Add support for handling block templates with the `blockTemplatesPath` field in the external template configuration ([#37612](https://github.com/WordPress/gutenberg/pull/37612)).
- Add a new field `folderName` for setting the location for the `block.json` file and other optional block files generated from block templates included in the folder set with the `blockTemplatesPath` setting ([#37612](https://github.com/WordPress/gutenberg/pull/37612)).

### Enhancement

Expand Down
33 changes: 24 additions & 9 deletions packages/create-block/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@ Visit the [Gutenberg handbook](https://developer.wordpress.org/block-editor/deve

## Quick start

You just need to provide the `slug` which is the target location for scaffolded files and the internal block name.
You just need to provide the `slug` which is the target location for scaffolded plugin files and the internal block name.

```bash
$ npx @wordpress/create-block todo-list
Expand Down Expand Up @@ -40,10 +40,10 @@ Options:

```bash
-V, --version output the version number
-t, --template <name> block template type name, allowed values: "es5", "esnext", the name of an external npm package (default: "esnext"), or the path to a local directory.
-t, --template <name> plugin template type name, allowed values: "es5", "esnext", the name of an external npm package (default: "esnext"), or the path to a local directory.
--namespace <value> internal namespace for the block name
--title <value> display title for the block
--short-description <value> short description for the block
--title <value> display title for the plugin/block
--short-description <value> short description for the plugin/block
--category <name> category name for the block
--wp-scripts enable integration with `@wordpress/scripts` package
--no-wp-scripts disable integration with `@wordpress/scripts` package
Expand Down Expand Up @@ -131,29 +131,43 @@ It is mandatory to provide the main file (`index.js` by default) for the package

#### `templatesPath`

A mandatory field with the path pointing to the location where template files live (nested folders are also supported). All files without the `.mustache` extension will be ignored.
A mandatory field with the path pointing to the location where plugin template files live (nested folders are also supported). All files without the `.mustache` extension will be ignored.

_Example:_

```js
const { join } = require( 'path' );

module.exports = {
templatesPath: join( __dirname, 'templates' ),
templatesPath: join( __dirname, 'plugin-templates' ),
};
```

#### `blockTemplatesPath`

An optional field with the path pointing to the location where template files for the individual block live (nested folders are also supported). All files without the `.mustache` extension will be ignored.

_Example:_

```js
const { join } = require( 'path' );

module.exports = {
blockTemplatesPath: join( __dirname, 'block-templates' ),
};
```

#### `assetsPath`

This setting is useful when your template scaffolds a block that uses static assets like images or fonts, which should not be processed. It provides the path pointing to the location where assets are located. They will be copied to the `assets` subfolder in the generated plugin.
This setting is useful when your template scaffolds a plugin that uses static assets like images or fonts, which should not be processed. It provides the path pointing to the location where assets are located. They will be copied to the `assets` subfolder in the generated plugin.

_Example:_

```js
const { join } = require( 'path' );

module.exports = {
assetsPath: join( __dirname, 'assets' ),
assetsPath: join( __dirname, 'plugin-assets' ),
};
```

Expand Down Expand Up @@ -193,7 +207,8 @@ The following configurable variables are used with the template files. Template
- `version` (default: `'0.1.0'`)
- `wpScripts` (default: `true`)
- `wpEnv` (default: `false`)
- `npmDependencies` (default: `[]`) – the list of remote npm packages to be installed in the project with [`npm install`](https://docs.npmjs.com/cli/v6/commands/npm-install).
- `npmDependencies` (default: `[]`) – the list of remote npm packages to be installed in the project with [`npm install`](https://docs.npmjs.com/cli/v8/commands/npm-install) when `wpScripts` is enabled.
- `folderName` (default: `.`) – the location for the `block.json` file and other optional block files generated from block templates included in the folder set with the `blockTemplatesPath` setting.
- `editorScript` (default: `'file:./build/index.js'`)
- `editorStyle` (default: `'file:./build/index.css'`)
- `style` (default: `'file:./build/style-index.css'`)
Expand Down
Loading