From c28aa53b8932aacd85bfc23726d8c8b339d72561 Mon Sep 17 00:00:00 2001
From: feige996 <1020102647@qq.com>
Date: Sat, 14 Jun 2025 12:47:10 +0800
Subject: [PATCH] =?UTF-8?q?docs(changelog):=20=E6=9B=B4=E6=96=B0=E5=8D=87?=
 =?UTF-8?q?=E7=BA=A7=E6=96=87=E6=A1=A3=E4=B8=AD=E7=9A=84oxlint=E5=92=8Cuno?=
 =?UTF-8?q?css=E9=85=8D=E7=BD=AE=E8=AF=B4=E6=98=8E?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

修正oxlint版本说明中的错别字并补充unocss升级的详细配置步骤，包括版本号、vite配置和引入方式
---
 docs/changelog/upgrade.md | 87 ++++++++++++++++++++++++++++++++++++++-
 1 file changed, 85 insertions(+), 2 deletions(-)

diff --git a/docs/changelog/upgrade.md b/docs/changelog/upgrade.md
index 480999f..849acb7 100644
--- a/docs/changelog/upgrade.md
+++ b/docs/changelog/upgrade.md
@@ -38,7 +38,7 @@ npx @dcloudio/uvm@latest
 ## oxlint 升级
 
 ```sh
-pnpm add -D oxlint@v1.0.0  # 主要不要贪最新，最新的 v1.1.0 有问题，会报错。
+pnpm add -D oxlint@v1.0.0  # 注意不要贪最新，最新的 v1.1.0 有问题，会报错。
 ```
 
 `package.json` 里面的 `"lint-staged"` 内容改为：
@@ -113,7 +113,90 @@ scripts: {
 
 ## unocss 升级(可选)
 
-有空再写，忙。
+1、升级 `unocss`
+
+```sh
+pnpm add -D unocss@65.4.2 # 注意不要贪最新，最新的 v1.1.0 有问题，会报错。
+```
+
+2、 更新 `vite.config.ts` 配置文件
+
+```ts
+// https://www.npmjs.com/package/@uni-helper/unocss-preset-uni
+import { presetUni } from '@uni-helper/unocss-preset-uni'
+import {
+  defineConfig,
+  presetIcons,
+  presetAttributify,
+  transformerDirectives,
+  transformerVariantGroup,
+} from 'unocss'
+
+export default defineConfig({
+  presets: [
+    presetUni({
+      attributify: {
+        // prefix: 'fg-', // 如果加前缀，则需要在代码里面使用 `fg-` 前缀，如：<div fg-border="1px solid #000"></div>
+        prefixedOnly: true,
+      },
+    }),
+    presetIcons({
+      scale: 1.2,
+      warn: true,
+      extraProperties: {
+        display: 'inline-block',
+        'vertical-align': 'middle',
+      },
+    }),
+    // 支持css class属性化
+    presetAttributify(),
+  ],
+  transformers: [
+    // 启用指令功能：主要用于支持 @apply、@screen 和 theme() 等 CSS 指令
+    transformerDirectives(),
+    // 启用 () 分组功能
+    // 支持css class组合，eg: `<div class="hover:(bg-gray-400 font-medium) font-(light mono)">测试 unocss</div>`
+    transformerVariantGroup(),
+  ],
+  shortcuts: [
+    {
+      center: 'flex justify-center items-center',
+    },
+  ],
+  rules: [
+    [
+      'p-safe',
+      {
+        padding:
+          'env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left)',
+      },
+    ],
+    ['pt-safe', { 'padding-top': 'env(safe-area-inset-top)' }],
+    ['pb-safe', { 'padding-bottom': 'env(safe-area-inset-bottom)' }],
+  ],
+  theme: {
+    colors: {
+      /** 主题色，用法如: text-primary */
+      primary: 'var(--wot-color-theme,#0957DE)',
+    },
+    fontSize: {
+      /** 提供更小号的字体，用法如：text-2xs */
+      '2xs': ['20rpx', '28rpx'],
+      '3xs': ['18rpx', '26rpx'],
+    },
+  },
+})
+```
+
+3、 更新 `vite.config.ts` 中 `unocss` 的引入方式：
+
+```ts
+export default async ({ command, mode }) => {
+  // @see https://unocss.dev/
+  const UnoCSS = (await import('unocss/vite')).default
+  // ... 其他代码
+})
+```
 
 ## vscode 配置文件升级