stylelint-config

一个可共享的 stylelint 配置包，集成了 SCSS、Vue、Prettier 和属性排序功能。

特性

• ✅ 支持 CSS 和 SCSS/Sass 文件
• ✅ 支持 Vue 单文件组件
• ✅ 集成 Prettier 自动格式化
• ✅ 自动属性排序（Recess 顺序）
• ✅ 错误检测和潜在问题提示
• ✅ 最小化配置，只包含必要规则

安装

pnpm add -D stylelint @solumon/stylelint-config

或使用 npm：

npm install --save-dev stylelint @solumon/stylelint-config

或使用 yarn：

yarn add -D stylelint @solumon/stylelint-config

前置依赖

确保你的项目中已安装以下 peer dependencies：

• stylelint (^16.0.0)
• prettier (^3.5.0)

其他依赖（stylelint-prettier、stylelint-config-recommended-scss、stylelint-config-recommended-vue、stylelint-config-recess-order 和 postcss-html）会作为 @solumon/stylelint-config 的直接依赖自动安装。

使用方法

在你的项目根目录创建或编辑 .stylelintrc.json 文件：

{
  "extends": ["@solumon/stylelint-config"]
}

或者在 package.json 中添加：

{
  "stylelint": {
    "extends": ["@solumon/stylelint-config"]
  }
}

配置说明

此配置包含 stylelint 推荐的规则集，并支持多种文件类型和功能：

• CSS/SCSS 文件：继承自 stylelint-config-recommended-scss
• Vue 文件：继承自 stylelint-config-recommended-vue
• 属性排序：使用 stylelint-config-recess-order 自动检查并排序 CSS 属性，遵循 Recess 属性顺序规范
• Prettier 集成：集成 stylelint-prettier，将 Prettier 作为 stylelint 规则运行，自动格式化代码并禁用冲突的规则
• 错误检测：检测可能的 CSS/SCSS 错误和潜在问题
• 最小化配置：只包含必要的规则，不会强制代码风格

支持的文件类型

• .css - 标准 CSS 文件，使用推荐规则集
• .scss / .sass - Sass/SCSS 文件，使用 SCSS 推荐规则集
• .vue - Vue 单文件组件中的 <style> 标签，使用 Vue 推荐规则集

详细规则请参考：

• stylelint-config-recommended-scss
• stylelint-config-recommended-vue
• stylelint-config-recess-order
• stylelint-prettier

配置示例

基础配置

{
  "extends": ["@solumon/stylelint-config"]
}

自定义规则

你可以在配置中添加自定义规则：

{
  "extends": ["@solumon/stylelint-config"],
  "rules": {
    "color-hex-length": "long",
    "declaration-block-trailing-semicolon": "always"
  }
}

版本要求

• Node.js >= 18.0.0
• stylelint >= 16.0.0
• prettier >= 3.5.0

开发

# 安装依赖
pnpm install

发布

# 构建和测试
pnpm test

# 发布到 npm（scoped 包需要添加 --access public）
npm publish --access public

贡献

欢迎提交 Issue 和 Pull Request！

License

ISC