在App.vue 文件的公共 CSS 部位添加添加这三行,引入 tailwindcss 库,注:style标签中的scoped 需要删除,不然不是全局CSS @tailwind base; @tailwind components; @tailwind utilities; 安装好以后可以直接使用了,下面是安装的教程,演示一下。 还有就是因为tialwindcss使用的 rem 换成 rpx ,我看了一下好像不用换也...
npm install -D tailwindcss postcss autoprefixer 2、初始化tainwind配置文件 npx tailwindcss init -p 3、在 tailwind.config.js 中写入 /** @type {import('tailwindcss').Config} */module.exports={content:['./index.html','./src/**/*.{js,ts,jsx,tsx,vue}'],theme:{extend:{},},plugins:[...
下图为第三方预设的配置 输入时/使用-div-代替了.使用-dot-代替了 使用 包含/与.的tailwindcss class会被 postcss.config.js 文件设置的重命名 拆分而失效 使用代替字符则生效 第三方预设 rem被rpx替换 rootValue 标识 1rem 对应 32rpx 如果不使用第三方预设 可以在 tailwind.config.js 文件 直接配置 theme属性 ...
设置whRpx为false,修改默认单位,按 rem 规则递增 unocss.config.ts import presetWeapp from 'unocss-preset-weapp' export default defineConfig({ presets: [ presetWeapp({ whRpx: false, }), ], }) .text-20 { font-size: 160rpx; } .h-10 { height: 80rpx; } .top-10 { top: 160rpx; ...
如果想用width:750rpx; -> class="w-[750rpx]" 不仅是宽度、宽度、边距、填充都是这样需要加上rpx在H5会编译成rem在小程序会编译成rpx 在Tailwind CSS 里面颜色透明度也不用那么麻烦 和H5里面一样的使用 比如text-red-500/25 0.25透明度 后面的值也不是随便填的具体看这里 ...
技术栈:vue3+js+Tailwind css + Monorepo包管理工具 一. uni-popup-dialog IOS下出现自动弹出软键盘的现象 网上很多解决方法都是 改uni-popup-dialog源码之类的,感觉都是治标不治本, 我的解决方法是不用自带的输入框!!!要用自定义的!!! 错误示例 看👇 ...
@unocss-applet/preset-rem-rpx Coverts rem <=> rpx for utils. zguolee •0.8.5•2 months ago•1dependents•MITpublished version0.8.5,2 months ago1dependentslicensed under $MIT 3,481 @uni-helper/uni-env 在uni-app 中优雅地判断当前环境。
transformUnit: "rpx", }) ); postcssPlugins.push(postcssWeappTailwindcssRename()); } // https://vitejs.dev/config/ export default defineConfig({ plugins: vitePlugins, plugins: vitePlugins, resolve: { alias: { "@": resolve(__dirname, "/src"), @@ -34,22 +46,7 @@ export ...
PostCSS Uniapp Tailwindcss PostCSSplugin use tailwindcss in uniapp. /* Input example */.foo{width:2px;height:1rem; } .w-1\/2,.w-0\.5 { } /* Output example */.foo{width:4rpx;height:32rpx; } .w-1_2,.w-0_5{ } Usage ...
安装TailWindCSS 安装插件 使用 参数 uni-app taro remax tailwind.config.js 原生支持 测试 Qa tailwind-one 使用tailwindcss一把梭界面(小程序、H5、快应用等) 当前支撑为postcss-7 可支持8 参数 参数描述 platform平台,默认 h5,其他值为 mp、native