amzn / style-dictionary

A build system for creating cross-platform styles.
https://styledictionary.com
Apache License 2.0
3.92k stars 556 forks source link

Prettier v3 peerDependency conflict with local installation of prettier #1388

Open equinusocio opened 9 hours ago

equinusocio commented 9 hours ago

We get this error after upgrading to 4.2. Reverting to 4.1 works as expected

Error [ERR_MODULE_NOT_FOUND]: Cannot find module '/Workspaces/ui/node_modules/.pnpm/style-dictionary@4.2.0_prettier@2.8.8/node_modules/prettier/plugins/babel' imported from /Workspaces/ui/node_modules/.pnpm/style-dictionary@4.2.0_prettier@2.8.8/node_modules/style-dictionary/lib/common/formats.js
at finalizeResolution (node:internal/modules/esm/resolve:264:11)
at moduleResolve (node:internal/modules/esm/resolve:917:10)
at defaultResolve (node:internal/modules/esm/resolve:1130:11)
at nextResolve (node:internal/modules/esm/hooks:865:28)
at resolveBase (file:///Workspaces/ui/node_modules/.pnpm/tsx@4.19.2/node_modules/tsx/dist/esm/index.mjs?1731584854185:2:3212)
resolveDirectory (file:///Workspaces/ui/node_modules/.pnpm/tsx@4.19.2/node_modules/tsx/dist/esm/index.mjs?1731584854185:2:3584)
resolveTsPaths (file:///Workspaces/ui/node_modules/.pnpm/tsx@4.19.2/node_modules/tsx/dist/esm/index.mjs?1731584854185:2:4073)
jorenbroekema commented 8 hours ago

Did you get any warnings when you installed dependencies about prettier not meeting the peer dependency requirements of style-dictionary, namely it being 2.8.8 and style-dictionary requires 3.0.0 or higher? I'm not sure how PNPM handles these but in NPM you would get a fatal error upon installation:

Screenshot 2024-11-14 at 13 32 28

To my knowledge this can only be fixed by migrating to Prettier v3

Running npm install --legacy-peer-deps will just ignore the peer dep and result in the error which you are now getting because then it resolves the prettier 3.x.x peer dep on the v2 installation and that's missing the babel plugin. Same for --force flag.

NPM "overrides" also doesn't seem to work as expected, I would expect:

{
  "dependencies": {
    "prettier": "2.8.8",
    "style-dictionary": "^4.2.0"
  },
  "overrides": {
    "prettier": "^2.8.8",
    "style-dictionary": {
      "prettier": "$prettier"
     // $prettier means "take the version from style-dictionary's dependency on prettier". 
     //^3.0.0 also doesn't work. I guess overrides ignores peer deps... >.>
    }
  }
}

To install prettier v2 in the root node_modules and prettier v3 in node_modules/style-dictionary/node_modules which is what would happen if prettier was a regular dependency and not a peer dependency of style-dictionary, but NPM apparently disagrees with me. Doesn't seem like any filed a bug report for this yet....

I don't use PNPM so I don't know exactly how they resolve peer dependency conflicts, you'll have to do some research there and some npm ls prettier to figure out what will make PNPM install prettier v2 and v3 correctly. Or just migrate to Prettier v3 I suppose. Good luck!