@nx/dependency-checks: add option for allowing dependencies to be satisfied by depending on their direct dependents

[Hotell]

Update

after additional convo this is actually a feature request

#29853 (comment)

---

Current Behavior

includeTransitiveDependencies does not work as expected (doesn't work at all? )

when enabled it doesn't parse transitive dependencies correctly and throws wrong lint errors

Error:

fluentui-contrib/packages/react-data-grid-react-window/package.json
  4:3  error  The "react-data-grid-react-window" project uses the following packages, but they are missing from "dependencies":
    - @fluentui/react-utilities
    - @fluentui/react-table  @nx/dependency-checks

Source to problematic imports:

• https://github.com/microsoft/fluentui-contrib/blob/main/packages/react-data-grid-react-window/src/components/DataGrid/DataGrid.tsx#L10
• https://github.com/microsoft/fluentui-contrib/blob/main/packages/react-data-grid-react-window/src/components/DataGridBody/useDataGridBody.tsx

react-components dependencies:

• https://github.com/microsoft/fluentui/blob/master/packages/react-components/react-components/package.json#L55
• https://github.com/microsoft/fluentui/blob/master/packages/react-components/react-components/package.json#L64

Expected Behavior

includeTransitiveDependencies should traverse children and properly resolve lint issues

GitHub Repo

https://github.com/Hotell/fluentui-contrib/tree/migrate-to-version-plans

Steps to Reproduce

1. checkout https://github.com/Hotell/fluentui-contrib/tree/migrate-to-version-plans
2. run yarn
3. run yarn nx run react-data-grid-react-window:lint

Nx Report

NX   Report complete - copy this into the issue template

Node           : 20.18.0
OS             : darwin-arm64
Native Target  : aarch64-macos
yarn           : 1.23.34

nx                     : 20.2.2
@nx/js                 : 20.2.2
@nx/jest               : 20.2.2
@nx/eslint             : 20.2.2
@nx/workspace          : 20.2.2
@nx/cypress            : 20.2.2
@nx/devkit             : 20.2.2
@nx/eslint-plugin      : 20.2.2
@nx/module-federation  : 20.2.2
@nx/playwright         : 20.2.2
@nx/plugin             : 20.2.2
@nx/react              : 20.2.2
@nx/storybook          : 20.2.2
@nx/vite               : 20.2.2
@nx/web                : 20.2.2
@nx/webpack            : 20.2.2
typescript             : 5.6.3
---------------------------------------
Local workspace plugins:
         @fluentui-contrib/nx-plugin

Failure Logs

Package Manager Version

yarn

Operating System

• macOS
• Linux
• Windows
• Other (Please specify)

Additional Information

when checking actual source of this rule, it uses the flag within this function to set seen Set https://github.com/nrwl/nx/blob/master/packages/js/src/utils/find-npm-dependencies.ts#L35-L37

and then recursively call collectAll https://github.com/nrwl/nx/blob/master/packages/js/src/utils/find-npm-dependencies.ts#L67-L73

I checked tests for this logic but wasn't able to find anything

No response

[leosvelperez]

Thanks for reporting this!

Setting includeTransitiveDependencies: false is meant to prevent complaining about transitive-only dependencies, not to prevent complaining about dependencies that are both direct and transitive. In your case, @fluentui/react-utilities and @fluentui/react-table are direct dependencies of the @fluentui-contrib/react-data-grid-react-window (as shown in the screenshots you attached). So, the rule is enforcing that those direct dependencies should be specified in the project's package.json file, which we could argue is correct. The @fluentui-contrib/react-data-grid-react-window package directly imports functionality from those packages. It doesn't import that functionality transitively through the @fluentui/react-components package.

Does that explain what you're seeing? Or do you still think the rule should behave differently?

[leosvelperez]

I will close this since, as explained above, it seems to be working as expected. If I missed anything or you still think the behavior should be different feel free to leave a message, and we can reopen it if needed.

[Hotell]

@leosvelperez hmm, so that setting does actually something different that it should do by following what transitive dependency means I guess ?

Please correct me if I understood it correctly:

• if I had includeTransitiveDependencies: true
• my project package.json would have {peerDependencies: "@fluentui/react-components" }
• my project would contain direct import eg `import { someHelper } from '@fluentui/react-components',
  • someHelpers is an re-export from react-components suite from export { someHelper } from '@fluentui/react-utilities'
• the rule triggers lint error that my project is missing @fluentui/react-utilities from dependencies

Expectation of transitive dependency check:

So what you describe is correct, although the requirement here is to not complain about direct dependencies that are transitive dependencies. Can we implement this behaviour to the rule ?

Why is this important (TL;DR):

If we use the rule as is, with the scenario described above, it will force us to provide both '@fluentui/react-components' and '@fluentui/react-utilities'.

This may introduce duplicates within user-land node_modules, if the version range of our specified package would not match in order to dedupe.

Duplicates are "show stoppers" in Singleton scenarios (whole React/Context thing) within Browser environment.

[JamesHenry]

@leosvelperez Let's reopen this as a feature request instead of a bug in includeTransitiveDependencies