Gathering detailed insights and metrics for postcss-units-transform
Gathering detailed insights and metrics for postcss-units-transform
Gathering detailed insights and metrics for postcss-units-transform
Gathering detailed insights and metrics for postcss-units-transform
postcss-transform
CSS converts other units
postcss-better-units
A PostCSS plugin to define, transform, and manage custom or existing CSS units with ease.
@hsuna/postcss-media-query-transform
PostCSS plugin designed to automatically adjust pixel values within specified media queries. It scales the numeric values of designated units according to predefined ratios, ensuring consistent and responsive design across various devices and screen sizes
npm install postcss-units-transform
Typescript
Module System
Node Version
NPM Version
66.4
Supply Chain
99.2
Quality
75.4
Maintenance
100
Vulnerability
100
License
JavaScript (84.71%)
CSS (14.85%)
Shell (0.44%)
Total Downloads
16,576
Last Day
5
Last Week
159
Last Month
457
Last Year
8,790
2 Stars
18 Commits
2 Watchers
2 Branches
1 Contributors
Updated on Mar 08, 2023
Minified
Minified + Gzipped
Latest Version
2.0.0
Package Id
postcss-units-transform@2.0.0
Unpacked Size
7.42 kB
Size
3.03 kB
File Count
4
NPM Version
6.14.14
Node Version
14.17.5
Cumulative downloads
Total Downloads
Last Day
66.7%
5
Compared to previous day
Last Week
1.9%
159
Compared to previous week
Last Month
-6%
457
Compared to previous month
Last Year
140.9%
8,790
Compared to previous year
1
1
8
CSS 任意单位之间的互相转换的 PostCSS插件。
PostCSS < 8.0 请使用 postcss-units-transform@1.x
$ npm install postcss-units-transform --save-dev
如果使用 默认的 opts,将会得到如下的输出。
1/* input */ 2p { 3 margin: 0 0 20px; 4 font-size: 32px; 5 line-height: 1.2; 6 letter-spacing: 1px; /* no */ 7} 8 9/* output */ 10p { 11 margin: 0 0 20rpx; 12 font-size: 32rpx; 13 line-height: 1.2; 14 letter-spacing: 1px; 15}
1var fs = require('fs'); 2var postcss = require('postcss'); 3var pxtorem = require('postcss-pxtorem'); 4var css = fs.readFileSync('main.css', 'utf8'); 5var options = { 6 replace: false, 7}; 8var processedCss = postcss(pxtorem(options)).process(css).css; 9 10fs.writeFile('main-rem.css', processedCss, function (err) { 11 if (err) { 12 throw err; 13 } 14 console.log('Rem file written.'); 15});
Type: Object | Null
Default:
1{ 2 divisor: 1, 3 multiple: 1, 4 decimalPlaces: 2, 5 comment: 'no', 6 targetUnits: 'rpx', 7 sourceUnits: 'px', 8 declMembers: '*' 9}
Detail:
width: 100px
中的 100,将会被转换成 Number(100 / divisor * multiple).toFixed(decimalPlaces)
/*no*/
。如果设置 comment 的值为 'not replace', width: 100px; /* not replace */
中的 100px 将不会被转换为 rpx。px
rpx
,如果设置其值为 rem
,px 将会被转换为 rem。优先级高于 options.declMembers
互斥关系
/* units-transform */
1/* units-transform */ 2.main { 3 height: 1rem; 4 width: 2rem; 5 font-size: 0.28rem; 6}
优先级高于 options.declMembers
互斥关系
/* units-transform:height,width */
1/* units-transform:height,width */ 2.main { 3 height: 1rem; 4 width: 2rem; 5 font-size: 0.28rem; 6}
与 options.declMembers
并集的关系
1.main { 2 height: 1rem; 3 width: 2rem; /* units-transform */ 4 font-size: 0.36rem; 5}
No vulnerabilities found.
Reason
no dangerous workflow patterns detected
Reason
no binaries found in the repo
Reason
0 commit(s) and 0 issue activity found in the last 90 days -- score normalized to 0
Reason
Found 0/18 approved changesets -- score normalized to 0
Reason
detected GitHub workflow tokens with excessive permissions
Details
Reason
dependency not pinned by hash detected -- score normalized to 0
Details
Reason
no effort to earn an OpenSSF best practices badge detected
Reason
project is not fuzzed
Details
Reason
security policy file not detected
Details
Reason
license file not detected
Details
Reason
branch protection not enabled on development/release branches
Details
Reason
SAST tool is not run on all commits -- score normalized to 0
Details
Reason
17 existing vulnerabilities detected
Details
Score
Last Scanned on 2025-06-23
The Open Source Security Foundation is a cross-industry collaboration to improve the security of open source software (OSS). The Scorecard provides security health metrics for open source projects.
Learn More