跳至内容

自动完成

自动完成可以在 UnoCSS 的智能建议中进行自定义,在 游乐场VS Code 扩展 中。

ts
autocomplete: {
  templates: [
    // theme inferring
    'bg-$color/<opacity>',
    // short hands
    'text-<font-size>',
    // logic OR groups
    '(b|border)-(solid|dashed|dotted|double|hidden|none)',
    // constants
    'w-half',
  ],
  shorthands: {
    // equal to `opacity: "(0|10|20|30|40|50|60|70|90|100)"`
    'opacity': Array.from({ length: 11 }, (_, i) => i * 10),
    'font-size': '(xs|sm|base|lg|xl|2xl|3xl|4xl|5xl|6xl|7xl|8xl|9xl)',
    // override built-in short hands
    'num': '(0|1|2|3|4|5|6|7|8|9)',
  },
  extractors: [
      // ...extractors
  ],
}
  • templates 使用简单的 DSL 来指定自动完成建议。

  • shorthands 是一个将简写名称映射到其模板的映射。如果它是一个 Array,它将是一个逻辑 OR 组。

  • extractors 用于获取可能的类并将类名样式建议转换为正确的格式。例如,你可以查看我们如何实现 attributify 自动完成提取器

  • 有关更多帮助,请参考 这里

根据 MIT 许可发布。