1.0.3 • Published 5 years ago

pxvwpc v1.0.3

Weekly downloads
1
License
ISC
Repository
github
Last release
5 years ago

pxvwpc

postcss 的px 转vw 的plugin,主要用于PC端的无限适配

This is updated from postcss-px-to-vw, and I add some trick because I just need some new file use this plugin

How to use

Step1 npm install

  npm i pxvwpc

Step2 Postcss plugin

postcss([require('postcss-px-to-vw')()])

Start scan this file by add some code

  /*to-vw*/

You must add this code on top of this file

Ignore some line in one file

The source code is :

 /*to-vw*/
.title {
  /* you can override pixel replacement by adding a "px" *
   * comment after the declaration if you want to keep.  */

  font-size: 32px; /*px*/
  padding: 16px 0 18px;
}

The result is :

 /*to-vw*/
.title {
   /* you can override pixel replacement by adding a "px" *
   * comment after the declaration if you want to keep.  */

  font-size: 32px; /*px*/
  padding: 4.444444444444445vw 0 5vw;
}

If you want change your UI width

Plug it into your PostCSS configuration.

var option = {
  vwUnit: 1920, // Base designer size; 1920px by default
};

postcss([require('postcss-px-to-vw')(option)])
1.0.3

5 years ago

1.0.2

5 years ago

1.0.1

5 years ago

1.0.0

5 years ago