Cleaning Up Space on Development Machine

How to prune unused Docker images, delete large node_modules, and clean old Cypress binaries

If you run out of space on your development machine, you probably have old Docker images sitting around, a giant number of node_modules and maybe a number of old versions of Cypress test runner that you don't need anymore. Let's clean everything up.

Pruning Docker

Let's prune Docker images first. You can see how many images you have locally and how much space each takes with

1
$ docker images

We can remove all image not currently used that were created more than 24 hours ago:

1
2
3
4
5
6
7
8
9
10
$ docker image prune -a --filter "until=24h"
WARNING! This will remove all images without at least one container associated to them.
Are you sure you want to continue? [y/N] y

Deleted Images:
untagged: node:12.4.0
...
...
...
Total reclaimed space: 31.17GB

Next you want to look at the stopped Docker containers - they are NOT deleted by default.

1
$ docker ps -a

Remove them

1
2
3
4
5
$ docker container prune
WARNING! This will remove all stopped containers.
Are you sure you want to continue? [y/N] y
...
Total reclaimed space: 8.155GB

Cleaning node_modules

NPM node modules are like a black hole - they weigh a lot and nothing escapes. You can quickly see how much they take on your disk using npkill utility.

1
2
3
4
$ npm i -g npkill
# run npkill from the root folder or from the folder with
# projects that have node_modules
$ npkill

Remove old folders

You can list the folders by the last access time with:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
$ ls -ltu
total 696
-rw-r--r-- 1 gleb staff 344501 Apr 9 11:02 the-dark-knight.css
drwxr-xr-x 39 gleb staff 1248 Apr 9 11:02 webamp
drwxr-xr-x 22 gleb staff 704 Apr 9 11:02 circleci-orb
drwxr-xr-x 41 gleb staff 1312 Apr 9 11:02 cypress-services
drwxr-xr-x 11 gleb staff 352 Apr 9 11:02 try-percy-agent-as-npm-module
drwxr-xr-x 15 gleb staff 480 Apr 9 11:02 test-react-router-v5
drwxr-xr-x 14 gleb staff 448 Apr 9 11:02 hasura-example
drwxr-xr-x 19 gleb staff 608 Apr 9 11:02 cypress-vue-unit-test
...
drwxr-xr-x 18 gleb staff 576 Mar 26 2019 cypress-angular-unit-test
drwxr-xr-x 2 gleb staff 64 Mar 26 2019 cypress-blog-tests
drwxr-xr-x 6 gleb staff 192 Mar 26 2019 cypress-colors
drwxr-xr-x 18 gleb staff 576 Mar 26 2019 cypress-core-marta
drwxr-xr-x 12 gleb staff 384 Mar 26 2019 cypress-credentials
drwxr-xr-x 11 gleb staff 352 Mar 26 2019 cypress-dark-example

You can probably delete the last folders - since you only accessed them a very long time ago.

Folder size

On Mac I really enjoy using du utility. For example, you can see the total folder size or top level plus first sublevel

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
# print just the total "github-action" folder size in human format (Megabytes)
$ du -h -d 0 github-action
459M github-action

# print the total size of the folder "github-action"
# and sizes of its immediate subfolders
$ du -h -d 1 github-action
1.4M github-action/dist
228K github-action/images
60M github-action/node_modules
377M github-action/examples
40K github-action/.github
21M github-action/.git
4.0K github-action/.vscode
459M github-action

Mac users tip

In Finder you can select and permanently delete files (without going through the Trash app) using Option + Command + Delete combination.

From the terminal I recommend using trash-cli that is safer to use than rm. trash-cli moves files to Trash so they can be restored.

Cleaning old Cypress binaries

Every time you install Cypress with npm install cypress it downloads NPM package cypress and stores it in the local node_modules folder. Then this NPM package runs its post-install script which checks if you need to download version x.y.z of the Cypress Electron-built binary. These binaries are stored in a central place on your machine to avoid re-downloading the same binary version again and again.

You can see where the binaries are stored:

1
2
3
~/git/cypress-example-todomvc-redux on master
$ npx cypress cache path
/Users/gleb/Library/Caches/Cypress

And the cached versions

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
$ npx cypress cache list
┌─────────┬──────────────┐
│ version │ last used │
├─────────┼──────────────┤
│ 3.0.1 │ 2 months ago │
├─────────┼──────────────┤
│ 3.0.2 │ 6 months ago │
├─────────┼──────────────┤
│ 3.0.3 │ 2 years ago │
├─────────┼──────────────┤
│ 3.2.0 │ 3 months ago │
├─────────┼──────────────┤
│ 3.4.0 │ 6 months ago │
├─────────┼──────────────┤
│ 3.4.1 │ 13 days ago │
├─────────┼──────────────┤
│ 3.5.0 │ 5 months ago │
├─────────┼──────────────┤
...
├─────────┼──────────────┤
│ 4.2.1 │ 10 days ago │
├─────────┼──────────────┤
│ 4.3.0 │ 4 days ago │
└─────────┴──────────────┘

Unfortunately, Cypress NPM modules does not have cypress cache prune command yet, so you would need to delete the old folders manually. Let's see the folders - they are all named /path/to/cache/x.y.z.

1
2
3
4
5
6
7
8
9
10
$ ls -ltu /Users/gleb/Library/Caches/Cypress
total 0
drwxr-xr-x 4 gleb staff 128 Apr 9 10:46 4.2.1
drwxr-xr-x 5 gleb staff 160 Apr 6 19:23 3.8.2
drwxr-xr-x 4 gleb staff 128 Mar 31 14:26 4.3.0
drwxr-xr-x 4 gleb staff 128 Mar 16 17:07 4.2.0
...
drwxr-xr-x 3 gleb staff 96 Mar 15 2019 3.2.0
drwxr-xr-x 3 gleb staff 96 Jul 9 2018 3.0.2
drwxr-xr-x 3 gleb staff 96 Jun 3 2018 3.0.1

Each folder is quite large - unzipped Cypress is big!

1
2
$ du -h -d 0 /Users/gleb/Library/Caches/Cypress/4.0.0
546M /Users/gleb/Library/Caches/Cypress/4.0.0

Let's remove all cached Cypress v3 versions - that should free up some space!

1
$ rm -rf /Users/gleb/Library/Caches/Cypress/3*

Much better.

Tip: if you need to re-install a Cypress binary version you have just deleted, run this command from the project that installed it:

1
$ npx cypress install