我试了一下我的 uni-app-vue3-vite 模板，发现这2种都可以正常生效的。
你能提供可以复现的demo吗？

要不你参考一下我的 https://github.com/sonofmagic/uni-app-vite-vue3-tailwind-vscode-template 看看把，这里是配置好的。

我试了一下我的 uni-app-vue3-vite 模板，发现这2种都可以正常生效的。 你能提供可以复现的demo吗？

https://github.com/hfut-soft-ware/hfut-helper

就默认的home组件，我定义card的颜色的时候用bg-[#xxxxxx]就不想

要不你参考一下我的 https://github.com/sonofmagic/uni-app-vite-vue3-tailwind-vscode-template 看看把，这里是配置好的。

我试了一下还是不行

我试了一下你的项目，你要把 vwt() 放在 uni() 的后面，这个插件是有先后顺序的，到时候我会补充在我的文档里

我试了一下你的项目，你要把 vwt() 放在 uni() 的后面，这个插件是有先后顺序的，到时候我会补充在我的文档里

好的感谢

我试了一下你的项目，你要把 vwt() 放在 uni() 的后面，这个插件是有先后顺序的，到时候我会补充在我的文档里

我重新试了一下，发现可以w-[20px]但对于bg-[#xxxxxx] shadow-green-500/50 这种还是不行

我试了一下你的项目

倒是生效的

我发现了一个有趣的现象

在home组件内，有一个for循环生成的组件，在for循环中似乎bg-[#xxxx]这种会编译错误，我猜这是uni的一个bug

我看是我那个插件没起作用啊，你更换到我刚刚那个正确的插件顺序，重启一下试试呢 npm run dev:mp-weixin

我看是我那个插件没起作用啊，你更换到我刚刚那个正确的插件顺序，重启一下试试呢 npm run dev:mp-weixin

我的意思是，我试过在for循环之外的组件bg-[#123456]是可以的，但是在for循环的组件中bg-[#123456]是无效的

这样啊，我去看看编译产物哈

我找到原因了，原因实际上是因为你的 taiwindcss 的 class 是写在 js 里，结合变量做动态切换的。

这一部分js里面去 setData 切换 class 的时候，js 里的字符串，不经过转义直接修改到dom节点上了。

所以你的 bg-[#4268EA] 就变成了 bg- #4268EA
遇到这种结合变量的复杂情况，干脆直接 @apply 吧

这样啊，我去看看编译产物哈

我在其他地方试了一下for循环能不能产生颜色，发现可以正常运行

我试了一下在web上也可以一样运行，所以我感觉是我的用法问题

https://stackblitz.com/edit/vitejs-vite-auevjk?file=src%2Fmain.js&terminal=dev

或者你可以这样理解，转义只针对, 和 <style>

h5 这样写是可以的，小程序平台这样写，目前还不支持，因为h5平台，本质上都是一体的，小程序是有视图层view和逻辑层js的

h5和小程序的提取器也不同，这导致h5是都能提取的，小程序只能提取 style 和 template 标签里的内容

h5 这样写是可以的，小程序平台这样写，目前还不支持，因为h5平台，本质上都是一体的，小程序是有视图层view和逻辑层js的

h5和小程序的提取器也不同，这导致h5是都能提取的，小程序只能提取 style 和 template 标签里的内容

但我试了一下其他地方的for循环，发现是可行的

 <view v-for="color in cardsColor" :class="color">
    {{ color }}
  </view>

嗯，就一些即时编译的失效了，普通的不会失效，因为普通的转义后还是一样的
js bg-cyan-500 -> bg-cyan-500
但是 js 里的即时编译 jit 的 class
js bg-[#4268EA] -> bg- 4268EA ，导致jit生成的class失效

嗯，就一些即时编译的失效了，普通的不会失效，因为普通的转义后还是一样的 js bg-cyan-500 -> bg-cyan-500 但是 js 里的即时编译 jit 的 class js bg-[#4268EA] -> bg- 4268EA ，导致jit生成的class失效

感谢，看起来只能用@apply解决了

我在 1.3.3 里加了一主动转化方法:

import { replaceJs } from 'weapp-tailwindcss-webpack-plugin/replace'
const cardsColor = reactive([
  replaceJs('bg-[#4268EA] shadow-indigo-100'),
  replaceJs('bg-[#123456] shadow-blue-100') ,
  'bg-green-500 shadow-green-100',
  'bg-cyan-500 shadow-cyan-100',
  'bg-amber-500 shadow-amber-100',
])

然后再在 template 写

<view :key="i" class="h-[20px] w-[20px]" :class="cardsColor[i - 1]" v-for="i in 5"></view>

这样就可以生效了，可以尝试一下

跑完步去试试

同时你不用担心把代码都打进来导致体积过大，我在 'weapp-tailwindcss-webpack-plugin/replace' 中通过 tree-shaking，只暴露了2个方法，代码体积 1k左右，esm格式。