Try @wordpress/scripts

private/.stylelintrc.json

@@ -1,15 +1,20 @@
 {
   "extends": "stylelint-config-recommended-scss",
-  "plugins": [
-    "stylelint-scss"
-  ],
+  "plugins": ["stylelint-scss"],
   "rules": {
     "at-rule-no-vendor-prefix": true,
-    "at-rule-empty-line-before": [ "always", {
-      "except": ["blockless-after-blockless", "blockless-after-same-name-blockless", "first-nested"],
-      "ignore": ["after-comment"],
-      "ignoreAtRules": ["else", "else if"]
-    } ],
+    "at-rule-empty-line-before": [
+      "always",
+      {
+        "except": [
+          "blockless-after-blockless",
+          "blockless-after-same-name-blockless",
+          "first-nested"
+        ],
+        "ignore": ["after-comment"],
+        "ignoreAtRules": ["else", "else if"]
+      }
+    ],
     "block-no-empty": true,
     "color-hex-length": "short",
     "color-named": "never",
@@ -26,13 +31,19 @@
     "length-zero-no-unit": true,
     "no-descending-specificity": null,
     "no-duplicate-selectors": true,
-    "property-no-vendor-prefix": [true, {
-      "ignoreProperties": ["appearance", "text-size-adjust"]
-    }],
-    "rule-empty-line-before": ["always", {
-      "except": ["after-single-line-comment", "first-nested"],
-      "ignore": ["after-comment"]
-    }],
+    "property-no-vendor-prefix": [
+      true,
+      {
+        "ignoreProperties": ["appearance", "text-size-adjust"]
+      }
+    ],
+    "rule-empty-line-before": [
+      "always",
+      {
+        "except": ["after-single-line-comment", "first-nested"],
+        "ignore": ["after-comment"]
+      }
+    ],
     "scss/at-else-closing-brace-newline-after": "always-last-in-chain",
     "scss/at-else-closing-brace-space-after": "always-intermediate",
     "scss/at-else-empty-line-before": "never",
@@ -41,12 +52,18 @@
     "scss/no-global-function-names": null,
     "selector-attribute-quotes": "always",
     "selector-max-id": 0,
-    "selector-no-qualifying-type": [true, {
-      "ignore": ["attribute", "class"]
-    }],
-    "selector-pseudo-class-no-unknown": [true, {
-      "ignorePseudoClasses": ["enter"]
-    }],
+    "selector-no-qualifying-type": [
+      true,
+      {
+        "ignore": ["attribute", "class"]
+      }
+    ],
+    "selector-pseudo-class-no-unknown": [
+      true,
+      {
+        "ignorePseudoClasses": ["enter"]
+      }
+    ],
     "selector-pseudo-element-colon-notation": "double",
     "value-no-vendor-prefix": true
   }

private/package.json

@@ -6,67 +6,35 @@
   "license": "GPL-2.0-or-later",
   "packageManager": "yarn@4.3.1",
   "scripts": {
-    "build:dev": "webpack --mode development",
-    "build:prod": "webpack --mode production",
-    "build:static": "webpack --mode production --env static",
-    "build": "webpack --mode production",
-    "watch:dev": "webpack --mode development --watch",
-    "watch:prod": "webpack --mode production --watch",
-    "watch": "webpack --mode development --watch",
-    "lint:scripts": "eslint ./src/",
-    "lint:styles": "stylelint \"src/**/*.scss\"",
-    "lint": "yarn lint:scripts; yarn lint:styles",
+    "build": "wp-scripts build",
+    "format": "wp-scripts format",
+    "lint:css": "wp-scripts lint-style",
+    "lint:js": "wp-scripts lint-js",
+    "lint": "yarn lint:css && yarn lint:js",
+    "start": "wp-scripts start",
+    "watch": "yarn start",
     "env": "yarn dlx @wordpress/env"
   },
   "devDependencies": {
-    "@babel/cli": "^7.16.0",
-    "@babel/core": "^7.16.0",
     "@babel/eslint-parser": "^7.16.3",
     "@babel/plugin-proposal-pipeline-operator": "^7.16.0",
-    "@babel/plugin-transform-class-properties": "^7.23.3",
-    "@babel/plugin-transform-optional-chaining": "^7.23.4",
-    "@babel/preset-env": "^7.16.8",
-    "@babel/preset-react": "^7.16.7",
-    "@wordpress/eslint-plugin": "^17.4.0",
-    "@wordpress/i18n": "^4.2.4",
+    "@wordpress/i18n": "^5.5.0",
+    "@wordpress/scripts": "^28.5.0",
     "autoprefixer": "^10.4.0",
-    "babel-loader": "^9.1.0",
     "copy-webpack-plugin": "^11.0.0",
-    "css-loader": "^6.8.1",
-    "esbuild-loader": "^4.0.2",
-    "eslint": "^8.3.0",
     "eslint-config-airbnb-base": "^15.0.0",
     "eslint-config-prettier": "^9.1.0",
     "eslint-plugin-import": "^2.25.3",
     "eslint-plugin-prettier": "^5.0.1",
     "eslint-plugin-react": "^7.28.0",
     "eslint-plugin-react-hooks": "^4.3.0",
-    "eslint-webpack-plugin": "^4.0.1",
-    "expose-loader": "^4.0.0",
-    "file-loader": "^6.2.0",
-    "mini-css-extract-plugin": "^2.4.5",
-    "node-normalize-scss": "^8.1.2",
-    "postcss": "^8.4.32",
-    "postcss-banner": "^4.0.1",
-    "postcss-loader": "^7.0.1",
-    "postcss-pxtorem": "^6.0.0",
-    "postcss-reporter": "^7.0.4",
-    "postcss-scss": "^4.0.3",
-    "prettier": "^3.1.0",
-    "react": "^18",
-    "react-dom": "^18",
-    "resolve-url-loader": "^5.0.0",
+    "expose-loader": "^5.0.0",
+    "mini-css-extract-plugin": "^2.9.0",
+    "postcss-pxtorem": "^6.1.0",
+    "postcss-reporter": "^7.1.0",
     "sass": "^1.62.1",
     "sass-loader": "^13.2.2",
-    "sass-mq": "^6.0.0",
-    "style-loader": "^3.3.1",
-    "stylelint": "^15.11.0",
-    "stylelint-config-recommended-scss": "^13.1.0",
-    "stylelint-scss": "^5.3.1",
-    "stylelint-webpack-plugin": "^4.1.1",
-    "typescript": "^5.3.2",
-    "webpack": "^5.76.0",
-    "webpack-cli": "^5.0.0"
+    "sass-mq": "^6.0.0"
   },
   "dependencies": {
     "@braintree/sanitize-url": "^7.0.1",

private/src/scripts/editor/blocks/post-list/components/DisplayAuthor.jsx

@@ -114,7 +114,8 @@ class DisplayAuthor extends Component {
 
     api
       .getPostsFromAuthors(requestArguments, value)
-      .then((data = [], i, xhr) => { // eslint-disable-line
+      .then((data = [], i, xhr) => {
+        // eslint-disable-line
         const posts = data.map((p) => {
           if (!p.featured_media || p.featured_media < 1) {
             return {

private/src/scripts/editor/blocks/post-list/components/DisplaySelect.jsx

@@ -181,7 +181,8 @@ class DisplaySelect extends Component {
 
     return api
       .getPosts(requestArguments, this.state.taxonomy, this.state.term)
-      .then((data = [], i, xhr) => { // eslint-disable-line
+      .then((data = [], i, xhr) => {
+        // eslint-disable-line
         const posts = data.map((p) => {
           if (!p.featured_media || p.featured_media < 1) {
             return {

private/src/scripts/modules/navigation.js

@@ -6,33 +6,35 @@ let subMenus = [];
 // if menu has lost focus inadvertently, restore it
 const setupFocusTrap = () => {
   const lastMenuItem = pageHeader.querySelector('.mobile-menu > ul > li:last-of-type');
-  const menuItemClassList = `.${Array.from(lastMenuItem.classList).join('.')}`;
-  let previousFocus;
+  if (lastMenuItem) {
+    const menuItemClassList = `.${Array.from(lastMenuItem.classList).join('.')}`;
+    let previousFocus;
 
-  mobileMenu.addEventListener('focusout', (event) => {
-    previousFocus = event.target;
-  });
+    mobileMenu.addEventListener('focusout', (event) => {
+      previousFocus = event.target;
+    });
 
-  document.addEventListener('focusin', (event) => {
-    const closestMenuItemToPrevious = previousFocus?.closest(menuItemClassList);
-    const originWasLastItem = previousFocus === lastMenuItem.firstElementChild;
-    const originWasChildOfLastItem = closestMenuItemToPrevious === lastMenuItem;
+    document.addEventListener('focusin', (event) => {
+      const closestMenuItemToPrevious = previousFocus?.closest(menuItemClassList);
+      const originWasLastItem = previousFocus === lastMenuItem.firstElementChild;
+      const originWasChildOfLastItem = closestMenuItemToPrevious === lastMenuItem;
 
-    // previous element wasn't in the mobile nav, or wasn't the last item in it
-    if (!originWasLastItem && !originWasChildOfLastItem) {
-      return;
-    }
+      // previous element wasn't in the mobile nav, or wasn't the last item in it
+      if (!originWasLastItem && !originWasChildOfLastItem) {
+        return;
+      }
 
-    // focus is still within the mobile nav
-    if (event.target.closest('.mobile-menu')) {
-      return;
-    }
+      // focus is still within the mobile nav
+      if (event.target.closest('.mobile-menu')) {
+        return;
+      }
 
-    event.preventDefault();
+      event.preventDefault();
 
-    previousFocus = undefined;
-    menuToggle.focus();
-  });
+      previousFocus = undefined;
+      menuToggle.focus();
+    });
+  }
 };
 
 // close all sub menus