diantou/stylelint.config.js

/* eslint-disable filenames/match-regex */
module.exports = {
  extends: [
    // Use the Standard config as the base
    // https://github.com/stylelint/stylelint-config-standard
    'stylelint-config-standard',
    // Enforce a standard order for CSS properties
    // https://github.com/stormwarning/stylelint-config-recess-order
    'stylelint-config-recess-order',
    // Override rules that would interfere with Prettier
    // https://github.com/shannonmoeller/stylelint-config-prettier
    'stylelint-config-prettier',
    // Override rules to allow linting of CSS modules
    // https://github.com/pascalduez/stylelint-config-css-modules
    'stylelint-config-css-modules',
  ],
  plugins: [
    // Bring in some extra rules for SCSS
    'stylelint-scss',
    'stylelint-no-unsupported-browser-features',
    'stylelint-declaration-use-variable',
  ],
  // Rule lists:
  // - https://stylelint.io/user-guide/rules/
  // - https://github.com/kristerkari/stylelint-scss#list-of-rules
  rules: {
    'no-empty-source': null,
    // Allow newlines inside class attribute values
    'string-no-newline': null,
    // Enforce camelCase for classes and ids, to work better
    // with CSS modules
    'selector-class-pattern': [
      /^(vuecal__)?[a-z-]+$/,
      {
        message: 'class名只能使用小写字母和“-”\n',
      },
    ],
    'selector-id-pattern': [
      /^[a-z-]+$/,
      {
        message: 'id名只能使用小写字母和“-”\n',
      },
    ],
    // Limit the number of universal selectors in a selector,
    // to avoid very slow selectors
    'selector-max-universal': 1,
    // Disallow allow global element/type selectors in scoped modules
    'selector-max-type': [0, { ignore: ['child', 'descendant', 'compounded'] }],
    // ===
    // SCSS
    // ===
    'scss/dollar-variable-colon-space-after': 'always',
    'scss/dollar-variable-colon-space-before': 'never',
    'scss/dollar-variable-no-missing-interpolation': true,
    'scss/dollar-variable-pattern': /^[a-z-]+$/,
    'scss/double-slash-comment-whitespace-inside': 'always',
    'scss/operator-no-newline-before': true,
    'scss/operator-no-unspaced': true,
    'scss/selector-no-redundant-nesting-selector': true,
    // Allow SCSS and CSS module keywords beginning with `@`
    'at-rule-no-unknown': null,
    'scss/at-rule-no-unknown': true,
    // scss 嵌套的优先级计算有问题
    'no-descending-specificity': null,
    // 检测浏览器不支持的特性
    'plugin/no-unsupported-browser-features': [
      true,
      {
        severity: 'warning',
        ignore: [
          'user-select-none',
          'css3-cursors',
          'flexbox',
          'calc',
          'css-resize',
          'viewport-units',
        ],
      },
    ],
    // 禁止使用important
    'declaration-no-important': [
      true,
      {
        message: '禁止使用important，导致项目覆盖样式困难\n',
      },
    ],
    // 禁止使用厂商前缀(postCSS会自动处理)，如-webkit-
    'at-rule-no-vendor-prefix': [
      true,
      {
        message: '禁止使用厂商前缀，postCSS会自动处理\n',
      },
    ],
    'media-feature-name-no-vendor-prefix': [
      true,
      {
        message: '禁止使用厂商前缀，postCSS会自动处理\n',
      },
    ],
    'value-no-vendor-prefix': [
      true,
      {
        message: '禁止使用厂商前缀，postCSS会自动处理\n',
      },
    ],
    'property-no-vendor-prefix': [
      true,
      {
        message: '禁止使用厂商前缀，postCSS会自动处理\n',
      },
    ],
    'selector-no-vendor-prefix': [
      true,
      {
        message: '禁止使用厂商前缀，postCSS会自动处理\n',
      },
    ],
    // 禁止直接使用绝对大小的字号
    'declaration-property-unit-disallowed-list': [
      {
        'font-size': ['pt', 'px'],
        'line-height': ['pt', 'px'],
      },
      {
        message: `主题中会更改字号，所以font-size需要引用相关变量，如$font-size-base、$font-size-lg\nline-height请使用相对值，如1.5\n`,
      },
    ],
    // 禁止直接使用色值。应该使用主题中的变量
    'sh-waqar/declaration-use-variable': [
      [
        '/color/',
        'font-family',
        {
          ignoreValues: ['currentColor', 'inherit', 'transparent', 'initial'],
        },
      ],
      {
        message: `主题中会更改颜色和字体，所以需要引用相关变量，如$primary-color、$component-background\n`,
      },
    ],
  },
  ignoreFiles: ['**/*.js', 'public/*.*', 'src/common/design/index.scss', 'src_custom/www/**/*.*'],
}