Fix: wp-scripts command does not generate assets on Windows OS

[t-hamano]

Description

See: #38343

This PR solves the problem that assets are not generated in the build directory when the wp-scripts command is executed in Windows OS.

I think this problem is caused by the fact that in the process of parsing the metadata in block.json, the entry point is not detected correctly because the filepath has a backslash in Windows OS.

Testing Instructions

Check out this branch and run create-block in the gutenberg repository with the option to not install wp-script.

npx @wordpress/create-block gutennpride --no-wp-scripts

Move to the directory where it was created.

cd gutenpride

Run the following command using the local wp-scripts.

../node_modules/.bin/wp-scripts start
../node_modules/.bin/wp-scripts start --hot
../node_modules/.bin/wp-scripts start src/index.js --output-path=custom
../node_modules/.bin/wp-scripts build

Make sure that the assets are generated in the gutenpride/build directory.

Screenshots

Types of changes

Checklist:

• My code is tested.
• My code follows the WordPress code style.
• My code follows the accessibility standards.
• I've tested my changes with keyboard and screen readers.
• My code has proper inline documentation.
• I've included developer documentation if appropriate.
• I've updated all React Native files affected by any refactorings/renamings in this PR (please manually search all *.native.js files for terms that need renaming or removal).
• I've updated related schemas if appropriate.

[gziolo]

@t-hamano, thank you for opening this PR so quickly. I haven’t tested it yet, but it’s very likely that’s the way to go. It also made me think that we should start testing Create Block using GitHub Actions for all three envs to catch those subtle differences. I will set it up separately next week.

[gziolo]

Does it mean that it works incorrectly on Windows at split call with src/? Mayb we could use path.sep instead of /?

[t-hamano]

Does it mean that it works incorrectly on Windows at split call with src/?

Yes.
I couldn't find any official documentation, but it seems to be converted to a backslash on Windows when passing through path.join.

Like this:

const filepath = join(
	dirname( blockMetadataFile ),
	value.replace( 'file:', '' )
);
console.log( dirname( blockMetadataFile ) );
console.log( filepath );

Output:

D:/path/to/gutenberg/gutennpride/src
D:\path\to\gutenberg\gutennpride\src\index.js

Therefore, we need to replace the separator in the filepath variable with a forward slash.

Alternatively, the following will also work.

const [ , entryName ] = filepath
	.split( '.' )[ 0 ]
	.split( `src${ sep }` );

[gziolo]

For now, let’s use what you already have working 😃
I wanted to understand the issue better 👍

[gziolo]

I included a new CHANGELOG entry with the anticipation of the bug fix release later today. Thank you for fixing the issue with so detailed explanation 💯