feat!: update packages and sass compilation (#46)

* chore: update package dependencies

* fix: replace deprecated jQuery ready function

* fix: output home URL on 404 page

* doc: improve readability

* feat(sass): replace dart-sass with sass-embedded

* feat(sass): replace Sass with CSS variables

* feat: update to WP6.7

* style: align consistency

* fix: roll back aggressive escaping in 4b6fec7

* chore: update linting rules

* fix: read version from package.json using import

* build: replace imagemin with sharp

* build: remove obsolete includePaths

* fix: enable commitlint with husky v9

* chore: update package dependencies

BREAKING CHANGE: reorganise CSS structures to conform to future changes

Author: kchan825

.eslintrc.json

@@ -1,6 +1,7 @@
 {
   "env": {
     "browser": true,
+    "es6": true,
     "jquery": true
   },
   "globals": {
@@ -15,7 +16,7 @@
     "google"
   ],
   "rules": {
-    "require-jsdoc": "off"
+    "require-jsdoc": "off" // TODO: to be removed once WP is compatible with ESLint v9
   },
   "overrides": [
     {

.husky/commit-msg

@@ -1,4 +1 @@
-#!/bin/sh
-. "$(dirname "$0")/_/husky.sh"
-
-npx --no-install commitlint --edit
+npx --no-install commitlint --edit "$1"

.stylelintrc.json

@@ -6,16 +6,8 @@
   "rules": {
     "at-rule-empty-line-before": null,
     "custom-property-pattern": null,
-    "declaration-block-no-redundant-longhand-properties": [
-      true,
-      {
-        "ignoreShorthands": ["grid-template"]
-      }
-    ],
     "max-nesting-depth": 4,
     "no-descending-specificity": null,
-    "no-invalid-position-at-import-rule": null,
-    "selector-class-pattern": null,
     "selector-max-compound-selectors": 4,
     "selector-no-qualifying-type": [
       true,
@@ -24,12 +16,6 @@
         "severity": "warning"
       }
     ],
-    "scss/at-extend-no-missing-placeholder": [
-      true,
-      {
-        "severity": "warning"
-      }
-    ],
     "scss/comment-no-empty": null,
     "scss/dollar-variable-empty-line-before": null,
     "scss/double-slash-comment-empty-line-before": null,
@@ -52,9 +38,10 @@
         "declaration-property-value-disallowed-list": null,
         "max-nesting-depth": null,
         "rule-empty-line-before": null,
+        "selector-class-pattern": null,
         "selector-max-id": null,
-        "selector-not-notation": null,
         "selector-no-qualifying-type": null,
+        "selector-not-notation": null,
         "scss/dollar-variable-pattern": null
       }
     }

README.mdown

@@ -9,14 +9,14 @@ To run this workflow, you should have the below installed globally. If you are o
 * [npm](https://docs.npmjs.com/getting-started/installing-node)
 * [gulp-cli](https://github.com/gulpjs/gulp-cli)
 
-The package comes with linter files to maintain code style and you are encouraged to have the below linters installed.
+The package comes with linter files to maintain code style and you are encouraged to have the below linters installed in your code editor.
 
 * [ESLint](https://eslint.org/)
 * [Style Lint](https://stylelint.io/)
 
 ## Setup
 
-1. Set up a local WordPress instance. [Local by Flywheel](https://localbyflywheel.com/) could be helpful.
+1. Set up a local WordPress instance. [Local](https://localwp.com/) could be helpful.
 2. Make necessary changes to composer.json and gulpconfig.js.
 3. If this is a fresh set-up, run `npm run setup` in the terminal to get the dev dependencies and WordPress ready; otherwise run `npm install && npm audit fix && gulp build && composer install`.
 4. Set up config credentials for different environments if necessary.

composer.json

@@ -25,11 +25,11 @@
   },
   "require": {
     "wpackagist-plugin/duplicate-post": "^4.5",
-    "wpackagist-plugin/favicon-by-realfavicongenerator": "^1.3.30",
-    "wpackagist-plugin/imagify": "^2.2.2",
-    "wpackagist-plugin/imsanity": "^2.8.4",
+    "wpackagist-plugin/favicon-by-realfavicongenerator": "^1.3.37",
+    "wpackagist-plugin/imagify": "^2.2.5",
+    "wpackagist-plugin/imsanity": "^2.8.6",
     "wpackagist-plugin/svg-support": "^2.5.8",
-    "wpackagist-plugin/wordpress-seo": "^23.2",
+    "wpackagist-plugin/wordpress-seo": "^23.9",
     "wpackagist-plugin/wp-sweep": "^1.1.8"
   }
 }

composer.lock

@@ -4,7 +4,7 @@ const dist = './app/public';
 
 export default {
   assets: {
-    src: src + '/assets/**',
+    src: src + '/assets/**/*',
     dest: dist + '/wp-content/themes/' + project + '/assets',
     blocksSrc: src + '/blocks/**/*.+(gif|jpg|png|svg)',
     blocksDest: dist + '/wp-content/plugins/client-blocks/assets',