uno.config.ts 1.0 KB

123456789101112131415161718192021222324252627282930
  1. import {
  2. defineConfig,
  3. presetAttributify,
  4. presetIcons,
  5. presetMini,
  6. presetUno,
  7. } from 'unocss'
  8. // 刚使用unocss的朋友,可以借助这个工具: https://to-unocss.netlify.app
  9. export default defineConfig({
  10. presets: [
  11. presetUno,
  12. presetAttributify,
  13. presetIcons(),
  14. // 为什么要用到这个插件?
  15. // 模板使用 viewport 作为移动端适配方案,unocss 默认单位为 rem
  16. // 所以需要转成 px,然后由 postcss 把 px 转成 vw/vh,完成适配
  17. //presetRemToPx({
  18. // 这里为什么要设置基础字体大小?看下面这篇文章
  19. // https://juejin.cn/post/7262975395620618298
  20. // baseFontSize: 4,
  21. // }),
  22. presetMini(),
  23. ],
  24. shortcuts: [
  25. // shortcuts to multiple utilities
  26. ['btn', 'px-6 py-3 rounded-3 border-none inline-block bg-green-400 text-white cursor-pointer !outline-none hover:bg-green-600 disabled:cursor-default disabled:bg-gray-600 disabled:opacity-50'],
  27. ],
  28. })