A crazy-simple way to bulk-update NPM dependencies with GitHub's Dependabot
Tags: github, npm, devops, dependabot
Published: 2023-08-15 18:00:37

This is the simplest way I've found to keep your NPM dependencies up-to-date. This will update all dependencies and devDependencies via automatically-generated pull requests AND you don't have to push files or leave the GitHub.com website. This works for monorepos too!

## tl;dr

1. Go to _your repo_ -> _Insights_ -> _Dependency graph_ -> _Dependabot_ -> _Enable Dependabot_
2. Create a config file and add a group to it
3. Copy your GitHub Action secrets to Dependabot secrets

## Prerequisites 

* Your repo's dependencies managed by NPM
* Write permissions to your repository
* No fear of beta-features

## What is this?

I was stumped on how to enable Dependabot in Github after reading lots of docs and blogs about adding Dependabot to a repo. Each article detailed how to create the dependabot.yml file and the breakdown of it's data structure, but not the basics of _turning it on_. Then, I stumbled across the `Enable Dependabot` button. 🤦 So I figured I'd help someone else save some time.

The ability to create a single pull request containing _all_ dependency updates is made possible by GitHub's newly implemented [_grouped version updates_](https://github.blog/changelog/2023-06-30-grouped-version-updates-for-dependabot-public-beta/), which is a beta feature as of this writing. Normally Dependabot creates one PR for _each_ dependency being updated.

### Expected outcome:

* Once-daily, Dependabot will check your repo's dependencies to see if newer versions exist
* If new versions exist, Dependabot will create a pull request, updating _every_ dependency which has a new version
* The pull request will change relevant `package.json` and `package-lock.json` files
* If you use GitHub actions, Dependabot's PR will run the same checks as other PRs

**Note**: Dependabot does a whole lot of other stuff and these instructions are _specifically_ for the task of having Dependabot create one pull request whenever it finds one or more dependencies in your **NPM** repo which have an newer version.

## Step 1: Enable Dependabot

![Shows GitHub UI with circles around where-to-click to enable Dependabot](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/vkxduhw4c5bj6w5mn5he.png)

Navigate to your repository on GitHub.com and then...

1. Trigger "Insights" link in the repo navigation
1. Trigger "Dependency graph" in the page menu
1. Trigger "Dependabot" in the _Dependency graph_ page's tabs
1. Trigger the "Enable Dependabot" button

## Step 2: Create dependabot.yml config file

![Shows the UI after enabling Dependabot, highlights the "create config file" button](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/4wrz6q3heksybog1ymid.png)

The next page kinda looks the same as the last one! But now the "Enable Dependabot" button is replaced with a "Create config file" button

1. Trigger the "Create config file" button

## Step 3: Edit the dependabot.yml file

Triggering "Create config file" brings you to the GitHub file editing interface. You will be adding the file at `<repo-root>/.github/dependabot.yml`. Setting up bulk management of your NPM dependencies requires three changes to the default dependabot.yml file, changing the `package-ecosystem`, the `interval`, and adding the `group`

**Default content of the dependabot.yml file**

```yaml
# To get started with Dependabot version updates, you'll need to specify which
# package ecosystems to update and where the package manifests are located.
# Please see the documentation for all configuration options:
# https://docs.github.com/github/administering-a-repository/configuration-options-for-dependency-updates

version: 2
updates:
  - package-ecosystem: "" # See documentation for possible values
    directory: "/" # Location of package manifests
    schedule:
      interval: "weekly"
```

### Step 3.A Change the ecosystem to `npm`

```yaml
updates:
  - package-ecosystem: "npm"
```

### Step 3.B Change the interval to "daily"

```yaml
    schedule:
      interval: "daily"
```

### Step 3.C Add the `groups` content

The [`groups` configuration documentation is here](https://docs.github.com/en/code-security/dependabot/dependabot-version-updates/configuration-options-for-the-dependabot.yml-file#groups). The StoryDocker repo has examples of [a groups-enabled dependabot.yml file](https://github.com/storydocker/storydocker/blob/main/.github/dependabot.yml) and [a Dependabot-created PR](https://github.com/storydocker/storydocker/pull/15)

* add `groups` right after the `interval` section from above
* the group name is `dev-dependencies`, but the naming is flexible
* the group name is used to create the PR title ("_⬆️ Bump the `dev-dependencies` group with 32 updates_" and the PR's branch from the Dependabot fork (_dependabot/npm_and_yarn/`dev-dependencies`-b6aa4603c8_)
* this example uses a `wildcard` pattern so it will update all dependencies, but it's possible to narrow it to a subset of your deps

```yaml
    schedule:
      interval: "daily"
    # Create a group of dependencies to be updated together
    # in one pull request
    groups:
       # Specify a name for the group, which will be used 
       # in pull request titles and branch names
       dev-dependencies:
        # Define patterns to include dependencies in the group 
        patterns: 
          # Wildcard matches all dependencies 
          # across the package ecosystem.
          - "*"
```

### The final file's contents

```yaml
# (adjust comment to your liking)

version: 2
updates:
  - package-ecosystem: "npm"
    directory: "/"
    schedule:
      interval: "daily"
    groups:
      dev-dependencies:
        patterns: 
          - "*"
```

## Step 4 - Copypasta your secrets to allow actions

**Fun fact:** Dependabot does not have access to any secrets you created for GitHub Actions.

The StoryDocker repo has a [GitHub action which releases a PR-based deployment to Chromatic](https://github.com/storydocker/storydocker/blob/main/.github/workflows/chromatic.yml) and that action requires a secret named `CHROMATIC_PROJECT_TOKEN`. This token is already configured at Settings -> Secrets and Variables -> Actions. To make this action work when Dependabot adds a PR from a fork of the repo, _you need to have a **duplicate token** in the secrets for Dependabot_.


![Shows the navigation triggers to get to Dependabot secrets settings](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/t29pqxx0u6mz5ribm2vo.png)


1. Trigger "Settings" tab in repo navigation
1. Trigger "Secrets and variables" in the _Settings_ page nav
1. Trigger "Dependabot" nav item to get the Dependabot's secrets page
1. Trigger "New repository secret" button to add a secret
1. Add your secret there, using **the same secret name you used for the Actions secret**

## Step 5 - Read and merge PRs

There are ways to automate merging the PRs created by Dependabot, but I have trust issues, so I prefer to review the PRs and merge them myself. 

## Step 6 - PROFIT

Dependency management just got a whole lot easier. Go outside and touch grass!