Compile Blocks when passing block.json to Webpack entry.

[michaelbragg]

What problem does this address?

I’m not sure if this is a bug, a feature request, or if it would contribute towards improved documentation.

We aim to compile our Gutenberg Blocks by declaring them inside a root webpack.config.js file instead of having multiple scripts for each block within the package.json.

Background: 


We are an agency that builds complete websites. The project repositories will include WP Core, 1st Party Theme, and multiple 1st Party Plugins. We must declare 20-30 individual scripts to compile each of our custom blocks, slots, variations, CSS, JS, etc. 
Our ideal solution would be to move these declarations outside the package.json file and into the Webpack config.


I’ve created a simplified version of our setup: https://github.com/michaelbragg/wp-webpack-config


Currently, the above code will compile


./public/wp-content/plugins/plugin-example/build/example-one
└ block.json
./public/wp-content/plugins/plugin-example/build/example-two
└ block.json

My understanding is that when --webpack-src-dir is passed to the wp-scripts command, it looks for directories containing a block.json and used this to compile the required files. Is this functionality missing when a block.json file is passed to the entry within a Webpack config?

What is your proposed solution?

module.exports = [
    {
        …defaultConfig,
        name: "Example Plugin",
        entry: {
            "example-one": "./public/wp-content/plugins/plugin-example/src/Domain/Blocks/example-one/block.json",

            "example-two": "./public/wp-content/plugins/plugin-example/src/Domain/Blocks/example-two/block.json",
            "slotfill": "./public/wp-content/plugins/plugin-example/src/Domain/Slots/slotfill",

          …
    },
    output: {
        ...defaultConfig.output,
        path.resolve( __dirname, "./public/wp-content/plugins/plugin-example/build/" )
    },
…

];

[gziolo]

The way the problem is described looks very similar to the existing issue:

• https://github.com/WordPress/gutenberg/issues/55936

Is this functionality missing when a block.json file is passed to the entry within a Webpack config?

It is a bit more nuanced. The entry points are for JavaScript/TypeScript files. I’m not entirely sure what happens when you pass the path to JSON file but if it is supported it would rather load the contents if of the file to output it as a JavaScript object.