ci: pin prettier via npm ci, add .nvmrc, format CUSTOMIZE.md

Author: khanhthanhdev

.github/workflows/prettier.yml

@@ -19,16 +19,23 @@ jobs:
         uses: actions/checkout@v4
       - name: Setup Node.js ⚙️
         uses: actions/setup-node@v4
-      - name: Install Prettier 💾
-        run: npm install --save-dev --save-exact prettier @shopify/prettier-plugin-liquid
+        with:
+          node-version-file: .nvmrc
+          cache: npm
+      - name: Install dependencies 💾
+        # Use `npm ci` so the exact versions from package-lock.json are installed,
+        # matching what runs locally via the pre-commit hook.
+        run: npm ci
+      - name: Show Prettier version 🧾
+        run: npx --no-install prettier --version
       - name: Prettier Check 🔎
         id: prettier
-        run: npx prettier . --check
+        run: npx --no-install prettier . --check
       - name: Create diff 📝
         # https://docs.github.com/en/actions/learn-github-actions/expressions#failure
         if: ${{ failure() }}
         run: |
-          npx prettier . --write
+          npx --no-install prettier . --write
           git diff -- . ':(exclude)package-lock.json' ':(exclude)package.json' > diff.txt
           npm install -g diff2html-cli
           diff2html -i file -s side -F diff.html -- diff.txt

.github/workflows/update-tocs.yml

@@ -45,14 +45,26 @@ jobs:
 
       - name: Setup Node.js
         uses: actions/setup-node@v4
+        with:
+          node-version-file: .nvmrc
+          cache: npm
+
+      - name: Install dependencies
+        if: steps.changed-files.outputs.any_changed == 'true'
+        # Use `npm ci` so the exact prettier version from package-lock.json is
+        # installed, matching what runs locally via the pre-commit hook.
+        # Otherwise differing prettier versions can produce different output,
+        # causing local pre-commit and this workflow to overwrite each other
+        # in a push/auto-commit loop.
+        run: npm ci
 
       - name: Run Prettier on changed files
         if: steps.changed-files.outputs.any_changed == 'true'
         run: |
-          npm install --save-dev --save-exact prettier @shopify/prettier-plugin-liquid
+          npx --no-install prettier --version
           for file in ${ALL_CHANGED_FILES}; do
             if [[ "$file" == *.md ]]; then
-              npx prettier --write "$file"
+              npx --no-install prettier --write "$file"
             fi
           done
 

.nvmrc

@@ -0,0 +1 @@
+22

.pre-commit-config.yaml

@@ -41,7 +41,10 @@ repos:
     hooks:
       - id: prettier
         name: prettier
-        entry: npx prettier --write
+        # `--no-install` forces npx to use the local prettier from node_modules
+        # (pinned in package.json / package-lock.json) instead of silently
+        # downloading a different version. Run `npm ci` if this errors out.
+        entry: npx --no-install prettier --write
         language: system
         files: \.(js|jsx|ts|tsx|css|scss|md|mdx|html|liquid|json|yml|yaml)$
         exclude: |
@@ -59,7 +62,7 @@ repos:
       # Full repo check on push (matches CI: npx prettier . --check)
       - id: prettier-check-all
         name: prettier-check-all
-        entry: npx prettier . --check
+        entry: npx --no-install prettier . --check
         language: system
         pass_filenames: false
         always_run: true

CUSTOMIZE.md

@@ -62,7 +62,7 @@ Here we will give you some tips on how to customize the website. One important t
     - [How it works](#how-it-works)
     - [Configuration](#configuration-1)
     - [Disable related posts for a specific post](#disable-related-posts-for-a-specific-post)
-    - [Additional configuration in _config.yml](#additional-configuration-in-_configyml)
+    - [Additional configuration in \_config.yml](#additional-configuration-in-_configyml)
   - [Managing publication display](#managing-publication-display)
   - [Adding a Google Calendar](#adding-a-google-calendar)
     - [Basic usage](#basic-usage)