File tree Expand file tree Collapse file tree
website/docs/quick-start/v4 Expand file tree Collapse file tree Original file line number Diff line number Diff line change @@ -26,13 +26,9 @@ export default defineConfig({
2626 UnifiedViteWeappTailwindcssPlugin (
2727 {
2828 rem2rpx: true ,
29- tailwindcssPatcherOptions: {
30- patch: {
31- tailwindcss: {
32- v4: {
33- base: __dirname
34- }
35- }
29+ tailwindcss: {
30+ v4: {
31+ base: __dirname
3632 }
3733 }
3834 }
Original file line number Diff line number Diff line change 6060
6161详见 https://uniapp.dcloud.net.cn/tutorial/platform.html
6262
63+ ## css 作为配置文件
64+
65+ 由于在 ` tailwindcss@4 ` 中,配置文件默认为一个 ` css ` 文件,所以你需要显式的告诉 ` weapp-tailwindcss ` 你的入口 ` css ` 文件的绝对路径。
66+
67+ 来让 ` weapp-tailwindcss ` 和 ` tailwindcss ` 保持一致的处理模式
68+
69+ > ` cssEntries ` 为一个数组,就是你 @import "weapp-tailwindcss"; 那些文件,可以有多个
70+
71+ ``` ts
72+ {
73+ tailwindcss : {
74+ v4 : {
75+ cssEntries : [
76+ // 就是你 @import "weapp-tailwindcss"; 那个文件
77+ // 比如 tarojs
78+ path .resolve (__dirname , ' ../src/app.css' )
79+ // 比如 uni-app (没有 app.css 需要先创建,然后让 `main` 入口文件引入)
80+ // path.resolve(__dirname, './src/app.css')
81+ ]
82+ }
83+ }
84+ }
85+ ```
86+
87+ 假如不添加这个,会造成 ` tailwindcss ` 插件生成的样式,转义不了的问题。
88+
89+
6390## 使用 @apply
6491
6592如果你想在 页面或者组件独立的 ` CSS ` 模块中使用 ` @apply ` 或 ` @variant ` ,你需要使用 ` @reference ` 指令,来导入主题变量、自定义工具和自定义变体,以使这些值在该上下文中可用。
Original file line number Diff line number Diff line change @@ -33,6 +33,14 @@ import tailwindcss from '@tailwindcss/postcss'
3333 },
3434 UnifiedViteWeappTailwindcssPlugin ({
3535 rem2rpx: true ,
36+ tailwindcss: {
37+ v4: {
38+ cssEntries: [
39+ // 你 @import "weapp-tailwindcss"; 那个文件绝对路径
40+ path .resolve (__dirname , ' ../src/app.css' )
41+ ]
42+ }
43+ }
3644 })
3745 ]
3846 },
Original file line number Diff line number Diff line change @@ -51,6 +51,15 @@ import { UnifiedWebpackPluginV5 } from 'weapp-tailwindcss/webpack'
5151 plugin: UnifiedWebpackPluginV5,
5252 args: [{
5353 // 这里可以传参数
54+ rem2rpx: true ,
55+ tailwindcss: {
56+ v4: {
57+ cssEntries: [
58+ // 你 @import "weapp-tailwindcss"; 那个文件绝对路径
59+ path .resolve (__dirname , ' ../src/app.css' )
60+ ]
61+ }
62+ }
5463 }]
5564 }
5665 }
You can’t perform that action at this time.
0 commit comments