I spent the week working on a Pull Request to replace the usage of npm with pnpm in the telescope project.
Of course this is a change that will impact every contributor going forward, so I would like to use this blog post as a guide to get you setup and get comfortable using pnpm.
Why changing?
pnpm is an awesome package manager that is considerably faster than npm and a lot more disk efficient. You can find more information on how it works in their docs.
Here is a test to give you an idea of the difference:
| Package Manager | Install Time | Install Size |
|---|---|---|
| npm | 6m 30s | 1.29G |
| pnpm | 1m 8s | 0.68G |
Using pnpm is also speeding up our GitHub Actions CI! All of the workflows now finish in around 10 minutes compared to an average of 15 minutes using npm.
As you can see, moving to pnpm is a great step forward for our telescope development.
How to get started
To get started make sure you have Node.js with npm installed and then run the command:
npm install -g pnpm
If you have node_modules previously installed by npm, you should delete them. To do so, from the root of the telescope folder, run the following command:
npx npkill
Using npkill, select node_modules with the cursor arrows and press SPACE to delete them one by one. You can then exit by pressing Q.
Make sure to pull the latest changes from upstream:
git pull upstream master
And now you are ready to install all your dependencies with pnpm:
pnpm install
Using pnpm
pnpm is surprisingly easy to use if you know the basics of npm.
You can run tests:
pnpm test
To run scripts, you don't use run like in npm:
pnpm <script-name>
For example, instead of npm run services:start use pnpm services:start.
If you want to add a new dependency, cd into the right path where the package will be added, then use:
pnpm add <pkg-name> # Save to dependencies
pnpm add -D <pkg-name> # Save to devDependencies
For example, to add a dependency to the frontend:
cd src/web then pnpm add <pkg-name>.
This will update package.json and pnpm-lock.yaml (You will need to add both to your commit).
If you need more information on how to use pnpm, the docs are a great resource. I have also updated the telescope Environment Setup to help newcomers getting started.
I am super excited about this change and I hope everyone in the telescope community will love it as well! 😎
Top comments (4)
What was the NPM version in this example?
Don't know the exact version used but definitely > 8.0
Yarn is far more popular and has these advantages. Consider it
Yarn might be similar to pnpm when it comes to speed but it does not have the same disk efficiency. pnpm installs packages in a central location and then creates hard links to reference them.