node 插件

postcss 有个 postcss-px-to-viewport 插件可以将 px转换成vw,如果设计稿是750px只需将 viewportwidth=750即可,该插件会将css中的px自动转换成/750后的值

var postcss = require("postcss");
var postPxToVeiwport = require("postcss-px-to-viewport");
var fs = require("fs");
var autoprefixer = require("autoprefixer");


var browserList = [
   "> 0.5%", "last 2 versions", "Firefox ESR", "not dead"  ]
//不指定浏览器的版本, 默认是最近1个版本  > 0.5%, last 2 versions, Firefox ESR, not dead  很多东西都不回转换,比如flex不回转换,默认的版本支持的东西很新

fs.readFile("src/css/test.css",function(error,result){

 if(error)
 {
 	console.log("--------------error---------
"+error.toString());
 	return;
 }


 postcss([autoprefixer({flexbox:true,add:true,remove:true,browsers:browserList}),postPxToVeiwport]).process(
 	result,{from:"src/css/test.css",to:"src/css/test1.css"}
 	).then(result=>{

 		
 		if(result)
 		{
 			fs.writeFile("src/css/test1.css",result,function(){});

 		}
 		if(reslut.map)
 		{
 			fs.writeFile("src/css/testmap.css",function(){});
 		}
 }).catch(error=>{});


})

// postPxToVeiwport({
//   unitToConvert: 'px',
//   viewportWidth: 360,
//   viewportHeight: 720, // not now used; TODO: need for different units and math for different properties
//   unitPrecision: 5,
//   viewportUnit: 'vw',
//   fontViewportUnit: 'vw',  // vmin is more suitable.
//   selectorBlackList: [],
//   minPixelValue: 1,
//   mediaQuery: false
// })

  

原文地址:https://www.cnblogs.com/chillaxyw/p/9839065.html