prettier-style

prettier-style is a fool-like formatted styles tool, Support for any style of text content.

Features

• Automatic sorting css declaration. use css-declaration-sorter. css-declaration-sorter
• Detection style specification. Use stylelint. stylelint
• Automatic repair style by stylelint rules.

Quick Start

Once you have configured stylelint (e.g. you have a .stylelintrc file), start with the following code. You will find additional configuration options below.

npm install prettier-style -D
prettier-style ./*.css  --output=./

Options

• output Output file folder path after formatting.
• skip-lint Skip detection style specification.

Example

Input

body {
  width: 100rpx;
  margin-left: 48rpx;
  border-radius: 16rpx;
  height: 100rpx;
  background-color: #fff;
  position: relative;
  box-shadow: 0 0 48rpx rgba(47, 53, 66, 0.2);
  margin-right: 48rpx;
}

Output

body {
  position: relative;
  width: 100rpx;
  height: 100rpx;
  margin-right: 48rpx;
  margin-left: 48rpx;
  border-radius: 16rpx;
  background-color: #fff;
  box-shadow: 0 0 48rpx rgba(47, 53, 66, 0.2);
}

Recommended ways

use lint-staged

{
  "lint-staged": {
    "*.js": ["prettier --write", "git add"],
    "*.css": ["prettier-style", "git add"]
  }
}