由于hbuilderx更新之后,它和tailwindcss v2的热更新产生了冲突,导致了 #9 这个问题。
想要绕过,你可以使用 vue3 版本,或者使用 vue2 的 cli 版本,它们都可以使用最新的 tailwindcss v3 版本!
此版本废弃!!
注意(重要):此版本由于目前 hbuilderX 含(alpha)版本,针对 webpack
打包的项目,只能使用 postcss7
无法使用最新的 postcss8
,导致这个模板只能使用 tailwindcss v2
,相比 tailwindcss v3
,失去了许多的功能特性。所以建议你使用:
-
vue3 vite vscode模板 uni-app-vite-vue3-tailwind-vscode-template
-
vue2 vscode模板 uni-app-vue2-tailwind-vscode-template
-
vue3 HbuilderXuni-app-vue3-tailwind-hbuilder-template
这是一个使用 hbuilderx
+ uni-app
+ vue2
+ tailwind
构建的小程序模板。可以直接在 hbuilderx
中导入运行。
先在项目目录下,执行 yarn
进行安装,然后在 hbuilderx
中打开项目,进行运行和发布。
在项目里面添加目录,在里面写 .vue
文件的时候,记得更新 tailwind.config.js
的 content
数组,把新的目录包裹进去。不然 tailwindcss
是不会生成添加的目录里面的 class
的!
比如你添加一个 components
文件夹,你就在 content
加入 resolve("./components/**/*.{vue,js,ts,jsx,tsx,wxml}"),
, 小程序分包同理。
DCloud-HBuilderX团队提供了对应的插件,可以去
https://ext.dcloud.net.cn/plugin?id=8560 进行下载,即可产生智能提示。
weapp-tailwindcss-webpack-plugin 提供转义功能,欢迎 fork
/star
weapp-ide-cli: 一个微信开发者工具命令行,快速方便的直接启动 ide 进行登录,开发,预览,上传代码等等功能。
uni-app-vite-vue3-tailwind-vscode-template
uni-app-vue3-tailwind-vscode-template
uni-app-vue2-tailwind-vscode-template
weapp-native-mina-tailwindcss-template
tailwindcss-miniprogram-preset
目前这个插件正在快速的开发中,如果遇到 Bug
或者想提出 Issue