如何配置Prettier或Stylelint自动修复CSS/SCSS文件中缺失的分号？

别着急，Prettier 和 Stylelint 其实都能自动帮你补全CSS/SCSS行尾缺失的分号，问题大概率出在你的配置没开对或者没启用修复功能上。下面给你一步步讲清楚怎么设置：

一、Prettier 配置 #

Prettier 默认就会自动为代码末尾添加分号，但如果你的配置里手动关闭了这个功能，就会出现能检测问题但不修复的情况。

打开你的 .prettierrc（或 .prettierrc.json），确保包含以下核心配置：

{
  "semi": true,
  // 下面是可选配置，根据你的代码风格偏好调整
  "singleQuote": true,
  "printWidth": 80
}

• semi: true 是关键设置，开启后 Prettier 会自动给所有需要的行末尾补加分号。
• 配置完成后，运行命令 prettier --write . 就能批量修复所有文件；如果用编辑器集成（比如VS Code的Prettier插件），记得开启「保存时格式化」的选项。

二、Stylelint 配置 #

Stylelint 需要启用专门的规则来检测并修复缺失的分号，核心规则是 declaration-block-trailing-semicolon。

1. 打开你的 .stylelintrc（或 .stylelintrc.json），添加或修改规则：

{
  "extends": "stylelint-config-standard", // 可选，用标准配置作为基础风格
  "rules": {
    "declaration-block-trailing-semicolon": "always"
  }
}

• declaration-block-trailing-semicolon: "always" 强制要求声明块末尾必须有分号，并且支持自动修复。

2. 运行修复命令：stylelint "**/*.{css,scss}" --fix，或者在编辑器插件里开启「保存时自动修复」。

三、常见排查点 #

• 如果你用VS Code，要确保Prettier、Stylelint插件已经安装并启用，且在编辑器设置里打开了「Editor: Format On Save」选项。
• 检查有没有其他格式化工具的配置和这两个工具冲突，比如部分自定义插件可能会覆盖默认的修复逻辑。

内容的提问来源于stack exchange，提问作者The Wormple