Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Update dependencies #1105

Merged
merged 16 commits into from
Apr 18, 2024
Merged

Update dependencies #1105

merged 16 commits into from
Apr 18, 2024

Conversation

azangru
Copy link
Collaborator

@azangru azangru commented Mar 20, 2024

Description

Routine dependencies update

Noteworthy updates

  • Storybook v7 -> Storybook v8
  • css-loader v6 -> v7
  • http-proxy-middleware v2 -> v3

Notes

- 1 -

There was an error with react override when updating Storybook.

npm ERR! Unable to resolve reference $react

image

Q: Why do we override react?
A: Because the officially released stable version of React (v. 18.2; more than a year and a half old by now) was spamming Sentry with hydration errors caused by script injection via chrome extensions (e.g. React dev tools). See #958 for details.

Changes made in this PR: changed the value in the overrides to the exact react version rather than the reference to react:

Before:

  "overrides": {
    "react": "$react",
    "react-dom": "$react-dom"
  },

Now:

  "overrides": {
    "react": "18.3.0-next-0ffc7f632-20230330",
    "react-dom": "18.3.0-next-0ffc7f632-20230330"
  },

This is slightly worse practice, according to npm docs; but still in the "good" category:

image

I expect we will be able to remove the override once React 19 is officially out.

- 2 -
css-loader has been updated from version 6 to version 7. There was a breaking change in version 7 in how css modules are created. Previously, when a CSS file was imported as a CSS module, it was treated as if it had a default export. Now, the default behaviour is to treat a css module as if each class were an independent named export (see link).

For this PR, I updated webpack configs, adding css-loader options that override the new default behaviour to simulate the old one.

Possibly in a different PR

  • Eslint had a major version update (v8 to v9). As a result, all packages dependent on eslint had to update as well. Among our dependencies, the only package that has not yet updated is eslint-plugin-react-hooks. Waiting for Facebook's PR https://github.com/facebook/react/pull/28773 to be merged.

Deployment URL(s)

http://update-dependencies.review.ensembl.org

Checks

  • Tests: ✅
  • Typescript types: ✅
  • Development build: ✅
  • Production build: ✅
  • Storybook: ✅

@azangru azangru marked this pull request as ready for review April 18, 2024 13:39
@azangru azangru requested a review from imransl April 18, 2024 13:39
Copy link
Contributor

@imransl imransl left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks good

@azangru azangru merged commit 2ee2300 into dev Apr 18, 2024
1 check passed
@azangru azangru deleted the update-dependencies branch April 18, 2024 16:35
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants