I found out by accident that babel-plugin-inline-json-import doesn't tree-shake well in the generated output.

Every time we import a json file, it will inline the full content of the JSON file again in the bundle. This output won't be deduped and will end up in the final minified bundle as well. Destructuring also doesn't help.

Take this as an example:

This will inline all three block.json in this utils file even after bundling with other files that have these JSON files already.

You can verify it by looking into the built file in /build/block-library/index.min.js after running npm run build. Search for $schema:"https://schemas.wp.org/trunk/block.json",apiVersion:2,name:" to find all inlined block.json files. For instance, searching for $schema:"https://schemas.wp.org/trunk/block.json",apiVersion:2,name:"core/list-item" results in four occurrences. That's one json file that gets inlined four times.

Using custom plugins also doesn't play well with modern build tools other than babel like esbuild or swc if we decide to use them in the future.

For webpack builds, it natively supports importing json files so it shouldn't be an issue. However, we need to figure out a way to handle this for package builds. My immediate solution is to just copy the json files to the build folder without processing them, and let the bundlers handle them. It will be a breaking change though. Thoughts?