# @isludy/postcss-unit-parser

> webpack插件：用于将自定义单位转vw或rem

Latest version **1.0.4** (published 2023-07-25) · ISC license · 0 weekly downloads

## Install

```sh
npm install @isludy/postcss-unit-parser
pnpm add @isludy/postcss-unit-parser
yarn add @isludy/postcss-unit-parser
bun add @isludy/postcss-unit-parser
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.0.4 |
| Published | 2023-07-25 |
| First published | 2023-05-16 |
| Weekly downloads | 0 |
| License | ISC |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 0 |
| Unpacked size | 5.6 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Author | isludy |
| Maintainers | isludy |

## Links

- npm: https://www.npmjs.com/package/@isludy/postcss-unit-parser
- Repository: https://gitee.com/isludy/postcss-unit-parser
- npm.io page: https://npm.io/package/@isludy/postcss-unit-parser

## Recent versions

- 1.0.4 (latest) — 2023-07-25
- 1.0.3 — 2023-06-15
- 1.0.2 — 2023-06-13
- 1.0.1 — 2023-05-16
- 1.0.0 — 2023-05-16

## README

# postcss-unit-parser

#### 介绍
webpack插件：用于将自定义单位转vw或rem

#### 安装教程

```
npm i --save-dev postcss-unit-parser
```

#### 使用说明

```
import UnitParser from 'postcss-unit-parser'

UnitParser(options, ignore)
```
#### 参数

1. options: Object
    ```
    {
        [string]: {        //[string] 是自定义的单位，默认: px，多个用英文逗号分隔，如: 'px,vp'，则单位为px和vp的值都将被转为vw
            base: 375,     //设计稿宽度依据，默认: 375
            decimal: 3,    //计算精度，默认: 3（保留3位小数）
            min: 1,        //最小值，值大于此值时，忽略，默认: 1
            unit: 'vw',    //输出单位，默认: vw
            times: 100     //相关倍率系数，不同单位意义不同
            /**
             * vw时，times计算逻辑：
             *    满屏100vw，希望375vp转换为100vw，
             *    那么，1vw = 3.75vp，所以，times = 375vp/3.75vp = 100
             *    即 375vp = 100vw
             * 
             * rem时，times计算逻辑：
             *    由于浏览器的最小字体支持9-12px不等，安全起见，以375屏12px为下限，即，希望375屏下，html的font-size: 12px
             *    那么，375rp转为rem则是 375rp = times * 12px
             *    所以，times = 375rp / 12px = 31.25
             *    即 375rp = 31.25rem
             *    html的font-size = window.innerWidth / 31.25 = window.innerWidth / (base / 12)
             */
        }
    }
    // 示例
    UnitParser({
        'vp,px': {
            base: 375,
            decimal: 3,
            min: 1,
            unit: 'vw',
            times: 100
        },
        'rp': {
            base: 375,
            decimal: 2,
            min: 1,
            unit: 'rem',
            times: 31.25
        }
    })
    ```
2. ignore: RegExp | RegExp[] 忽略的目录或文件，默认 `/node_modules\//`

---
_Source: https://npm.io/package/@isludy/postcss-unit-parser · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._
