Q4 2021

[ccorda]

Features

• bumping husky to version 7 (#179) (9558618)
• log wp admin users into front-end preview mode (#173) (cd143c4)
• new convenience plugins in wordpress admin (#166) (81e95b8)
• Next 12 upgrade (#180) (c6f5dcd)
• theme mod instead of acf options for preview mode url (#163) (65bf637), closes #162
• wordpress: 📦 Upgrade Wordpress to 5.5.3; upgrade other WP plugins. (0a6d5c9)

Bug Fixes

• bug where prettier wasn't formatting JS files. (c5ce6c5), closes #95
• don't include privacy scaffold, it sometimes forgets to be removed (4722e4a)
• Get stylelint working again (#182) (d3d73ca)
• meta not respecting social variables, customized title (#176) (c041759), closes #174 #172 #177 #183
• vscode eslint plugin wasn't picking up next config without specifying directory (020f378)

Breaking Changes

Next 12

See the Next docs to be aware of all changes in version 12.

The one we’ve run into the most is their change from wrapping next/image with a span from a div. We’ve targeted this element in SCSS files before, and needed to manually update.

Redirects

To make our redirects more DRY (and the logic easier to fix bugs with), we have a new lib/checkRedirects.js file. To use, you’ll need to make slight changes to any ..slug.js files (example).

We’ve also added cache expiration when redirects change. You’ll want to add the custom variables to your functions.php, then you can simply drop in an updated webhooks.php

// webhook config
$headless_webhooks_password_protected = true;
$headless_webhooks_graphcdn_purge_api = 'http://host.docker.internal:3000/api/graphcdn/'; // Docker to host computer endpoint
$headless_webhooks_acf_options = ['acf-options-theme-settings'];
$headless_webhooks_post_types = ['page', 'post'];
$headless_webhooks_redirects_redirection = true;
$headless_webhooks_redirects_yoast = false;

Stylelint Upgrade and VS Code

VS Code made changes that require an updated stylelint. We’ve made these changes, but there is one you’ll need to make to your package.json: cd website && yarn add stylelint-config-standard-scss -D && yarn remove styleint-config-standard

Graphql restructure

We’ve moved lib/wordpress.js to lib/wordpress/index.js, and now import customizable queryContent.js and queryGlobals.js files. This allows us to separate bubs-next scaffolding from per project customizations.

To upgrade, you’ll want to clone the structure from a recent version of bubs-next, and copy your specific graphql the content and global files. If you’ve customized more heavily and written additional custom queries, you’ll need to incorporate those as well.

Husky 7

See the Husky docs for steps on upgrading: https://typicode.github.io/husky/#/?id=migrate-from-v4-to-v7

At a minimum, you’ll want to copy over the .husky folder (a part of our automated instructions), and add this line to scripts: "prepare": "cd .. && husky install website/.husky && chmod ug+x website/.husky/* || true".

You can also remove any legacy husky code, e.g. this block:

"husky": {
    "hooks": {
      "pre-commit": "lint-staged",
      "post-merge": "./.githooks/post-merge.sh"
    }
  },

---

This discussion was created from the release Q4 2021.