0.9.0 • Published 7 months ago

@unocss-applet/preset-rem-rpx v0.9.0

Weekly downloads
-
License
MIT
Repository
github
Last release
7 months ago

@unocss-applet/preset-rem-rpx

Coverts rem <=> rpx for utils.

Instal

npm i @unocss-applet/preset-rem-rpx --save-dev # with npm
yarn add @unocss-applet/preset-rem-rpx -D # with yarn
pnpm add @unocss-applet/preset-rem-rpx -D # with pnpm

Usage

import { presetRemRpx } from '@unocss-applet/preset-rem-rpx'

import { defineConfig } from 'unocss'

export default defineConfig({
  presets: [
    // ...
    presetRemRpx({ baseFontSize: 16, screenWidth: 375, mode: 'rem2rpx' }),
  ],
})

⚠️If you change baseFontSize other than 16 and use rpx2rem mode, you need to set the corresponding root font-size in H5.

Type Declarations

export interface RemRpxOptions {
  /**
   * 1rem = n px
   * @default 16
   */
  baseFontSize?: number

  /**
   * screen width in px
   * @default 375
   */
  screenWidth?: number

  /**
   * rem to rpx or rpx to rem
   * @default 'rem2rpx'
   */
  mode?: 'rem2rpx' | 'rpx2rem'
}
<div class="m-1rem p-32rpx"></div>

without

.m-1rem {
  margin: 1rem;
}
.p-32rpx {
  padding: 32rpx;
}

rem2rpx

.m-1rem {
  margin: 32rpx;
}
.p-32rpx {
  padding: 32rpx;
}

rpx2rem

.m-1rem {
  margin: 1rem;
}
.p-32rpx {
  padding: 1rem;
}

License

MIT License © 2022-PRESENT Neil Lee

0.9.0

7 months ago

0.8.5

8 months ago

0.8.4

9 months ago

0.8.3

9 months ago

0.8.2

1 year ago

0.8.1

1 year ago

0.8.0

1 year ago

0.7.6

2 years ago

0.7.5

2 years ago

0.7.8

2 years ago

0.7.7

2 years ago

0.7.2

2 years ago

0.5.4

2 years ago

0.7.4

2 years ago

0.7.3

2 years ago

0.5.5

2 years ago

0.6.1

2 years ago

0.6.0

2 years ago

0.4.13

2 years ago

0.4.12

2 years ago

0.5.3

2 years ago

0.5.0

2 years ago

0.5.2

2 years ago

0.5.1

2 years ago

0.4.10

2 years ago

0.4.5

2 years ago

0.3.6

2 years ago

0.4.4

2 years ago

0.3.8

2 years ago

0.4.6

2 years ago

0.3.7

2 years ago

0.4.1

2 years ago

0.4.0

2 years ago

0.4.3

2 years ago

0.4.2

2 years ago

0.3.4

2 years ago

0.3.3

2 years ago

0.3.2

2 years ago

0.3.1

2 years ago