本地与Azure Pipeline中npm run format:check执行结果不一致问题

我正在开发一个通过Azure DevOps部署和维护的React应用。本地执行npm run format:check时，系统提示All matched files use Prettier code style!（所有匹配文件均符合Prettier代码风格）；但在Azure Pipeline中添加npm任务，设置命令及参数为run format:check后，却显示Code style issues found in n files. Forgot to run Prettier?（发现n个文件存在代码风格问题，询问是否忘记运行Prettier）。

相关package.json配置如下：

{
  "scripts": {
    "format": "prettier --write .",
    "format:check": "prettier --check ."
  },
  "devDependencies": {
    "eslint": "^8.23.0",
    "eslint-config-airbnb": "^19.0.4",
    "eslint-config-prettier": "^8.5.0",
    "eslint-config-react-app": "^7.0.1",
    "eslint-plugin-import": "^2.26.0",
    "eslint-plugin-jsx-a11y": "^6.6.1",
    "eslint-plugin-prettier": "^4.2.1",
    "eslint-plugin-react": "^7.31.8",
    "eslint-plugin-react-hooks": "^4.6.0",
    "husky": "^8.0.1",
    "jest-editor-support": "^30.1.0",
    "lint-staged": "^13.0.3",
    "playwright": "^1.25.2",
    "prettier": "^2.7.1",
    "sass": "^1.54.4"
  }
}

可能的原因及解决方法 #

1. 换行符格式差异 #

本地和Azure Pipeline环境的换行符设置不同（Windows默认CRLF，Linux/macOS默认LF），Prettier会把这种换行符差异识别为格式问题。

• 解决方法：
  在项目根目录添加.prettierrc文件，明确指定换行符：

  {
    "endOfLine": "lf"
  }
  

  同时在仓库的.gitattributes文件中添加规则，确保Git在不同环境下统一使用LF换行符：

  * text=auto eol=lf
  

2. Prettier版本不一致 #

本地安装的Prettier版本和Pipeline中安装的版本可能存在细微差异，导致格式校验结果不统一。

• 解决方法：
  • 把package.json中prettier的版本号改成固定值（去掉^前缀，比如"prettier": "2.7.1"）；
  • 在Pipeline的npm任务中执行npm ci而非npm install，确保安装的依赖版本和package-lock.json完全一致。

3. Pipeline中文件未被正确格式化 #

可能本地提交代码前没运行npm run format，或者Pipeline执行过程中有步骤修改了源代码（比如构建脚本生成的文件）。

• 解决方法：
  • 确保husky和lint-staged配置生效，提交代码前自动运行Prettier格式化，避免未格式化的文件被提交；
  • 检查Pipeline流程，如果有修改源代码的步骤，需要在修改后重新运行npm run format再执行校验。

4. 忽略文件配置问题 #

本地的.prettierignore文件可能排除了某些文件，但该文件没提交到仓库，或者Pipeline拉取的代码中包含了本地忽略的文件。

• 解决方法：
  • 确保.prettierignore已经提交到仓库；
  • 检查.prettierignore规则，确保排除了构建产物、node_modules等不需要校验的文件。

内容的提问来源于stack exchange，提问作者Abhishek Konnur