Feature(monosize): make `packageName` configurale within `compare-reports` command

[Hotell]

ATM packageName for local report is being inferred from package folder basename https://github.com/microsoft/monosize/blob/main/packages/monosize/src/utils/collectLocalReport.mts#L23

While this might work for simple use-cases once it should be configurable by the user.

Example

when directory structure is (see within PR)

|-react-alert/
  |- library/
    |- /bundle-size 
  |- stories/
  |- e2e/

Current:

Expected:

Proposed Implementations:

1. change the behaviours to obtain the name from package.json#name and fallback to folder basename if not present

This would be a BREAKING CHANGE

2. enable set this behaviour via configuration

• via cli

monosize compare-reports --packageName='folder'|'package.json'

• via config

export type MonoSizeConfig = {
    repository: string;
    storage: StorageAdapter;
    bundler: BundlerAdapter;
+   commands: {
+     'compare-report': {
+        packageName: 'directory' | 'packageJSON' | ( packageRoot:string ) => string
+      }
  }
};

[layershifter]

@Hotell oopsie, good catch 👍

---

packageName is defined there and is used also for upload-report:

https://github.com/microsoft/monosize/blob/2db473d8effc2fe2288d9c5f33b0db721e9cd359/packages/monosize/src/utils/collectLocalReport.mts#L23-L24

As it's used in multiple places IMO it should be hosted in a config. As monosize is still in 0.x, IMO it's fine to break it for good 🐱

I propose:

export type MonoSizeConfig = {
    repository: string;
    storage: StorageAdapter;
    bundler: BundlerAdapter;
+   packageName?: async (packageRoot: string) => Promise<string>;
};

• If packageName is present, we will let users to define their own thing
• If packageName is absent, we will use name from package.json i.e. @fluentui/react-image instead of react-image like now

WDYT?

[Hotell]

For sake of simplicity this is good enough IMO from configuration POV, not sure about the defaults (inferring name from package.json):

• If user library(package) doesn't contain package.json, monosize would provide invalid results/throw error by default.
• now some libraries might use only project.json (nx ecosystem) for non publishable packages (another case of invalid output )

but I'm ok to go with this and provide appropriate error messages to user.

WDYT?

[layershifter]

For sake of simplicity this is good enough IMO from configuration POV, not sure about the defaults (inferring name from package.json):

• If user library(package) doesn't contain package.json, monosize would provide invalid results/throw error by default.
• now some libraries might use only project.json (nx ecosystem) for non publishable packages (another case of invalid output )

That's a good call out. Then let's keep directory name as a default? So there won't be breaks at all.

If we want to handle these scenarios better, we also need to make findPackageRoot() configurable as currently it accounts only for package.json:

https://github.com/microsoft/monosize/blob/2db473d8effc2fe2288d9c5f33b0db721e9cd359/packages/monosize/src/utils/collectLocalReport.mts#L12

[Hotell]

so to recap the solution we wanna go forward with:

• new config option packageName?: async (packageRoot: string) => Promise<string>;
• defaults stay the same
• update package root retrieval

Additional thoughts:

so if we update package root retrieval to account for project.json or package.json why not leverage it to get the name property from there already ==> this would imply default name resolution like (package.json#name ?? project.json#name ?? directory-name)

[layershifter]

Additional thoughts:

so if we update package root retrieval to account for project.json or package.json why not leverage it to get the name property from there already ==> this would imply default name resolution like (package.json#name ?? project.json#name ?? directory-name)

What about this plan then? ⬇️

• new config option packagePath?: async (filepath: string) => Promise<string>
  • defaults to (filepath) => findUp(['package.json', 'project.json'], { cwd: path.dirname(filepath) })
• new config option packageName?: async (packageRoot: string) => Promise<string>;
  • defaults package.json#name ?? project.json#name (it can't fallback to dir name as may not find package.json or project.json)

[Hotell]

sounds good 🤝 !

I'll implement this next week. ty !