Handling a "generate" error in GitHub Actions

For websites managed by KurocoFront, a generate error can in turn trigger a 404 error. This tutorial shows you how to abort the build when an error occurs during the generate process. You will also learn how to set up Slack notifications for this system abort event.

Prerequisites

This tutorial assumes that you are managing your site using the following frameworks:

  • Nuxt.js
  • KurocoFront

Aborting the build if an error occurs during nuxt generate

Modify package.json

Add the --fail-on-error option to the nuxt generate command in package.json as follows:

package.json
{
  ...,
  "scripts": {
    ...
    "build": "cross-env NODE_ENV=development nuxt build",
    "generate": "cross-env NODE_ENV=development nuxt generate –fail-on-error",
    "build-prod": "cross-env NODE_ENV=production nuxt build",
    "generate-prod": "cross-env NODE_ENV=production nuxt generate –fail-on-error",
    ...
  },
  ...
}

This allows the system to abort the build method if an error occurs during nuxt generate.

–fail-on-error is only available in Nuxt v2.14.4 and later. Refer to the official NuxtJS documentation for more details.

Setting up Slack notifications for build failures

At this point, you would have to access GitHub Actions manually to verify the build status and look for any errors. To save yourself some time and trouble, you can set up automated Slack notifications for build failures.

Add Incoming Webhooks to your Slack channel

Go to https://[WORK-SPACE-ID].slack.com/apps.

Substitute [WORK-SPACE-ID] in the above URL with your own Slack workspace ID.

fetched from Gyazo

Search for "Incoming Webhooks".

fetched from Gyazo

Click [Add to Slack].

fetched from Gyazo

Select the channel you want to add them to.

fetched from Gyazo

Click the [Add Incoming Webhooks integration] button.

fetched from Gyazo

You have successfully added Incoming Webhooks to your Slack channel.

fetched from Gyazo

Copy the Webhook URL for later use.

fetched from Gyazo

Add the Webhook URL to the GitHub Actions secrets

Next, configure your GitHub settings. In the corresponding GitHub repository, click [Settings] -> [Secrets] to access the Actions secrets screen.

Image from Gyazo

Click [New repository secret].

Image from Gyazo

Enter the following details and click [Add secret].

ItemValue
NameSLACK_WEBHOOK_URL
ValueThe Webhook URL you copied

Image from Gyazo

The new entry will appear under "Repository secrets".

Image from Gyazo

Modify the YAML file in .github/workflows

Lastly, add the Slack notification settings to the YAML file in the .github/workflows directory. Enter the settings below in the pullreq_build and pushed_build steps of the YAML file.

      - name: Slack Notification on Failure
        uses: rtCamp/action-slack-notify@master
        if: failure()
        env:
          SLACK_CHANNEL: kuroco_channel
          SLACK_WEBHOOK: ${{ secrets.SLACK_WEBHOOK_URL }}
          SLACK_TITLE: build error
          SLACK_MESSAGE: 'https://example.g.kuroco.app/'
          SLACK_COLOR: danger

Modify the items below according to your environment:

ItemValue
SLACK_CHANNELName of the channel that will be notified.
SLACK_MESSAGEContent of notification message.

This tutorial uses rtCamp/action-slack-notify for the Slack notification.

Add to 'pullreq_build'

Paste the above code into the pullreq_build step.

Image from Gyazo

Add to 'pushed_build'

Similarly, paste the same code into the pushed_build step.

Image from Gyazo

The settings are now complete. You will receive a Slack notification every time an error occurs during the generate process.

Image from Gyazo

If you have any other questions, please use our contact form or Slack workspace.