首页 > 其他 > 详细

vue 中 px转vw的用法

时间:2019-12-18 14:47:49      阅读:154      评论:0      收藏:0      [点我收藏+]

下面介绍最简单的用法

1 下载依赖

npm install postcss-import postcss-loader postcss-px-to-viewport --save-dev

2 在项目根目录下新建postcss.config.js,配置如下

module.exports = {
    plugins: {
        "autoprefixer": {
            path: [./src/*]
        },
        "postcss-import": {},
        "postcss-px-to-viewport-opt": {
            "viewportWidth": "1920", //视窗的宽度,对应的是我们设计稿的宽度
            "viewportHeight": "1080", // 视窗的高度
            "unitPrecision": 2, //指定`px`转换为视窗单位值的小数位数(很多时候无法整除)
            "viewportUnit": "vw", //指定需要转换成的视窗单位,建议使用vw
            "selectorBlackList": [#nprogress], //指定不转换为视窗单位的类
            "minPixelValue": 1, // 小于或等于`1px`不转换为视窗单位
            "mediaQuery": false, // 允许在媒体查询中转换`px`
            // "exclude": /(\/|\\)(node_modules)(\/|\\)/
        },
    }
};

配置可以修改 ,参考https://github.com/evrone/postcss-px-to-viewport/blob/master/README_CN.md

vue 中 px转vw的用法

原文:https://www.cnblogs.com/ttjm/p/12059713.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!