docs(ssr): add caveat

demo/pages/docs/nuxtjs/enUS/index.md

@@ -1,5 +1,9 @@
 # Nuxt.js
 
+## Caveat
+
+This document pertains to SSR (Server-Side Rendering). Please familiarize yourself with the [SSR Caveats](ssr#Caveat) before proceeding.
+
 ## Nuxt.js Demo
 
 You can refer to [example](https://github.com/07akioni/naive-ui-nuxt-demo).
@@ -18,13 +22,6 @@ npx nuxi module add nuxtjs-naive-ui
 pnpm dlx nuxi module add nuxtjs-naive-ui
 ```
 
-> If you are using this module, make sure:
->
-> 1. `@css-render/*` and `css-render` packages' version satisfies `>=0.15.14`.
-> 2. Each of `@css-render/*` and `css-render` only resolves 1 target. (No different versions of same package & No duplicate for the same version)
->
-> You can search in lock file for `css-render` to check if there's duplicate.
-
 ## Using Auto Import in Nuxt
 
 You can also use the `unplugin-auto-import` plugin to automatically import APIs and the `unplugin-vue-components` plugin to automatically import components on demand. In this case, the `nuxt.config.ts` file will have a few additional configuration lines compared to the example above.

demo/pages/docs/nuxtjs/zhCN/index.md

@@ -1,5 +1,9 @@
 # Nuxt.js
 
+## 注意
+
+本文档涉及到 SSR，请先了解[SSR 的注意事项](ssr#注意)。
+
 ## Nuxt.js 示例
 
 参考[例子](https://github.com/07akioni/naive-ui-nuxt-demo)。
@@ -18,13 +22,6 @@ npx nuxi module add nuxtjs-naive-ui
 pnpm dlx nuxi module add nuxtjs-naive-ui
 ```
 
-> 使用该模块，请确保:
->
-> 1. `@css-render/*` 和 `css-render` 的版本都 `>=0.15.14`
-> 2. 每个 `@css-render/*` 和 `css-render` 包最终只都指向一个目标（一个包不会有多个版本，也不会有同一个版本的多个副本）
->
-> 你可以在 lock file 中搜索 `css-render` 去检查是不是有重复的
-
 ## 在 Nuxt 中使用自动引入
 
 同样可以使用 `unplugin-auto-import` 插件来自动导入 API，使用 `unplugin-vue-components` 插件来按需自动加载组件。在这种情况下，`nuxt.config.ts` 会比上面的例子多几行配置。

demo/pages/docs/ssr/enUS/index.md

@@ -2,6 +2,19 @@
 
 Since naive-ui is using CSS in JS, in SSR mode it needs some extra configuration.
 
+## Caveat
+
+When using SSR under any framework, it is essential to ensure that the project meets the following conditions:
+
+1. During the build process, any direct or indirect references to the `@css-render/*` and `css-render` packages must have a version of `>=0.15.14`.
+2. During the build process, each direct or indirect reference to any `@css-render/*` and `css-render` package should ultimately point to a single target (a package should not have multiple versions or multiple copies of the same version).
+
+You can search for `css-render` in the lock file to check for duplicate packages.
+
+Failure to meet these conditions may result in SSR build failures.
+
+If you encounter issues due to this, you can resolve the problem by directing all related packages to the same version using the `resolution` field in the `package.json` file.
+
 ## Nuxt.js
 
 See [Nuxt.js](nuxtjs).

demo/pages/docs/ssr/zhCN/index.md

@@ -2,6 +2,19 @@
 
 由于 naive-ui 在使用 CSS in JS，在 SSR 的情况下需要一些额外的配置。
 
+## 注意
+
+无论在任何框架下使用 SSR，需要确保项目满足以下条件：
+
+1. 构建时，任何被直接和间接引用的 `@css-render/*` 和 `css-render` 包版本都 `>=0.15.14`
+2. 构建时，任何被直接和间接引用的每个 `@css-render/*` 和 `css-render` 包最终只都指向一个目标（一个包不会有多个版本，也不会有同一个版本的多个副本）
+
+你可以在 lock file 中搜索 `css-render` 去检查是否有重复的包。
+
+如果上述条件没有满足，可能会导致 SSR 构建失败。
+
+如果因为这个原因遇到问题，你可以通过 `package.json` 中的 `resolution` 字段来让所有相关包指向同一个版本来解决问题。
+
 ## Nuxt.js
 
 参考 [Nuxt.js](nuxtjs)。

demo/pages/docs/vite-ssge/enUS/index.md

@@ -1,8 +1,14 @@
 # Vite SSG/SSE
 
+## Caveat
+
+This document pertains to SSR (Server-Side Rendering). Please familiarize yourself with the [SSR Caveats](ssr#Caveat) before proceeding.
+
+## Setup Guide
+
 If you are using `vite-sse` or `vite-ssg`. Follow the following steps to setup `naive-ui`.
 
-## 1. Install `naive-ui`, `@css-render/vue3-ssr`
+### 1. Install `naive-ui`, `@css-render/vue3-ssr`
 
 ```bash
 # pnpm
@@ -12,7 +18,7 @@ pnpm i naive-ui @css-render/vue3-ssr
 npm i naive-ui @css-render/vue3-ssr
 ```
 
-## 2. Modify `vite.config.ts`
+### 2. Modify `vite.config.ts`
 
 Add following content. If there exists content already, merge them.
 

demo/pages/docs/vite-ssge/zhCN/index.md

@@ -1,8 +1,14 @@
 # Vite SSG/SSE
 
+## 注意
+
+本文档涉及到 SSR，请先了解[SSR 的注意事项](ssr#注意)。
+
+## 配置指南
+
 如果你正在使用 `vite-sse` 或者 `vite-ssg`，通过下面的步骤设定 `naive-ui`。
 
-## 1. 安装 `naive-ui`、`@css-render/vue3-ssr`
+### 1. 安装 `naive-ui`、`@css-render/vue3-ssr`
 
 ```bash
 # pnpm
@@ -12,7 +18,7 @@ pnpm i naive-ui @css-render/vue3-ssr
 npm i naive-ui @css-render/vue3-ssr
 ```
 
-## 2. 修改 `vite.config.ts`
+### 2. 修改 `vite.config.ts`
 
 增加下列内容，如果已经存在一些内容，则合并他们。
 

demo/pages/docs/vitepress/enUS/index.md

@@ -1,5 +1,9 @@
 # Vitepress
 
+## Caveat
+
+This document pertains to SSR (Server-Side Rendering). Please familiarize yourself with the [SSR Caveats](ssr#Caveat) before proceeding.
+
 ## Example
 
 This is a [demo](https://github.com/07akioni/naive-ui-vitepress-demo) for using `naive-ui` in `vitepress` with SSR enabled.

demo/pages/docs/vitepress/zhCN/index.md

@@ -1,5 +1,9 @@
 # Vitepress
 
+## 注意
+
+本文档涉及到 SSR，请先了解[SSR 的注意事项](ssr#注意)。
+
 ## 例子
 
 这是一个使用 `naive-ui`、`vitepress` 的[样例](https://github.com/07akioni/naive-ui-vitepress-demo)，支持 SSR。