Skip to content

好用的 Windicss

Published: at 01:14 PMSuggest Changes

不想在项目中写 css 了,就试了一下 windicss,非常好使

比如 padding: 10px; classname 可以写成 p-10px

还可以自定义配置

import { defineConfig } from 'windicss/helpers';

function range(size, startAt = 1) {
  return Array.from(Array(size).keys()).map(i => i + startAt);
}

function rangeObj(size, startAt = 1) {
  return range(size, startAt).reduce((acc, i) => {
    acc[i + 'px'] = i + 'px';
    return acc;
  }, {});
}

export default defineConfig({
  theme: {
    fontSize: rangeObj(30, 8),
    fontFamily: {
      pingfang: ['PingFang SC']
    },
    extend: {
      colors: {
        // 'xxxx-333': '#333333'
        xxxx: {
          default: '#378D93',
          333: '#333333'
        }
      }
    }
  }
});


Previous Post
JavaScript 保存文件的几种方法
Next Post
JS Quilljs 与其他富文本编辑器的比较