stylelint-wechat-work-css

Special stylelint rules for WeChat at Work project css. 企业微信项目 Stylelint 自定义规则

Install

npm i stylelint-wechat-work-css -D

Rules

• comments-in-header: SCSS 文件的文件头部必须要有注释,并包含 @date 跟 @author 的基本信息
• selector-namespace-follow-filename: 业务CSS 的命名空间需要跟随文件名
• unused-mixins: 因项目历史原因废弃不用的 minxins
• unused-nested-selector-namespace：子选择器不能使用特定命名空间的类名（本项目为qui_xxx）
• declaration-use-variable：一些声明使用Sass 变量

Usege

Add stylelint-wechat-work-css to your stylelint config plugins array, then add rules you need to the rules object.

Example:

{
  'plugins': [
    'stylelint-wechat-work-css'
  ],
  'rules': {
    'wechat-work/unused-mixins':
      [
        '/^transition/',
        '/^transform/',
        '/^translate/',
        '/^scale/',
        '/^rotate/',
        '/^animation/',
        'box-sizing',
        'box_sizing',
        'inlineBlock',
        'box-shadow',
        'box_shadow',
        'opacity',
        'keyframes'
      ],
    'wechat-work/comments-in-header': true,
    'wechat-work/selector-namespace-follow-filename': [true, {
      'fileDirWhiteList': ['reg-word', 'ignore-filedir', 'mobile', '/^widget/', 'component'],
      'filenameWhitelist': ['/^reg-word/', 'ignore-filename']
    }
    ],
    'wechat-work/unused-nested-selector-namespace': true,
    'wechat-work/declaration-use-variable': true,
  }
}

Contributing

Inspired from stylelint-suitcss.

Issues and Pull requests are welcome.