有些 CSS 变量不支持吗？我看 Tailwind 是支持的，但 uni-app 在 app 端实际渲染出来不支持。

[sonofmagic]

trafficstars

Discussed in https://github.com/sonofmagic/weapp-tailwindcss/discussions/658

^{Originally posted by ZCY-G June 24, 2025} 我在 @theme {} 中定义了一些变量：

  --color-neutral-1B: #1b1b1b;
  --color-neutral-66: #666666;
  --color-neutral-99: #999999;
  --color-neutral-BB: #bbbbbb;
  --color-neutral-EE: #eeeeee;
  --color-neutral-F8: #f8f8f8;
  --color-neutral-FF: #ffffff;

在 Tailwind Play 看了是生效的，但在 uni-app 中渲染成 app ，只有 66 和 99 有颜色，其他最后一部分有字母的都没有背景颜色。

不知道 weapp-tailwindcss 版本和 tailwindcss 版本是否需要一致？如果有要求，可以加一个 peerDependencies。

    "@dcloudio/uni-app": "3.0.0-4050720250324001",
    "@dcloudio/uni-app-harmony": "3.0.0-4050720250324001",
    "@dcloudio/uni-app-plus": "3.0.0-4050720250324001",
    "@dcloudio/uni-components": "3.0.0-4050720250324001",
    "@dcloudio/uni-h5": "3.0.0-4050720250324001",
    "@dcloudio/uni-mp-alipay": "3.0.0-4050720250324001",
    "@dcloudio/uni-mp-baidu": "3.0.0-4050720250324001",
    "@dcloudio/uni-mp-harmony": "3.0.0-4050720250324001",
    "@dcloudio/uni-mp-jd": "3.0.0-4050720250324001",
    "@dcloudio/uni-mp-kuaishou": "3.0.0-4050720250324001",
    "@dcloudio/uni-mp-lark": "3.0.0-4050720250324001",
    "@dcloudio/uni-mp-qq": "3.0.0-4050720250324001",
    "@dcloudio/uni-mp-toutiao": "3.0.0-4050720250324001",
    "@dcloudio/uni-mp-weixin": "3.0.0-4050720250324001",
    "@dcloudio/uni-mp-xhs": "3.0.0-4050720250324001",
    "@dcloudio/uni-quickapp-webview": "3.0.0-4050720250324001",
    "@dcloudio/uni-ui": "^1.5.7",
    "tailwindcss": "^4.1.9",
    "weapp-tailwindcss": "^4.1.9"

// vite.config.ts

import { defineConfig } from 'vite';
import uni from '@dcloudio/vite-plugin-uni';
import tailwindcss from '@tailwindcss/postcss';
import path from 'path';
import AutoImport from 'unplugin-auto-import/vite';
import { UnifiedViteWeappTailwindcssPlugin as uvwt } from 'weapp-tailwindcss/vite';

// 注意： 打包成 h5 和 app 都不需要开启插件配置
const isH5 = process.env.UNI_PLATFORM === 'h5';
const isApp = process.env.UNI_PLATFORM === 'app';
const WeappTailwindcssDisabled = isH5 || isApp;

const resolve = (p) => {
  return path.resolve(__dirname, p);
};
export default defineConfig(async () => {
  return {
    envDir: './env',
    css: {
      postcss: {
        plugins: [
          tailwindcss({
            base: __dirname
          })
        ]
      },
      preprocessorOptions: { scss: { silenceDeprecations: ['legacy-js-api'] } }
    },
    plugins: [
      uni(),
      uvwt({
        rem2rpx: true,
        disabled: WeappTailwindcssDisabled,
        tailwindcssPatcherOptions: {
          patch: {
            tailwindcss: {
              v4: {
                base: __dirname
              }
            }
          }
        },
        injectAdditionalCssVarScope: true
      }),
      AutoImport({
        imports: ['vue', 'uni-app'], // 自动导入 Vue 和 UniApp 的 API
        dts: 'src/types/auto-imports.d.ts', // 自动生成类型声明文件
        eslintrc: {
          enabled: true, // 生成 ESLint 配置文件
          filepath: './.eslintrc-auto-import.json' // ESLint 配置文件路径
        }
      })
    ]
  };
});

```</div>