Skip to content

Commit 0bac4de

Browse files
authored
chore: upgrade dependencies (ebpf-io#193)
* chore: upgrade dependencies * chore: update package-lock * fix: install netlify locally * chore: uninstall @netlify/plugin-gatsby * chore: update node version * chore: minor change * chore: add dependency updates file * fix: logo image path
1 parent 7210b63 commit 0bac4de

27 files changed

+34847
-16886
lines changed

.nvmrc

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1 +1 @@
1-
v12.18.0
1+
v16.13.0

DEPENDENCY_UPDATES.md

Lines changed: 105 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,105 @@
1+
This is a reference on how to perform a safe dependencies update. It consists of step-by-step instruction and a list of known issues. Do not hesitate to contribute when facing outdated information or encountering a new issue.
2+
3+
## 🦾 Engine support
4+
5+
Version of npm and the node on which the project runs
6+
7+
```json
8+
"node": "^16.15.0",
9+
"npm": "^8.3.x"
10+
```
11+
12+
## ♻️ Recommended way to update dependencies
13+
14+
This routine assumes you’ll be using `npm` as the main package manager.
15+
16+
- `npm update` - this command will update all the packages listed to the latest version (specified by the tag config), respecting the [semver](https://semver.org/) constraints of both your package and its dependencies (if they also require the same package). It will also install missing packages.
17+
18+
💡 Note that by default `npm update` will not update the [semver](https://semver.org/) values of direct dependencies in your project `package.json`, if you want to also update values in `package.json` you can run: `npm update --save` (or add the `save=true` option to a [configuration file](https://docs.npmjs.com/cli/v8/configuring-npm/npmrc) to make that the default behavior).
19+
20+
1. Open up the project, fetch latest changes, branch out
21+
22+
2. Run `npm update --save` to update all the versions in your package.json
23+
24+
The most common/best practice is to never allow automatic updates to versions that have potentially critical changes this applies to `major` versions so in this case you can rest assured that you will not get critical changes during the upgrade, but if you want to upgrade the `major` version you will need to do it manually (more about this in step 5) - this will allow you to further check and make sure everything works fine
25+
26+
⚠️ **Please, make yourself familiar with conventional [semver constraints](https://docs.npmjs.com/cli/v8/commands/npm-update#example)**
27+
28+
3. Run `npm install` to update the deps
29+
30+
4. Run the project, check if everything is okay
31+
32+
5. Run `npm outdated` to check for major versions that we can update
33+
34+
<details>
35+
<summary>Example output</summary>
36+
<img width="795" alt="" src="https://user-images.githubusercontent.com/17677196/172698954-49d348ec-18a6-4851-a97c-b5b3b6da1c7b.png">
37+
</details>
38+
39+
Use the `npm install <packageName>@latest` command to update the dependencies, in this case we recommend updating each dependency in stages, going back to step 3 and 4 to check that the project is working
40+
41+
6. If you are done, commit the changes and make a PR
42+
43+
Send your PR to the [#review-dev](https://pixelpointworkspace.slack.com/archives/C02GWMHD5LK) channel for review, and once it is approved to merge with the main branch, update the project data in the [Deps update](https://www.notion.so/Event-block-on-https-www-vshn-ch-en-show-the-next-3-upcoming-events-from-https-www-vshn-ch-en--5090215f3b6e4b1abf0568f2c2ca27bb) table
44+
45+
## Alternative dependency update routine
46+
47+
In case `npm update` malfunctioning or need to update deps to the latest versions, ignored specified versions, you may want to follow an alternative approach below
48+
49+
<details>
50+
<summary>Alternative approach</summary>
51+
52+
- [npm-check-updates](https://www.npmjs.com/package/npm-check-updates) is a handy little library that for historic reasons came into spotlight as a properly working alternative to [everbugging](https://github.com/npm/cli/issues/708) native `npm outdated && npm update`
53+
- [npx](https://docs.npmjs.com/cli/v8/commands/npx) is a part of functionality of `npm` that allows you use npm packages remote, without local installation
54+
55+
1. Open up the project, fetch latest changes, branch out
56+
2. Run `npx npm-check-updates` to get the list of packages that are out of date
57+
58+
Example output
59+
<img width="958" alt="" src="https://user-images.githubusercontent.com/17677196/172212672-9d4c68e3-b488-4b8f-a979-c84c7913a21d.png">
60+
61+
As you may have noticed, `ncu` is colorizing the possible updates into 3 colors: green, cyan and red.
62+
63+
**🟢 Green updates**
64+
65+
All the libraries that are in green can be updated safely without really looking at the changelogs (it only concerns patches updates)... So far, we haven't faced any issue when we were updating green dependencies. So usually, just select all of them and update them together.
66+
67+
**🔵 Cyan updates**
68+
69+
Cyan updates are related to minor updates. So normally, you should be able to update them without any problem but we'd suggest you to do it one by one and by running tests after each update. It'll take time but it'll be safer.
70+
71+
**🔴 Red updates**
72+
73+
Red updates are for major updates. So somehow it means that the version you've specified in the package.json is really permissive. For sure here, you have to update them one by one and have a real look at the changelogs !
74+
75+
3. Run `npx npm-check-updates -u` to update all the versions in your package.json
76+
77+
In this case you'd want to check out changes in `package.json` and revert particular lines which contain major version update.
78+
79+
3. Or make use of `npx npm-check-updates <package1> <package2> <packageN>` command to perform batch categories update
80+
81+
In this case you'd want to specify all the libraries with green updates first
82+
83+
4. Run `npm install` to update the deps
84+
85+
5. Run the project, check if everything is okay
86+
87+
6. If you are done, commit the changes and make a PR, if not, repeat steps 2-5 but with cyan and red updates
88+
89+
</details>
90+
91+
## 🐛 Known issues
92+
93+
Add information if you're having trouble updating any dependencies, this could be very helpful for future updates
94+
<details>
95+
<summary>Example</summary>
96+
97+
### packageName
98+
99+
- **Issue found on:** D Month, YYYY
100+
- **Problematic version:** x.x.x
101+
- **Last stable version:** x.x.x
102+
103+
Space for a free-form description of the problem
104+
105+
</details>

gatsby-config.js

Lines changed: 9 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -40,8 +40,8 @@ module.exports = {
4040
{
4141
resolve: `gatsby-plugin-sass`,
4242
options: {
43-
precision: 8
44-
}
43+
implementation: require("node-sass"),
44+
},
4545
},
4646
{
4747
resolve: `gatsby-source-filesystem`,
@@ -80,22 +80,14 @@ module.exports = {
8080
}
8181
},
8282
{
83-
resolve: `gatsby-plugin-favicon`,
83+
resolve: 'gatsby-plugin-manifest',
8484
options: {
85-
logo: "./src/favicon.png",
86-
injectHTML: true,
87-
icons: {
88-
android: true,
89-
appleIcon: true,
90-
appleStartup: true,
91-
coast: true,
92-
favicons: true,
93-
firefox: true,
94-
twitter: true,
95-
yandex: true,
96-
windows: true
97-
}
98-
}
85+
name: 'ebpf-site',
86+
short_name: 'ebpf',
87+
start_url: '/',
88+
display: 'minimal-ui',
89+
icon: './src/favicon.png',
90+
},
9991
},
10092
{
10193
resolve: `gatsby-plugin-feed`,

0 commit comments

Comments
 (0)