Pros and cons of using asterisks (*) instead of exact package versions in .yarnrc.yml > packageExtensions

[0xNeshi]

EXPLANATORY NOTE:

What is meant with using exact package versions in .yarnrc.yml > packageExtensions:

nodeLinker: node-modules

packageExtensions:
  ...
 
  "[email protected]":
    peerDependencies:
      "@babel/plugin-syntax-flow": ^7.14.5
      "@babel/plugin-transform-react-jsx": ^7.14.9

  "[email protected]":
    peerDependencies:
      typescript: ">=2.7"
      webpack: ">=4"

  ...

yarnPath: .yarn/releases/yarn-3.2.1.cjs

What is meant with using asterisks (*) in .yarnrc.yml > packageExtensions:

nodeLinker: node-modules

packageExtensions:
  ...

  "react-scripts@*":
    peerDependencies:
      "@babel/plugin-syntax-flow": "*"
      "@babel/plugin-transform-react-jsx": "*"

  "react-dev-utils@*":
    peerDependencies:
      typescript: "*"
      webpack: "*"

  ...

yarnPath: .yarn/releases/yarn-3.2.1.cjs

---

My team stumbled upon an issue when upgrading a couple of dependency versions on a React project where we used [email protected], for some reason the project wouldn't build after the upgrade(s). We soon realized the cause of this was yarn downloading incompatible packages because of the way our .yarnrc.yml was configured - we used exact package versions in packageExtensions, which we forgot to update when updating our dependencies in package.json.
We quickly solved this issue when we switched to using asterisks (*) in packageExtensions and let yarn handle downloading correct package versions. It is not certain this was the correct approach to handle the issue, but it was quick and made the pipeline work again, so we ran with it.

So the questions we had were:

1. Are there any performance benefits with using one approach or the other? Any drawbacks?
2. Which should generally be preferred of the two approaches?
3. Which situations call for using asterisks (*) and which call for using exact package versions?

[0xNeshi]

Can we get some guidance here?