美文网首页
StyleLint 的配置与注意的点

StyleLint 的配置与注意的点

作者: 梧桐月明中 | 来源:发表于2020-07-29 17:43 被阅读0次

    lint 用于确保代码风格,根据配置的代码规范,进行检查。
    stylelint 用于样式规范检查与修复,支持 .css .scss .less .sss


    配置过程

    npm 安装所需要的包

    npm i stylelint stylelint-config-standard -D
    

    添加配置文件

    .stylelintrc

    {
      "extends": "stylelint-config-standard",
      "rules": {
        "indentation": 4"
      }
    }
    

    在 package.json 中添加 script 命令

    {
      "scripts":  {
        "stylelint": "stylelint {components,example}/**/*.{css,scss}",
        "stylelint_fix": "stylelint {components,example}/**/*.{css,scss} --fix"
      }
    }
    

    遇到的问题

    1.stylelint 不支持缩进风格

    注意 stylelint 默认支持 css 格式风格的 .css .scss .less .sss,并且没有官方插件支持缩进风格的 .sass .styl
    本来想用 stylus,无奈没找到靠谱的插件。

    2.cli 中的 stylelint 命令必须指定文件夹名称

    刚开始 npm 的 script 配置如下,结果 lint 不生效

    "lint:stylelint": "stylelint **/*.{css,scss}"
    

    改成下面这样就好了

    "lint:stylelint": "stylelint {components,example}/**/*.{css,scss}"
    

    最后附上规则地址

    stylelint rules 中文: http://stylelint.cn/user-guide/rules/
    stylelint rules 中文: https://cloud.tencent.com/developer/section/1489630

    相关文章

      网友评论

          本文标题:StyleLint 的配置与注意的点

          本文链接:https://www.haomeiwen.com/subject/zltkrktx.html