安装pocss插件autoprefixer

最新推荐文章于 2024-04-01 05:00:00 发布

chencaw

最新推荐文章于 2024-04-01 05:00:00 发布

阅读量639

点赞数

分类专栏： Vant

本文链接：https://blog.csdn.net/chencaw/article/details/113833886

版权

Vant 专栏收录该内容

1 篇文章 0 订阅

订阅专栏

1、安装pocss插件autoprefixer

npm install --save-dev autoprefixer

2、查看package.json

3 在postcss.config.js中添加规则

      'autoprefixer': {
        'overrideBrowserslist': [
          // 'ie >= 8',   //兼容ie7以上浏览器
          // 'Firefox >= 3.5', //兼容火狐版本号大于3.5浏览器
          // 'chrome >= 35',   //兼容chrome版本号大于35浏览器
          // 'opera >= 11.5',   //兼容opera版本号大于11.5浏览器
          'Android >= 4.0', 
          'iOS >= 8',
        ]
      },

postcss.config.js整个文件代码如下（前面已安装过postcss）

module.exports = {
    plugins: {
      'autoprefixer': {
        'overrideBrowserslist': [
          // 'ie >= 8',   //兼容ie7以上浏览器
          // 'Firefox >= 3.5', //兼容火狐版本号大于3.5浏览器
          // 'chrome >= 35',   //兼容chrome版本号大于35浏览器
          // 'opera >= 11.5',   //兼容opera版本号大于11.5浏览器
          'Android >= 4.0', 
          'iOS >= 8',
        ]
      },
      'postcss-pxtorem': {
        rootValue: 75, //设置根元素大小, 值为移动端页面值/10
        propList: ['*'], //所有属性都可以从px更改的rem的属性
        exclude: /node_modules/i, //排除node_modules目录下所有的文件
        selectorBlackList: ['vant-','.my-'], //过滤掉vant-开头的元素选择器, .my-开头的类选择器
      },
    },
  };