最常见原因是glob路径在不同shell环境解析不一致,应改用单引号包裹如npx stylelint '*/.css';需确保插件安装、Node版本统一、显式加--max-warnings 0,并校验customSyntax与包名完全匹配。

CI里npx stylelint命令不执行或报错路径不匹配
最常见原因是glob路径在不同shell环境(如GitHub Actions的ubuntu-latest vs 本地zsh)下解析行为不一致。直接写npx stylelint "**/*.{css,scss}"在某些CI镜像中会被shell提前展开失败,导致“No files matching the pattern were found”。
实操建议:
立即学习“前端免费学习笔记(深入)”;
- 显式用单引号包裹glob:改为
npx stylelint '**/*.{css,scss}',避免shell展开 - 若仍报错,退回到逐个扩展名枚举:
npx stylelint 'src/**/*.css' 'src/**/*.scss' 'src/**/*.vue' - 确保
package.json中stylelint和所有插件(如stylelint-scss)都列为devDependencies,CI默认不装dependencies外的包
CI检查通过但本地提交被拦住,或反之
根本原因通常是Node版本或依赖解析差异。Stylelint插件(尤其是stylelint-config-html、stylelint-scss)对peerDependencies敏感,Node 18和20对resolve算法处理略有不同。
实操建议:
立即学习“前端免费学习笔记(深入)”;
- CI配置中显式指定Node版本,与团队本地
.nvmrc或engines.node一致,例如GitHub Actions加node-version: '20.17' - CI脚本开头加
npm ci --no-audit而非npm install,确保依赖树完全一致 - 运行时强制指定
--max-warnings 0,否则警告(warning)不会使CI失败,起不到拦截作用
自定义语法(如CSS-in-JS)在CI中解析失败
比如emotion或styled-components文件里写css`color: red`,CI报Unknown word,而本地不报——大概率是customSyntax没装或字符串不匹配。
实操建议:
立即学习“前端免费学习笔记(深入)”;
- 确认
.stylelintrc.cjs中overrides段已正确设置customSyntax: 'postcss-css-in-js'(注意不是postcss-js或@stylelint/postcss-css-in-js) - CI中必须
npm install -D postcss-css-in-js,该包名必须与customSyntax字符串完全一致 - 如果用了
stylelint-config-html,同样要npm install -D postcss-html,且customSyntax设为'postcss-html'
忽略文件在CI中失效
.stylelintrc.cjs里的ignoreFiles只影响CLI扫描路径,不影响编辑器插件,更不会让CI跳过某些目录。如果你的CI构建产物(如dist/*.css)也被扫到并报错,说明忽略逻辑没生效。
实操建议:
立即学习“前端免费学习笔记(深入)”;
- 不要依赖
ignoreFiles做CI过滤,改用lint-staged或CI脚本限定路径,例如只跑npx stylelint 'src/**/*.{css,scss}' - 真要忽略,用
.stylelintignore文件(支持glob),内容写dist/**、node_modules/**,它对CLI和CI都有效 - 注意
.stylelintignore路径基于项目根目录,不能写相对路径如./dist
customSyntax字符串拼错、--max-warnings 0漏加、或者postcss-xxx包名和配置项不一致——这些细节不报明确错误,只静默失败。


















