移动端——postcss注意事项

PostCSS类似于less、sass,目的在于让css变得像一门编程语言,支持变量

注意,如果使用本地ui框架(非CDN连接),使用PostCSS会导致框架失效(px单位转换成vmin),使用PostCSS的黑名单属性或者使用CDN加载可以避免

1、PostCSS会自动添加浏览器的前缀(.postcssrc.js  文件中的 autoprefixer 属性),但是默认添加谷歌浏览器的前缀,修改package.json文件中的 browserslist 属性可以让你postcss支持更多的浏览器,(browserslist 的第一个参数为筛选浏览器使用的比例)

2、使用vue创建的项目,在项目的根目录,有一个.postcssrc.js 文件,,在文件中可以添加插件,常用的插件有

 2.1、postcss-px-to-viewport (把px单位转换成设置的单位)

    'postcss-px-to-viewport':{
      viewportWidth:720,//视窗可视区域宽(设计稿的宽度)
      viewportUnit:'vmin',//默认以哪一条边为主做计算(vmin是以最小的边为计算,vmax是以最大的边为计算)
    }

猜你喜欢

转载自blog.csdn.net/YUHUI01/article/details/84669630