doc: Update README.md

Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com>

.github/FUNDING.yml

@@ -0,0 +1,3 @@
+ko_fi: jaywcjlove
+buy_me_a_coffee: jaywcjlove
+custom: ["https://www.paypal.me/kennyiseeyou", "https://jaywcjlove.github.io/#/sponsor"]

.github/workflows/ci.yml

@@ -6,17 +6,18 @@ on:
 
 jobs:
   build:
-    runs-on: ubuntu-22.04
+    runs-on: ubuntu-latest
     steps:
-      - uses: actions/checkout@v3
+      - uses: actions/checkout@v4
-      - uses: actions/setup-node@v3
+      - uses: actions/setup-node@v4
         with:
-          node-version: 16
+          node-version: 20
+          registry-url: 'https://registry.npmjs.org'
 
       - run: npm install
       - run: npm run build
       - run: npm run doc
-      - uses: actions/upload-artifact@v3
+      - uses: actions/upload-artifact@v4
         with:
           name: webiste
           path: |
@@ -40,7 +41,7 @@ jobs:
         uses: jaywcjlove/changelog-generator@main
 
       - name: Deploy
-        uses: peaceiris/actions-gh-pages@v3
+        uses: peaceiris/actions-gh-pages@v4
         with:
           commit_message: ${{ github.event.head_commit.message }} ${{steps.tag_version.outputs.tag}} 
           github_token: ${{ secrets.GITHUB_TOKEN }}
@@ -66,8 +67,8 @@ jobs:
     runs-on: ubuntu-latest
     needs: [build]
     steps:
-      - uses: actions/checkout@v3
+      - uses: actions/checkout@v4
-      - uses: actions/download-artifact@v3
+      - uses: actions/download-artifact@v4
         with:
           name: webiste
           path: website/build
@@ -77,54 +78,62 @@ jobs:
       - run: echo "outputs.create_tag_versionNumber - ${{ needs.build.outputs.create_tag_versionNumber }}"
       - run: echo "outputs.tag - ${{ needs.build.outputs.tag }}"
 
+      - name: Set up Docker Buildx
+        uses: docker/setup-buildx-action@v3
+          
       # Create Docker Image
       - name: Docker login
         run: docker login -u ${{ secrets.DOCKER_USER }} -p ${{ secrets.DOCKER_PASSWORD }}
 
-      - name: Build wxmp image
+      # - name: Build wxmp image
+      #   working-directory: website
+      #   run: docker image build -t wxmp .
+
+      - name: Build and push multi-platform image
         working-directory: website
-        run: docker image build -t wxmp .
-
-      - name: Tags & Push image (latest)
         run: |
-          echo "outputs.tag - ${{ needs.build.outputs.version }}"
+          docker buildx build \
-          docker tag wxmp ${{ secrets.DOCKER_USER }}/wxmp:latest
+            --platform linux/amd64,linux/arm64 \
-          docker push ${{ secrets.DOCKER_USER }}/wxmp:latest
+            -t ${{ secrets.DOCKER_USER }}/wxmp:latest \
+            --push .
+        
 
-      - name: Tags & Push image
+      - name: Build and push multi-platform image (with tag)
         if: needs.build.outputs.successful
-        run: |
-          echo "outputs.tag - ${{ needs.build.outputs.version }}"
-          docker tag wxmp ${{ secrets.DOCKER_USER }}/wxmp:${{needs.build.outputs.version}}
-          docker push ${{ secrets.DOCKER_USER }}/wxmp:${{needs.build.outputs.version}}
-
-      # Create Docker Image in GitHub
-      - name: Login to GitHub registry
-        run: echo ${{ github.token }} | docker login ghcr.io -u ${{ github.actor }} --password-stdin
-
-      - name: Build docker image
         working-directory: website
-        run: docker build -t ghcr.io/jaywcjlove/wxmp:latest .
-
-      - name: Publish to GitHub registry
-        run: docker push ghcr.io/jaywcjlove/wxmp:latest
-
-      - name: Tag docker image (beta) and publish to GitHub registry
-        if: needs.build.outputs.successful
         run: |
-            echo "version: v${{ needs.build.outputs.version }}"
+          docker buildx build \
-            docker tag ghcr.io/jaywcjlove/wxmp:latest ghcr.io/jaywcjlove/wxmp:${{needs.build.outputs.version}}
+            --platform linux/amd64,linux/arm64 \
-            docker push ghcr.io/jaywcjlove/wxmp:${{needs.build.outputs.version}}
+            -t ${{ secrets.DOCKER_USER }}/wxmp:${{ needs.build.outputs.version }} \
+            --push .
+
+      # # Create Docker Image in GitHub
+      # - name: Login to GitHub registry
+      #   run: echo ${{ github.token }} | docker login ghcr.io -u ${{ github.actor }} --password-stdin
+
+      # - name: Build docker image
+      #   working-directory: website
+      #   run: docker build -t ghcr.io/jaywcjlove/wxmp:latest .
+
+      # - name: Publish to GitHub registry
+      #   run: docker push ghcr.io/jaywcjlove/wxmp:latest
+
+      # - name: Tag docker image (beta) and publish to GitHub registry
+      #   if: needs.build.outputs.successful
+      #   run: |
+      #       echo "version: v${{ needs.build.outputs.version }}"
+      #       docker tag ghcr.io/jaywcjlove/wxmp:latest ghcr.io/jaywcjlove/wxmp:${{needs.build.outputs.version}}
+      #       docker push ghcr.io/jaywcjlove/wxmp:${{needs.build.outputs.version}}
 
   build_windows: 
     needs: [build]
     runs-on: windows-latest
     timeout-minutes: 30
     steps:
-      - uses: actions/checkout@v3
+      - uses: actions/checkout@v4
-      - uses: actions/setup-node@v3
+      - uses: actions/setup-node@v4
         with:
-          node-version: 16
+          node-version: 20
 
       - name: Install
         run: npm install --build-from-source
@@ -133,7 +142,7 @@ jobs:
       - run: npm run build
       # - run: npm run electron
 
-      - uses: actions/download-artifact@v3
+      - uses: actions/download-artifact@v4
         with:
           name: webiste
           path: website/build
@@ -143,8 +152,11 @@ jobs:
         run: npm run deps
 
       - run: npm run build:app
+      - working-directory: electron/app/dist
+        run: ls -R
 
-      - uses: actions/upload-artifact@v3
+      - uses: actions/upload-artifact@v4
+        if: needs.build.outputs.successful == 'true'
         with:
           name: wxmp-windows
           path: |
@@ -155,16 +167,16 @@ jobs:
     runs-on: macos-latest
     timeout-minutes: 30
     steps:
-      - uses: actions/checkout@v3
+      - uses: actions/checkout@v4
-      - uses: actions/setup-node@v3
+      - uses: actions/setup-node@v4
         with:
-          node-version: 16
+          node-version: 20
 
       - run: npm install
       - run: npm run hoist
       - run: npm run build
 
-      - uses: actions/download-artifact@v3
+      - uses: actions/download-artifact@v4
         with:
           name: webiste
           path: website/build
@@ -174,8 +186,11 @@ jobs:
         run: npm run deps
       
       - run: npm run build:app
+      - working-directory: electron/app/dist
+        run: ls -R
 
-      - uses: actions/upload-artifact@v3
+      - uses: actions/upload-artifact@v4
+        if: needs.build.outputs.successful == 'true'
         with:
           name: wxmp-macos
           path: |
@@ -186,16 +201,16 @@ jobs:
     runs-on: ubuntu-latest
     timeout-minutes: 45
     steps:
-      - uses: actions/checkout@v3
+      - uses: actions/checkout@v4
-      - uses: actions/setup-node@v3
+      - uses: actions/setup-node@v4
         with:
-          node-version: 16
+          node-version: 20
       - run: npm install
       - run: npm run hoist
       - run: npm run build
       # - run: npm run electron
 
-      - uses: actions/download-artifact@v3
+      - uses: actions/download-artifact@v4
         with:
           name: webiste
           path: website/build
@@ -205,8 +220,11 @@ jobs:
         run: npm run deps
 
       - run: npm run build:app
+      - working-directory: electron/app/dist
+        run: ls -R
 
-      - uses: actions/upload-artifact@v3
+      - uses: actions/upload-artifact@v4
+        if: needs.build.outputs.successful == 'true'
         with:
           name: wxmp-linux
           path: |
@@ -216,26 +234,26 @@ jobs:
 
   create_release:
     needs: [build, build_windows, build_macos, build_linux]
-    if: needs.build.outputs.successful
+    if: needs.build.outputs.successful == 'true'
     runs-on: ubuntu-latest
     timeout-minutes: 45
     steps:
-      - uses: actions/checkout@v3
+      - uses: actions/checkout@v4
-      - uses: actions/setup-node@v3
+      - uses: actions/setup-node@v4
         with:
-          node-version: 16
+          node-version: 20
 
-      - uses: actions/download-artifact@v3
+      - uses: actions/download-artifact@v4
         with:
           name: wxmp-linux
           path: dist/linux
 
-      - uses: actions/download-artifact@v3
+      - uses: actions/download-artifact@v4
         with:
           name: wxmp-macos
           path: dist/macos
 
-      - uses: actions/download-artifact@v3
+      - uses: actions/download-artifact@v4
         with:
           name: wxmp-windows
           path: dist/windows
@@ -246,7 +264,7 @@ jobs:
 
       - name: Generate Changelog
         id: changelog
-        uses: jaywcjlove/changelog-generator@v1.5.7
+        uses: jaywcjlove/changelog-generator@main
         with:
           token: ${{ secrets.GITHUB_TOKEN }}
           filter-author: (jaywcjlove|小弟调调™|dependabot\[bot\]|Renovate Bot)
@@ -254,34 +272,51 @@ jobs:
 
       - name: Create Release
         uses: ncipollo/release-action@v1
-        if: needs.build.outputs.successful
+        if: needs.build.outputs.successful == 'true'
         with:
+          allowUpdates: true
           token: ${{ secrets.GITHUB_TOKEN }}
           name: ${{ steps.changelog.outputs.tag }}
           tag: ${{ steps.changelog.outputs.tag }}
+          artifacts: "dist/linux/*.rpm,dist/linux/*.deb,dist/macos/*.zip,dist/macos/*.dmg,dist/windows/*.exe"
           body: |
             Documentation ${{ steps.changelog.outputs.tag }}: https://raw.githack.com/jaywcjlove/wxmp/${{ steps.changelog.outputs.gh-pages-short-hash }}/index.html  
             Comparing Changes: ${{ steps.changelog.outputs.compareurl }}  
 
             ${{ steps.changelog.outputs.changelog }}
 
+            ```bash
+            docker pull wcjiang/wxmp:${{needs.build.outputs.create_tag_versionNumber}}
+            ```
+
+            ```bash
+            docker run --name wxmp --rm -d -p 9666:3000 wcjiang/wxmp:${{ needs.build.outputs.create_tag_versionNumber }}
+            # Or
+            docker run --name wxmp -itd -p 9666:3000 wcjiang/wxmp:${{ needs.build.outputs.create_tag_versionNumber }}
+            ```
+
+            Visit the following URL in your browser
+
+            ```bash
+            http://localhost:9666/
+            ```
+
   roll_back:
     if: failure()
     needs: [build, create_release]
     runs-on: ubuntu-latest
     timeout-minutes: 4
     steps:
-      - uses: actions/checkout@v2
+      - uses: actions/checkout@v4
         with:
           ref: ${{ github.head_ref }}
 
       - run: echo "outputs.version - ${{ needs.build.outputs.create_tag_version }}"
 
-      - uses: dev-drprasad/delete-tag-and-release@v0.2.0
+      - uses: dev-drprasad/delete-tag-and-release@v1.1
-        if: needs.build.outputs.successful
+        if: needs.build.outputs.successful == 'true'
         with:
           delete_release: true
           repo: jaywcjlove/wxmp
           tag_name: '${{ needs.build.outputs.create_tag_version }}'
-        env:
+          github_token: ${{ secrets.GITHUB_TOKEN }}
-          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}

README.md

@@ -1,12 +1,54 @@
+<div markdown="1">
+  <sup>使用<a href="https://wangchujiang.com/#/app" target="_blank">我的应用</a>也是一种<a href="https://wangchujiang.com/#/sponsor" target="_blank">支持</a>我的方式：</sup>
+  <br>
+  <a target="_blank" href="https://apps.apple.com/app/Deskmark/6755948110" title="Deskmark for macOS"><img alt="Deskmark" height="52" width="52" src="https://wangchujiang.com/appicon/deskmark.png"></a>
+  <a target="_blank" href="https://apps.apple.com/app/Keyzer/6500434773" title="Keyzer for macOS"><img alt="Keyzer" height="52" width="52" src="https://wangchujiang.com/appicon/keyzer.png"></a>
+  <a target="_blank" href="https://github.com/jaywcjlove/vidwall-hub" title="Vidwall Hub for macOS"><img alt="Vidwall Hub" height="52" width="52" src="https://wangchujiang.com/appicon/vidwall-hub.png"></a>
+  <a target="_blank" href="https://apps.apple.com/app/VidCrop/6752624705" title="VidCrop for macOS"><img alt="VidCrop" height="52" width="52" src="https://wangchujiang.com/appicon/vidcrop.png"></a>
+  <a target="_blank" href="https://apps.apple.com/app/Vidwall/6747587746" title="Vidwall for macOS"><img alt="Vidwall" height="52" width="52" src="https://wangchujiang.com/appicon/vidwall.png"></a>
+  <a target="_blank" href="https://wangchujiang.com/mousio-hint/" title="Mousio Hint for macOS"><img alt="Mousio Hint" height="52" width="52" src="https://wangchujiang.com/appicon/mousio-hint.png"></a>
+  <a target="_blank" href="https://apps.apple.com/app/6746747327" title="Mousio for macOS"><img alt="Mousio" height="52" width="52" src="https://wangchujiang.com/appicon/mousio.png"></a>
+  <a target="_blank" href="https://apps.apple.com/app/6745227444" title="Musicer for macOS"><img alt="Musicer" height="52" width="52" src="https://wangchujiang.com/appicon/musicer.png"></a>
+  <a target="_blank" href="https://apps.apple.com/app/6743841447" title="Audioer for macOS"><img alt="Audioer" height="52" width="52" src="https://wangchujiang.com/appicon/audioer.png"></a>
+  <a target="_blank" href="https://apps.apple.com/app/6744690194" title="FileSentinel for macOS"><img alt="FileSentinel" height="52" width="52" src="https://wangchujiang.com/appicon/file-sentinel.png"></a>
+  <a target="_blank" href="https://apps.apple.com/app/6743495172" title="FocusCursor for macOS"><img alt="FocusCursor" height="52" width="52" src="https://wangchujiang.com/appicon/focus-cursor.png"></a>
+  <a target="_blank" href="https://apps.apple.com/app/6742680573" title="Videoer for macOS"><img alt="Videoer" height="52" width="52" src="https://wangchujiang.com/appicon/videoer.png"></a>
+  <a target="_blank" href="https://apps.apple.com/app/6740425504" title="KeyClicker for macOS"><img alt="KeyClicker" height="52" width="52" src="https://wangchujiang.com/appicon/key-clicker.png"></a>
+  <a target="_blank" href="https://apps.apple.com/app/6739052447" title="DayBar for macOS"><img alt="DayBar" height="52" width="52" src="https://wangchujiang.com/appicon/daybar.png"></a>
+  <a target="_blank" href="https://apps.apple.com/app/6739444407" title="Iconed for macOS"><img alt="Iconed" height="52" width="52" src="https://wangchujiang.com/appicon/iconed.png"></a>
+  <a target="_blank" href="https://apps.apple.com/app/6737160756" title="Mousio for macOS"><img alt="Mousio" height="52" width="52" src="https://wangchujiang.com/appicon/rightmenu-master.png"></a>
+  <a target="_blank" href="https://apps.apple.com/app/6723903021" title="Paste Quick for macOS"><img alt="Quick RSS" height="52" width="52" src="https://wangchujiang.com/appicon/paste-quick.png"></a>
+  <a target="_blank" href="https://apps.apple.com/app/6670696072" title="Quick RSS for macOS/iOS"><img alt="Quick RSS" height="52" width="52" src="https://wangchujiang.com/appicon/quick-rss.png"></a>
+  <a target="_blank" href="https://apps.apple.com/app/6670167443" title="Web Serve for macOS"><img alt="Web Serve" height="52" width="52" src="https://wangchujiang.com/appicon/web-serve.png"></a>
+  <a target="_blank" href="https://apps.apple.com/app/6503953628" title="Copybook Generator for macOS/iOS"><img alt="Copybook Generator" height="52" width="52" src="https://wangchujiang.com/appicon/copybook-generator.png"></a>
+  <a target="_blank" href="https://apps.apple.com/app/6471227008" title="DevTutor for macOS/iOS"><img alt="DevTutor for SwiftUI" height="52" width="52" src="https://wangchujiang.com/appicon/devtutor.png"></a>
+  <a target="_blank" href="https://apps.apple.com/app/6479819388" title="RegexMate for macOS/iOS"><img alt="RegexMate" height="52" width="52" src="https://wangchujiang.com/appicon/regex-mate.png"></a>
+  <a target="_blank" href="https://apps.apple.com/app/6479194014" title="Time Passage for macOS/iOS"><img alt="Time Passage" height="52" width="52" src="https://wangchujiang.com/appicon/time-passage.png"></a>
+  <a target="_blank" href="https://apps.apple.com/app/6478772538" title="IconizeFolder for macOS"><img alt="Iconize Folder" height="52" width="52" src="https://wangchujiang.com/appicon/iconize-folder.png"></a>
+  <a target="_blank" href="https://apps.apple.com/app/6478511402" title="Textsound Saver for macOS/iOS"><img alt="Textsound Saver" height="52" width="52" src="https://wangchujiang.com/appicon/textsound-saver.png"></a>
+  <a target="_blank" href="https://apps.apple.com/app/6476924627" title="Create Custom Symbols for macOS"><img alt="Create Custom Symbols" height="52" width="52" src="https://wangchujiang.com/appicon/create-custom-symbols.png"></a>
+  <a target="_blank" href="https://apps.apple.com/app/6476452351" title="DevHub for macOS"><img alt="DevHub" height="52" width="52" src="https://wangchujiang.com/appicon/devhub.png"></a>
+  <a target="_blank" href="https://apps.apple.com/app/6476400184" title="Resume Revise for macOS"><img alt="Resume Revise" height="52" width="52" src="https://wangchujiang.com/appicon/resume-revise.png"></a>
+  <a target="_blank" href="https://apps.apple.com/app/6472593276" title="Palette Genius for macOS"><img alt="Palette Genius" height="52" width="52" src="https://wangchujiang.com/appicon/palette-genius.png"></a>
+  <a target="_blank" href="https://apps.apple.com/app/6470879005" title="Symbol Scribe for macOS"><img alt="Symbol Scribe" height="52" width="52" src="https://wangchujiang.com/appicon/symbol-scribe.png"></a>
+</div>
+<hr>
+
 <div align="center">
   <h1 align="center">微信公众号 Markdown 编辑器</h1>
 </div>
 
+[![Buy me a coffee](https://img.shields.io/badge/Buy%20me%20a%20coffee-048754?logo=buymeacoffee)](https://jaywcjlove.github.io/#/sponsor)
+[![CI](https://github.com/jaywcjlove/wxmp/actions/workflows/ci.yml/badge.svg)](https://github.com/jaywcjlove/wxmp/actions/workflows/ci.yml)
+[![Docker Image Version (latest by date)](https://img.shields.io/docker/v/wcjiang/wxmp?logo=docker)](https://hub.docker.com/r/wcjiang/wxmp)
+[![Docker Image Size (latest by date)](https://img.shields.io/docker/image-size/wcjiang/wxmp?logo=docker)](https://hub.docker.com/r/wcjiang/wxmp)
+[![Docker Pulls](https://img.shields.io/docker/pulls/wcjiang/wxmp?logo=docker)](https://hub.docker.com/r/wcjiang/wxmp)
+
 [![微信公众号 Markdown 编辑器](https://user-images.githubusercontent.com/1680273/188264183-a6b8cb6a-92e1-4a73-afc5-4f0234b26ed3.png)](https://jaywcjlove.github.io/wxmp)
 
 微信公众号文章 Markdown 在线编辑器，使用 markdown 语法创建一篇简介美观大方的微信公众号图文。由于发版本麻烦，和一些功能无法扩展停滞开发了，未来不再开发 Chrome 的插件(暂存在 chrome 分支)，通过 web 版本定制更丰富的功能。
 
-[![Markdown 编辑器桌面应用](https://user-images.githubusercontent.com/1680273/188407235-ead43d61-2ef8-416a-926f-396d8b824b33.png)](https://jaywcjlove.github.io/wxmp)
+[![Markdown 编辑器桌面应用](https://user-images.githubusercontent.com/1680273/188407235-ead43d61-2ef8-416a-926f-396d8b824b33.png)](https://github.com/jaywcjlove/wxmp/releases)
 
 ## 功能特性
 
@@ -23,6 +65,14 @@
 - [x] CI 自动生成 Electron 桌面应用。
 - [ ] ~~支持全局字号大小选择。~~
 
+### 数学公式
+
+$\\c = \pm\sqrt{a^2 + b^2}$ 和 $C_L$ 数学公式行内显示
+
+```math
+L = \frac{1}{2} \rho v^2 S C_L
+```
+
 ### 支持代码块样式
 
 下面是 `jsx` 代码块展示示例，并高亮代码，用于 web 应用中效果展示。

electron/app/package.json

@@ -2,7 +2,7 @@
   "name": "wxmp",
   "description": "微信公众号 Markdown 编辑器",
   "homepage": "https://github.com/jaywcjlove/wxmp.git",
-  "version": "2.3.0",
+  "version": "2.4.1",
   "main": "main.js",
   "author": "Kenny Wong <398188662@qq.com>",
   "private": true,
@@ -18,13 +18,13 @@
     "build": "npm run copy && cross-env NODE_ENV=production electron-builder build --publish=never --config config.json"
   },
   "dependencies": {
-    "@wcj/wxmp-main": "2.3.0"
+    "@wcj/wxmp-main": "2.4.1"
   },
   "devDependencies": {
-    "@wcj/wxmp-preload": "2.3.0",
+    "@wcj/wxmp-preload": "2.4.1",
-    "cpy-cli": "4.2.0",
+    "cpy-cli": "^5.0.0",
-    "electron": "19.0.5",
+    "electron": "20.1.3",
     "electron-builder": "23.3.3",
-    "website": "2.3.0"
+    "website": "2.4.1"
   }
 }

electron/main/package.json

@@ -1,16 +1,16 @@
 {
   "name": "@wcj/wxmp-main",
-  "version": "2.3.0",
+  "version": "2.4.1",
   "main": "./lib/index.js",
   "private": true,
   "scripts": {
-    "build": "tsbb build --disable-babel --file-names src/index.ts",
+    "build": "tsbb build",
-    "watch": "tsbb watch --disable-babel --file-names src/index.ts"
+    "watch": "tsbb watch"
   },
   "files": [
     "lib"
   ],
   "devDependencies": {
-    "electron": "19.0.5"
+    "electron": "20.1.3"
   }
 }

electron/preload/package.json

@@ -1,16 +1,16 @@
 {
   "name": "@wcj/wxmp-preload",
-  "version": "2.3.0",
+  "version": "2.4.1",
   "main": "./lib/index.js",
   "private": true,
   "scripts": {
-    "build": "tsbb build --disable-babel --file-names src/index.ts",
+    "build": "tsbb build",
-    "watch": "tsbb watch --disable-babel --file-names src/index.ts"
+    "watch": "tsbb watch"
   },
   "files": [
     "lib"
   ],
   "devDependencies": {
-    "electron": "19.0.5"
+    "electron": "20.1.3"
   }
 }

lerna.json

@@ -1,4 +1,4 @@
 {
-  "version": "2.3.0",
+  "version": "2.4.1",
   "packages": ["website", "electron/*"]
 }

package.json

@@ -9,18 +9,19 @@
     "version": "lerna version --exact --force-publish --no-push --no-git-tag-version",
     "prepare": "husky install",
     "prettier": "prettier --write '**/*.{js,jsx,tsx,ts,less,md,json}'",
-    "pretty-quick": "pretty-quick --staged",
     "hoist": "lerna bootstrap --hoist",
     "clean": "lerna clean --yes"
   },
   "license": "MIT",
   "devDependencies": {
+    "@lerna/legacy-package-management": "^8.0.0",
     "cross-env": "^7.0.3",
     "husky": "^8.0.1",
-    "lerna": "5.5.0",
+    "lerna": "^8.0.0",
-    "prettier": "^2.7.1",
+    "prettier": "^3.0.2",
-    "pretty-quick": "~3.1.3",
+    "react": "~18.2.0",
-    "tsbb": "^3.7.5"
+    "react-dom": "~18.2.0",
+    "tsbb": "~4.4.0"
   },
   "workspaces": {
     "packages": [

website/.kktrc.ts

@@ -20,6 +20,8 @@ export default (conf: Configuration, env: 'development' | 'production', options:
     }),
   );
 
+  /** https://github.com/kktjs/kkt/issues/446 */
+  conf.ignoreWarnings = [{ module: /node_modules[\\/]parse5[\\/]/ }];
   conf.module!.exprContextCritical = false;
   if (env === 'production') {
     conf.output = { ...conf.output, publicPath: './' };

website/package.json

@@ -1,6 +1,6 @@
 {
   "name": "website",
-  "version": "2.3.0",
+  "version": "2.4.1",
   "private": true,
   "scripts": {
     "start": "kkt start",
@@ -25,33 +25,33 @@
     "@uiw/codemirror-theme-xcode": "^4.11.6",
     "@uiw/react-back-to-top": "^1.2.0",
     "@uiw/react-github-corners": "^1.5.15",
-    "@uiw/react-markdown-editor": "^5.7.0",
+    "@uiw/react-markdown-editor": "^6.0.0",
     "@wcj/dark-mode": "^1.0.15",
     "css-tree": "^2.2.1",
-    "react": "^18.2.0",
+    "react": "~18.2.0",
-    "react-code-preview-layout": "^2.0.4",
+    "react-dom": "~18.2.0",
-    "react-dom": "^18.2.0",
     "react-hot-toast": "^2.3.0",
     "react-router-dom": "^6.3.0",
-    "rehype-attr": "^2.0.8",
+    "rehype-attr": "^3.0.0",
-    "rehype-ignore": "^1.0.1",
+    "rehype-ignore": "^2.0.0",
-    "rehype-prism-plus": "^1.5.0",
+    "rehype-katex": "^7.0.1",
-    "rehype-raw": "^6.1.1",
+    "rehype-prism-plus": "^2.0.0",
-    "rehype-stringify": "^9.0.3",
+    "rehype-raw": "^7.0.0",
-    "remark-gfm": "^3.0.1",
+    "rehype-stringify": "^10.0.0",
-    "remark-parse": "^10.0.1",
+    "remark-gfm": "^4.0.0",
-    "remark-rehype": "^10.1.0",
+    "remark-math": "^6.0.0",
-    "styled-components": "^5.3.5",
+    "remark-parse": "^11.0.0",
-    "unified": "^10.1.2"
+    "remark-rehype": "^11.0.0",
+    "styled-components": "~6.1.0",
+    "unified": "^11.0.0"
   },
   "devDependencies": {
     "@kkt/less-modules": "^7.2.0",
     "@kkt/raw-modules": "^7.2.0",
     "@kkt/scope-plugin-options": "^7.2.0",
-    "@types/css-tree": "^1.0.7",
+    "@types/css-tree": "^2.3.1",
     "@types/react": "^18.0.17",
     "@types/react-dom": "^18.0.6",
-    "@types/styled-components": "^5.1.25",
     "kkt": "^7.2.0",
     "markdown-react-code-preview-loader": "^2.1.2"
   },

website/src/commands/copy.tsx

@@ -13,16 +13,22 @@ const Button = styled.button`
 const CopyView: React.FC<{ command: ICommand; editorProps: IMarkdownEditor & ToolBarProps }> = (props) => {
   const { editorProps } = props;
   const handleClick = () => {
-    const dom = editorProps.preview.current;
+    const dom: HTMLDivElement | null = editorProps.preview.current;
-    dom?.focus();
+    if (!dom) {
-    window.getSelection()?.removeAllRanges();
+      toast.error(<div>dom is null</div>);
-    let range = document.createRange();
+      return;
-    range.setStartBefore(dom?.firstChild!);
+    }
-    range.setEndAfter(dom?.lastChild!);
+    dom.focus();
-    window.getSelection()?.addRange(range);
+    const htmlContent = dom.innerHTML;
-    document.execCommand(`copy`);
+    navigator.clipboard
-    window.getSelection()?.removeAllRanges();
+      .writeText(htmlContent)
-    toast.success(<div>复制成功！去公众号编辑器复制吧！</div>);
+      .then(() => {
+        toast.success(<div>复制成功！去公众号编辑器粘贴吧！</div>);
+      })
+      .catch((err) => {
+        toast.error(<div>{JSON.stringify(err)}</div>);
+        console.error('Failed to copy: ', err);
+      });
   };
   return (
     <Button type="button" onClick={handleClick}>

website/src/commands/css.tsx

@@ -4,7 +4,7 @@ import styled from 'styled-components';
 
 const Link = styled(NavLink)`
   font-size: 0.8rem;
-  line-height: 0.8rem;
+  line-height: 0.7rem;
   text-decoration: none;
   padding: 0.18rem 0.3rem;
   &:hover {

website/src/commands/theme.tsx

@@ -12,7 +12,7 @@ const Select = styled.select`
   padding: 0 0.2rem 0 0.2rem;
   margin: 0;
   font-family: inherit;
-  font-size: 0.8rem;
+  font-size: 0.7rem;
   outline: none;
   height: 1.15rem;
   cursor: inherit;

website/src/pages/home/index.tsx

@@ -1,5 +1,6 @@
 import MarkdownEditor, { getCommands } from '@uiw/react-markdown-editor';
 import { useContext } from 'react';
+// @ts-ignore
 import { EditorView } from '@codemirror/view';
 import { Preview } from './Preview';
 import { copy } from '../../commands/copy';

website/src/themes/base.md.css

@@ -5,7 +5,7 @@ a {
 
 h1 {
   color: inherit;
-  font-size: 16px;
+  font-size: 18px;
   font-weight: bold;
 }
 
@@ -32,7 +32,7 @@ h4 {
 
 p {
   color: initial;
-  font-size: 14px;
+  font-size: 16px;
   line-height: 1.5em;
 }
 

website/src/themes/default.md.css

@@ -11,7 +11,7 @@ h1 {
   line-height: 1.75;
   font-family: -apple-system-font, BlinkMacSystemFont, 'Helvetica Neue', 'PingFang SC', 'Hiragino Sans GB',
     'Microsoft YaHei UI', 'Microsoft YaHei', Arial, sans-serif;
-  font-size: 16px;
+  font-size: 18px;
   font-weight: bold;
   margin: 2em auto 1em;
   padding: 0 1em;
@@ -63,7 +63,7 @@ li {
 }
 
 p {
-  font-size: 14px;
+  font-size: 16px;
   line-height: 1.5em;
   padding: 0.5em 0 !important;
   margin-bottom: 0 !important;

website/src/themes/simple.md.css

@@ -11,7 +11,7 @@ h1 {
   line-height: 1.75;
   font-family: -apple-system-font, BlinkMacSystemFont, 'Helvetica Neue', 'PingFang SC', 'Hiragino Sans GB',
     'Microsoft YaHei UI', 'Microsoft YaHei', Arial, sans-serif;
-  font-size: 16px;
+  font-size: 18px;
   font-weight: bold;
   margin: 2em auto 1em;
   padding: 0 1em;
@@ -63,7 +63,7 @@ li {
 }
 
 p {
-  font-size: 14px;
+  font-size: 16px;
   line-height: 1.5em;
   padding: 0.5em 0 !important;
   margin-bottom: 0 !important;

website/src/themes/underscore.md.css

@@ -11,7 +11,7 @@ h1 {
   line-height: 1.15;
   font-family: -apple-system-font, BlinkMacSystemFont, 'Helvetica Neue', 'PingFang SC', 'Hiragino Sans GB',
     'Microsoft YaHei UI', 'Microsoft YaHei', Arial, sans-serif;
-  font-size: 16px;
+  font-size: 18px;
   font-weight: bold;
   margin: 2em auto 1em;
   padding: 0 1em 0.3em 1em;
@@ -37,7 +37,7 @@ h3 {
   line-height: 1.2;
   font-family: -apple-system-font, BlinkMacSystemFont, 'Helvetica Neue', 'PingFang SC', 'Hiragino Sans GB',
     'Microsoft YaHei UI', 'Microsoft YaHei', Arial, sans-serif;
-  font-size: 1.1em;
+  font-size: 14px;
   font-weight: bold;
   margin: 2em 8px 0.75em 0;
   padding-left: 8px;
@@ -59,7 +59,7 @@ li {
 }
 
 p {
-  font-size: 14px;
+  font-size: 16px;
   line-height: 1.5em;
   padding: 0.5em 0 !important;
   margin-bottom: 0 !important;

website/src/utils/css.ts

@@ -129,7 +129,7 @@ export const footnotesLabel = (node: Element) => {
   ];
 };
 
-export const imagesStyle = (node: Element, parent: Root | Element | null) => {
+export const imagesStyle = (node: Element, parent: Root | Element | undefined) => {
   if (
     parent?.type === 'element' &&
     /(p|a)/.test(parent.tagName) &&

website/src/utils/markdownToHTML.ts

@@ -5,7 +5,10 @@ import { Element } from 'hast';
 import remarkParse from 'remark-parse';
 import remarkGfm from 'remark-gfm';
 import remarkRehype from 'remark-rehype';
+import remarkMath from 'remark-math';
 import rehypePrism from 'rehype-prism-plus';
+import rehypeKatex from 'rehype-katex';
+import 'katex/dist/katex.min.css'; // Ensure KaTeX styles are included
 import rehypeRaw from 'rehype-raw';
 import rehypeAttrs from 'rehype-attr';
 import rehypeIgnore from 'rehype-ignore';
@@ -26,19 +29,23 @@ export function markdownToHTML(md: string, css: string, opts: MarkdownToHTMLOpti
     parseCustomProperty: false,
     positions: false,
   });
+
   // @ts-ignore
   const data = cssdata(ast.children.head, {}, { color: opts.preColor, theme: opts.previewTheme });
   const processor = unified()
     .use(remarkParse)
     .use(remarkGfm)
+    .use(remarkMath)
     .use(remarkRehype, { allowDangerousHtml: true })
-    .use(rehypePrism)
     .use(rehypeRaw)
+    .use(rehypeKatex)
+    .use(rehypePrism, {
+      ignoreMissing: true,
+    })
     .use(rehypeIgnore, {})
     .use(rehypeAttrs, { properties: 'attr' })
     .use(rehypeRewrite, {
       rewrite: (node, _index, parent) => {
-        // @ts-ignore
         if (
           node?.type === 'element' &&
           node?.tagName === 'code' &&