vue自适应布局大屏实现方案

1. 下载postcss-px2rem和px2rem-loader插件

npm install postcss-px2rem -S
npm install px2rem-loader -S

2. 在vue-config.js文件中添加配置

import px2rem from 'postcss-px2rem'
const postCss = px2rem({
	remUnit: 192 // 分辨率1920*1080
})

module.exports = {
	baseUrl: './',
    outputDir: 'Saas-Platform',
    assetsDir: 'static',
    lintOnSave: process.env.NODE_ENV === 'development' ? 'error' : false,
	css: {
		loaderOptions: {
	      postcss: {
	        plugins: {
	          postcss
	        }
	      }
	    }
	}
}

3. 引入flexible.js文件，自动计算px转rem，适配不同分辨率，超神
   flexible.js