stylefmt 一个自动格式化CSS工具

举报
搞前端的半夏 发表于 2021/11/30 22:36:37 2021/11/30
2.8k+ 0 0
【摘要】 stylefmtstylefmt 是一个根据stylelint规则自动格式化 CSS 的工具。 优势更易于编写:在考虑黑客攻击的时候,永远不用担心次要的格式化问题,stylefmt已经为你解决。更易于阅读:使用本工具将其他作者的CSS文件进行格式化,格式化之后的代码更加易于阅读。更易于维护:机械化的格式CSS文件,保证了格式的前后一致性。无可争议:永远不要再就间距等各种问题争论。 功能支持...

stylefmt

stylefmt 是一个根据stylelint规则自动格式化 CSS 的工具。

优势

  • 更易于编写:在考虑黑客攻击的时候,永远不用担心次要的格式化问题,stylefmt已经为你解决。
  • 更易于阅读:使用本工具将其他作者的CSS文件进行格式化,格式化之后的代码更加易于阅读。
  • 更易于维护:机械化的格式CSS文件,保证了格式的前后一致性。
  • 无可争议:永远不要再就间距等各种问题争论。

功能

  • 支持最新的 CSS 语法: 包括自定义属性、更复杂的媒体查询,calc()和嵌套。
  • 理解类 CSS 的语法:  stylefmt 由PostCSS提供支持,因此它理解 PostCSS 可以解析的任何语法,包括 SCSS。
  • 与 stylelint 配合良好:  stylelint是一个强大的现代 CSS linter。stylefmt 可以理解您的 stylelint 配置文件 ( .stylelintrc) 中指定的格式规则。

使用

npm install stylefmt

用法

在命令行中

命令行帮助:

$ stylefmt --help
Usage: stylefmt [options] input-name [output-name]

Options:

  -b, --config-basedir   Path to the directory that relative paths defining "extends"
  -c, --config           Path to a specific configuration file (JSON, YAML, or CommonJS)
  -d, --diff             Output diff against original file
  -r, --recursive        Format list of space seperated files(globs) in place
  -v, --version          Output the version number
  -h, --help             Output usage information
  -i, --ignore-path      Path to a file containing patterns that describe files to ignore.
  --stdin-filename       A filename to assign stdin input.

基本规则

  • 2个空格缩进
  • 在简单的选择器和组合器之间需要 1 个空格
  • 选择器和选择器之间需要 1 个空格
  • {之后需要换行
  • 属性和 :之间不允许存在空格
  • :和值之间需要 1 个空格
  • 声明后需要换行
  • 在最后一次声明中要求;
  • 值和值之间需要 1 个空格
  • 不允许!important之间有任何空格
  • 在规则之间留 1 个空行
  • 在 atrules 中的规则之间留 1 个空行
  • 禁止@import之间有任何空行
【声明】本内容来自华为云开发者社区博主,不代表华为云及华为云开发者社区的观点和立场。转载时必须标注文章的来源(华为云社区)、文章链接、文章作者等基本信息,否则作者和本社区有权追究责任。如果您发现本社区中有涉嫌抄袭的内容,欢迎发送邮件进行举报,并提供相关证据,一经查实,本社区将立刻删除涉嫌侵权内容,举报邮箱: cloudbbs@huaweicloud.com
  • 点赞
  • 收藏
  • 关注作者

作者其他文章

评论(0

抱歉,系统识别当前为高风险访问,暂不支持该操作

    全部回复

    上滑加载中

    设置昵称

    在此一键设置昵称,即可参与社区互动!

    *长度不超过10个汉字或20个英文字符,设置后3个月内不可修改。

    *长度不超过10个汉字或20个英文字符,设置后3个月内不可修改。