Chinese grammar data manually copied and edited from https://resources.allsetlearning.com/chinese/grammar/Main_Page

How it works for Android

Using Tauri, an extra CSS is needed for Android webview fix:-

body {
  padding-top: env(safe-area-inset-top);
  padding-bottom: env(safe-area-inset-bottom);
  padding-left: env(safe-area-inset-left);
  padding-right: env(safe-area-inset-right);
}

Android without hot-reload

Tauri for Android target runs even with dev server down, with tauri android run (while no hot-reloading).

APK will be generated at src-tauri/gen/android/app/build/outputs/apk/arm64/debug/app-arm64-debug.apk which can be installed with

adb install -r src-tauri/gen/android/app/build/outputs/apk/arm64/debug/app-arm64-debug.apk

Android hot-reload

When dev server is used, in addition to Android app won't work with dev server down, Firewall settings must also be allowed.

For Windows PowerShell,

New-NetFirewallRule -DisplayName "Vitepress Server" -Direction Inbound -Protocol TCP -LocalPort 5173 -Action Allow

In addition, dev server needs to bind to 0.0.0.0 or TAURI_DEV_HOST env var.

import { defineConfig } from "vitepress";

const host = process.env.TAURI_DEV_HOST;

// https://vitepress.dev/reference/site-config
export default defineConfig({
  vite: {
    server: {
      port: 5173,
      strictPort: true,
      host: host || false,
      hmr: host
        ? {
            protocol: "ws",
            host,
            port: 5174,
          }
        : undefined,
    },
  },
});