Translate Chinese

docs/.vitepress/config/index.ts

@@ -3,6 +3,7 @@ import { defineConfig } from 'vitepress'
 import { groupIconMdPlugin, groupIconVitePlugin } from 'vitepress-plugin-group-icons'
 import { algolia } from './algolia'
 import { en } from './en'
+import { zh } from './zh'
 
 export default defineConfig({
   title: 'Pinia Plugin Persistedstate',
@@ -71,5 +72,6 @@ export default defineConfig({
       lang: 'en',
       ...en,
     },
+    zh: { label: '简体中文', ...zh },
   },
 })

docs/.vitepress/config/zh.ts

@@ -0,0 +1,99 @@
+import type { DefaultTheme, LocaleSpecificConfig } from 'vitepress'
+import { version } from '../../../package.json'
+
+export const zh: LocaleSpecificConfig<DefaultTheme.Config> = {
+  description: 'Pinia stores的可配置持久性.',
+  themeConfig: {
+    editLink: {
+      text: '建议对此页面进行更改',
+      pattern: 'https://github.com/prazdevs/pinia-plugin-persistedstate/edit/main/docs/:path',
+    },
+    docFooter: {
+      prev: '上一页',
+      next: '下一页',
+    },
+
+    outline: {
+      label: '页面导航',
+    },
+
+    lastUpdated: {
+      text: '最后更新于',
+      formatOptions: {
+        dateStyle: 'short',
+        timeStyle: 'medium',
+      },
+    },
+    nav: [
+      {
+        text: '指南',
+        link: '/zh/guide/',
+        activeMatch: '/zh/guide/',
+      },
+      {
+        text: '框架',
+        items: [
+          { text: 'Nuxt', link: '/zh/frameworks/nuxt' },
+          { text: '其他框架', link: '/zh/frameworks/others' },
+        ],
+      },
+      {
+        text: `v${version}`,
+        items: [
+          {
+            items: [{
+              text: '发行说明',
+              link: 'https://github.com/prazdevs/pinia-plugin-persistedstate/releases',
+            }],
+          },
+          {
+            text: '版本',
+            items: [
+              {
+                text: `${version} (Current)`,
+                activeMatch: '/',
+                link: '#',
+              },
+              {
+                text: '3.2.2',
+                link: 'https://github.com/prazdevs/pinia-plugin-persistedstate/tree/v3',
+              },
+              {
+                text: '2.4.0',
+                link: 'https://github.com/prazdevs/pinia-plugin-persistedstate/tree/v2',
+              },
+              {
+                text: '1.6.3',
+                link: 'https://github.com/prazdevs/pinia-plugin-persistedstate/tree/v2',
+              },
+            ],
+          },
+        ],
+      },
+    ],
+    sidebar: [
+      {
+        text: '指南',
+        items: [
+          { text: '为什么使用这个插件？', link: '/zh/guide/why' },
+          { text: '开始', link: '/zh/guide/' },
+          { text: '配置', link: '/zh/guide/config' },
+          { text: '局限性', link: '/zh/guide/limitations' },
+          { text: '高级用法', link: '/zh/guide/advanced' },
+        ],
+      },
+      {
+        text: '框架',
+        items: [
+          { text: 'Nuxt', link: '/zh/frameworks/nuxt' },
+          { text: '其他框架', link: '/zh/frameworks/others' },
+        ],
+      },
+    ],
+    footer: {
+      message: '基于 MIT 许可发布。',
+      copyright: '版权所有 © 2021 年至今 Sacha Bouillez 及贡献者',
+    },
+
+  },
+}

docs/zh/frameworks/nuxt.md

@@ -0,0 +1,192 @@
+# 在 Nuxt 中使用
+
+该软件包 `pinia-plugin-persistedstate` 附带一个 Nuxt 模块，可提供开箱即用的 SSR 友好体验。
+
+## 安装
+
+1. 使用你喜欢的包管理器安装依赖项：
+  ::: code-group
+  ```sh [pnpm]
+  pnpm add pinia-plugin-persistedstate
+  ```
+  ```sh [npm]
+  npm i pinia-plugin-persistedstate
+  ```
+  ```sh [yarn]
+  yarn add pinia-plugin-persistedstate
+  ```
+  :::
+
+1. 将模块添加到 Nuxt 配置中：
+```ts [nuxt.config.ts]
+export default defineNuxtConfig({
+  modules: [
+    '@pinia/nuxt',
+    'pinia-plugin-persistedstate/nuxt',
+  ],
+})
+```
+
+## 用法
+
+在声明您的存储时，将新的 `persist` 选项设置为 `true`。
+
+::: code-group
+```ts{11} [setup syntax]
+import { defineStore } from 'pinia'
+import { ref } from 'vue'
+
+export const useStore = defineStore(
+  'main',
+  () => {
+    const someState = ref('hello pinia')
+    return { someState }
+  },
+  {
+    persist: true,
+  },
+)
+```
+```ts{9} [option syntax]
+import { defineStore } from 'pinia'
+
+export const useStore = defineStore('main', {
+  state: () => {
+    return {
+      someState: 'hello pinia',
+    }
+  },
+  persist: true,
+})
+```
+:::
+
+## 预配置
+
+Nuxt 模块预配置了以下内容：
+
+- [`cookies`](https://developer.mozilla.org/en-US/docs/Web/HTTP/Cookies) 作为存储。
+- [`store.$id`](https://pinia.vuejs.org/api/interfaces/pinia.StoreProperties.html) 作为 storage 的默认 key。
+- [`JSON.stringify`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/JSON/stringify)/[`destr`](https://github.com/unjs/destr) 作为序列化器/反序列化器。
+- 整个状态将持久化到存储中。
+
+## 选择存储
+
+您可以通过使用自动导入的 `piniaPluginPersistedstate` 变量下的可用存储来配置要使用的存储。
+
+> [!WARNING] 警告
+> 使用 `persistedState` 公开的存储之外的其他存储可能会出现意外行为。
+
+### `cookies`
+
+```ts{10}
+import { defineStore } from 'pinia'
+
+export const useStore = defineStore('main', {
+  state: () => {
+    return {
+      someState: 'hello pinia',
+    }
+  },
+  persist: {
+    storage: piniaPluginPersistedstate.cookies(),
+  },
+})
+```
+
+> [!TIP] 提示
+> `persistedState.Cookies` 方法接受一个对象参数来配置带有以下选项的cookie(从Nuxt的 `useCookie` 继承而来):
+>  - [`domain`](https://nuxt.com/docs/api/composables/use-cookie#domain)
+>  - [`expires`](https://nuxt.com/docs/api/composables/use-cookie#maxage-expires)
+>  - [`httpOnly`](https://nuxt.com/docs/api/composables/use-cookie#httponly)
+>  - [`maxAge`](https://nuxt.com/docs/api/composables/use-cookie#maxage-expires)
+>  - [`partitioned`](https://nuxt.com/docs/api/composables/use-cookie#partitioned)
+>  - [`path`](https://nuxt.com/docs/api/composables/use-cookie#path)
+>  - [`sameSite`](https://nuxt.com/docs/api/composables/use-cookie#samesite)
+>  - [`secure`](https://nuxt.com/docs/api/composables/use-cookie#secure)
+
+### `localStorage`
+
+```ts{10}
+import { defineStore } from 'pinia'
+
+export const useStore = defineStore('main', {
+  state: () => {
+    return {
+      someState: 'hello pinia',
+    }
+  },
+  persist: {
+    storage: piniaPluginPersistedstate.localStorage(),
+  },
+})
+```
+
+> [!WARNING] 警告
+> `localStorage` 仅限客户端。
+
+### `sessionStorage`
+
+```ts{10}
+import { defineStore } from 'pinia'
+
+export const useStore = defineStore('main', {
+  state: () => {
+    return {
+      someState: 'hello pinia',
+    }
+  },
+  persist: {
+    storage: piniaPluginPersistedstate.sessionStorage(),
+  },
+})
+```
+
+> [!WARNING] 警告
+> `sessionStorage` 仅限客户端。
+
+## 全局选项
+
+该模块接受在 `piniaPluginPersistedstate` key下的 `nuxt.config.ts` 中定义的一些选项:
+
+- [`cookieOptions`](#cookies)
+- `debug`
+- [`key`](#global-key)
+- `storage`
+
+> [!NOTE]
+> 全局存储选项仅接受预配置存储 (`'cookies'`, `'localStorage'`, `'sessionStorage'`)的字符串值。 这是由于 Nuxt 将 [模块选项传递给运行时](https://nuxt.com/docs/guide/going-further/modules#exposing-options-to-runtime)的方式。
+
+```ts{6-12} [nuxt.config.ts]
+export default defineNuxtConfig({
+  modules: [
+    '@pinia/nuxt',
+    'pinia-plugin-persistedstate/nuxt'
+  ],
+  piniaPluginPersistedstate: {
+    storage: 'cookies',
+    cookieOptions: {
+      sameSite: 'lax',
+    },
+    debug: true,
+  },
+})
+```
+
+## 全局密钥
+
+您可以为全局使用的前缀/后缀键提供模板字符串。提供的密钥必须包含令牌 `%id` ,该令牌将被相应的存储id替换。
+
+```ts{6} [nuxt.config.ts]
+export default defineNuxtConfig({
+  modules: [
+    '@pinia/nuxt',
+    'pinia-plugin-persistedstate/nuxt'
+  ],
+  piniaPluginPersistedstate: {
+    key: 'prefix_%id_postfix',
+  },
+})
+```
+
+任何以 `my-store` 作为持久key(用户提供或从商店id推断)的商店都将在 `prefix_my-store_postfix` key下持久化。

docs/zh/frameworks/others.md

@@ -0,0 +1,6 @@
+# 与其他 Vue 框架一起使用
+
+没有计划在 Nuxt 之外为 Vue 框架提供官方支持。但是，该插件应该可以在大多数框架中使用，就像任何 Pinia 插件一样。请注意潜在的 SSR 警告。
+
+> [!IMPORTANT] 重要
+> 如果你想提供在Quasar、Ionic或Vike等框架中集成 `pinia-plugin-persistedstate` 的配置，非常欢迎你 [为文档做出贡献](https://github.com/prazdevs/pinia-plugin-persistedstate/blob/main/CONTRIBUTING.md)!