docs: update

docs/features/highlight.md

@@ -24,3 +24,31 @@ pages
 Additionally, in every `index.vue`, there is a console statement. By default, the highlighted output will have the filename as `index.vue`, which can reduce the readability of the output. By configuring `extendedPathFileNames: ['index']`, the output can include the path information:
 
 ![extend-name](/features/extend-name.png)
+
+## 黑暗模式
+
+When the system is in dark mode, optimize the visual effect of the highlight output.
+
+![dark](/features/highlight-dark.png)
+
+### Setup
+
+Add `~console/theme-detect` to your project entry file. Example:
+
+::: code-group
+
+```ts [Vite]
+// main.ts
+import '~console/theme-detect'
+```
+
+```vue [Nuxt]
+<!-- app.vue -->
+<script setup lang="ts">
+import '~console/theme-detect'
+</script>
+```
+
+:::
+
+> [TypeScript configuration](/guide/configurations.html#typescript)

docs/features/pass-logs.md

@@ -4,20 +4,6 @@ The feature allows you to pass logs between server and client.
 
 > You can disable this feature by setting `disablePassLogs: true`.
 
-## TypeSciprt Configuration
-
-Add the following configurations to `tsconfig.json`:
-
-```json
-{
-  "compilerOptions": {
-    "types": [
-      "unplugin-turbo-console/client"
-    ]
-  }
-}
-```
-
 ## Initialization
 
 Add `~console` to your project entry file.
@@ -58,6 +44,8 @@ More details can be found in [source code](https://github.com/unplugin/unplugin-
 
 :::
 
+> [TypeScript configuration](/guide/configurations.html#typescript)
+
 ## Server → Client
 
 On the server side, replace `console` with `client`.

docs/guide/configurations.md

@@ -13,3 +13,25 @@
 | babelParserPlugins | `ParserPlugin[]` | `["typescript", "jsx"]` | The incoming value will be automatically merged with the default value. [All babel parser plugins](https://babeljs.io/docs/en/babel-parser#plugins) |
 | disablePassLogs      |   `boolean`   | `false` | Wheather to disable [Pass Logs](/features/pass-logs) feature |
 | silent | `boolean` | `false` | Avoid the plugin's terminal output at project startup |
+
+## TypeScript
+
+There are two ways to configure the TypeScript type:
+
+1. On `tsconfig.json` file:
+
+```json
+{
+  "compilerOptions": {
+    "types": [
+      "unplugin-turbo-console/client"
+    ]
+  }
+}
+```
+
+2. On `.d.ts` file:
+
+```ts
+/// <reference types="unplugin-turbo-console/client" />
+```

docs/zh-CN/features/highlight.md

@@ -24,3 +24,31 @@ pages
 并且在每个`index.vue`中都有一个`console`语句，在默认情况下，高亮输出中的文件名都是`index.vue`，这会导致输出结果的可读性变差。通过设置`extendedPathFileNames: ['index']`，可以让输出的文件名带上路径信息：
 
 ![extend-name](/features/extend-name.png)
+
+## 黑暗模式
+
+当系统处于黑暗模式时，优化高亮输出的视觉效果。
+
+![dark](/features/highlight-dark.png)
+
+### 设置
+
+在你应用的入口文件中引入 `~console/theme-detect`，示例：
+
+::: code-group
+
+```ts [Vite]
+// main.ts
+import '~console/theme-detect'
+```
+
+```vue [Nuxt]
+<!-- app.vue -->
+<script setup lang="ts">
+import '~console/theme-detect'
+</script>
+```
+
+:::
+
+> [TypeScript 配置](/zh-CN/guide/configurations.html#typescript)

docs/zh-CN/features/pass-logs.md

@@ -4,20 +4,6 @@
 
 > 可以通过配置项 `disablePassLogs: true` 来禁用此功能。
 
-## TypeSciprt 配置
-
-在你项目中的`tsconfig.json`中增加以下配置：
-
-```json
-{
-  "compilerOptions": {
-    "types": [
-      "unplugin-turbo-console/client"
-    ]
-  }
-}
-```
-
 ## 初始化
 
 在项目的入口文件中引入`~console`进行初始化，以下是在一些框架中的示例：
@@ -48,6 +34,8 @@ mount(() => <StartClient />, document.getElementById('app')!)
 
 :::
 
+> [TypeScript 配置](/zh-CN/guide/configurations.html#typescript)
+
 ::: details `~console` 是什么？
 
 传递日志的功能是基于 `WebSocket` 实现的，`~console` 则是一个虚拟模块，它的作用是让客户端与服务端之间建立 websocket 连接。你可以查看[源代码](https://github.com/unplugin/unplugin-turbo-console/blob/main/src/core/virtualModules.ts)了解更多细节。

docs/zh-CN/guide/configurations.md

@@ -13,3 +13,25 @@
 | babelParserPlugins | `ParserPlugin[]` | `["typescript", "jsx"]` | babel插件，传入的值会与默认值自动合并。[所有插件](https://babeljs.io/docs/en/babel-parser#plugins) |
 | disablePassLogs      |   `boolean`   | `false` | 是否禁用[传递日志](/zh-CN/features/pass-logs)功能 |
 | silent | `boolean` | `false` | 阻止项目启动时插件的终端输出 |
+
+## TypeScript
+
+有两种方式来配置 TypeScript 类型：
+
+1. 在 `tsconfig.json` 文件中:
+
+```json
+{
+  "compilerOptions": {
+    "types": [
+      "unplugin-turbo-console/client"
+    ]
+  }
+}
+```
+
+2. 在 `.d.ts` 文件中:
+
+```ts
+/// <reference types="unplugin-turbo-console/client" />
+```