uno.config.ts 3.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101
  1. /*
  2. * @Author: wjc
  3. * @Date: 2023-05-07 20:59:28
  4. * @LastEditors: LiZhiWei
  5. * @LastEditTime: 2026-01-15 15:04:36
  6. * @Description:
  7. */
  8. import {
  9. defineConfig,
  10. presetUno,
  11. presetIcons,
  12. transformerDirectives,
  13. transformerVariantGroup,
  14. } from 'unocss'
  15. import { FileSystemIconLoader } from '@iconify/utils/lib/loader/node-loaders'
  16. import iconList from './app/utils/icons'
  17. export default defineConfig({
  18. presets: [
  19. presetUno(),
  20. presetIcons({
  21. scale: 1.2,
  22. extraProperties: {
  23. display: 'inline-block',
  24. },
  25. // cdn: 'https://esm.sh/'
  26. collections: {
  27. custom: FileSystemIconLoader('./app/assets/icons'),
  28. ep: () => import('@iconify-json/ep/icons.json').then((i) => i.default),
  29. },
  30. }),
  31. ],
  32. transformers: [transformerDirectives(), transformerVariantGroup()],
  33. rules: [
  34. [/^m-h-(.+)$/, ([, d]) => ({ 'margin-left': `${d}`, 'margin-right': `${d}` })],
  35. [/^m-v-(.+)$/, ([, d]) => ({ 'margin-top': `${d}`, 'margin-bottom': `${d}` })],
  36. [/^p-h-(.+)$/, ([, d]) => ({ 'padding-left': `${d}`, 'padding-right': `${d}` })],
  37. [/^p-v-(.+)$/, ([, d]) => ({ 'padding-top': `${d}`, 'padding-bottom': `${d}` })],
  38. [/^max-w-(\s+)$/, ([, d]) => ({ 'max-width': `${d}` })],
  39. [/^min-w-(\s+)$/, ([, d]) => ({ 'min-width': `${d}` })],
  40. [/^max-h-[(\s+)]$/, ([, d]) => ({ 'max-height': `${d}` })],
  41. [/^min-h-[(\s+)]$/, ([, d]) => ({ 'min-height': `${d}` })],
  42. [/^font-s-(\d+(\.\d+)?\w+)$/, ([, d]) => ({ 'font-size': `${d}` })],
  43. [/^wh-(.+)$/, ([, d]) => ({ width: `${d}`, height: `${d}` })],
  44. [/^bg-color-(\d+)$/, ([, d]) => ({ 'background-color': `${d}` })],
  45. ],
  46. safelist: iconList,
  47. shortcuts: {
  48. 'wh-full': 'w-full h-full',
  49. 'mp-0': 'm-0 p-0',
  50. 'ma-x': 'mt-0 mb-0 ml-auto mr-auto',
  51. 'inline-flex-center': 'inline-flex justify-center items-center',
  52. 'flex-center': 'flex justify-center items-center',
  53. 'flex-x-center': 'flex justify-center',
  54. 'flex-y-center': 'flex items-center',
  55. // 文本溢出显示省略号
  56. 'text-overflow': 'overflow-hidden whitespace-nowrap text-ellipsis',
  57. // 文本溢出换行
  58. 'text-break': 'whitespace-normal break-all break-words',
  59. },
  60. theme: {
  61. breakpoints: {
  62. xs: '480px',
  63. sm: '768px',
  64. md: '992px',
  65. lg: '1200px',
  66. xl: '1920px',
  67. xxl: '3840px',
  68. },
  69. colors: {
  70. primary: 'var(--primary-color)',
  71. 'primary-2': 'var(--primary-color-2)',
  72. success: 'var(--success-color)',
  73. warning: 'var(--warning-color)',
  74. danger: 'var(--danger-color)',
  75. error: 'var(--error-color)',
  76. info: 'var(--info-color)',
  77. color: {
  78. '1': 'var(--text-color-1)',
  79. '2': 'var(--text-color-2)',
  80. '3': 'var(--text-color-3)',
  81. 4: 'var(--bg-color-4)',
  82. place: 'var(--text-color-place)',
  83. disabled: 'var(--text-color-disabled)',
  84. whiter: 'var(--text-color-whiter)',
  85. },
  86. bg: {
  87. color: 'var(--bg-color)',
  88. 1: 'var(--bg-color-1)',
  89. 2: 'var(--bg-color-2)',
  90. 3: 'var(--bg-color-3)',
  91. 4: 'var(--bg-color-4)',
  92. page: 'var(--bg-page)',
  93. place: 'var(--text-color-place)',
  94. divider: 'var(--bg-divider)',
  95. overlay: 'var(--bg-overlay)',
  96. primary: 'var(--primary-color)',
  97. },
  98. },
  99. },
  100. })