0.9.0 • Published 7 months ago
@unocss-applet/preset-rem-rpx v0.9.0
@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