vue cli3 集成 postcss.config.js

vue  cli3  自动px转rem，可以devDependencies安装两个插件来简单实现：

"amfe-flexible": "^2.2.1",

"postcss-adaptive-exclude": "^0.5.1",

然后项目根目录新增配置文件postcss.config.js或者.postcssrc.js

module.exports = {
    plugins: {
        autoprefixer: {},
        "postcss-adaptive-exclude": {
            remUnit: 37.5,//自定义
            autoRem: true,
            exclude: /node_modules|public/i,//自定义
        },
    },
};

　　

然后src/main.js里面导入

import 'amfe-flexible/index' 或者 import 'amfe-flexible'

总结：这只是一种方法，一般来讲移动端页面开发，设计稿宽度是375或者750，remUnit设置为设计稿宽度的1/10，开发人员只需按照设计稿标注的px写css，插件会自动根据设备的宽度定义font-size并转成rem。