2018-01-2511:58:01大摩老师最新的移动端适配方案，使用该方案可以替代flexible.js首先建议读者先学习一下大摩老师的这篇文章，看完之后会有很大的收获正在阅读如何在Vue项目中使用vw实现移动适配文本开始使用vue-cli新建项目vueinitwebpackvue-democdvue-demonpmrundevinstallationdependencies复制如下代码：npmipostcss-aspect-ratio-minipostcss-px-to-viewportpostcss-write-svgpostcss-cssnextpostcss-viewport-unitscssnanocssnano-preset-advanced--S复制postcssrc.js配置。postcssrc.js配置module.exports={"plugins":{"postcss-import":{},"postcss-url":{},"postcss-aspect-ratio-mini":{},"postcss-write-svg":{utf8:false},"postcss-cssnext":{},"postcss-px-to-viewport":{viewportWidth:750,unitPrecision:3,viewportUnit:'vw',selectorBlackList:['.ignore','.hairlines'],minPixelValue:1,mediaQuery:false},"postcss-viewport-units":{},"cssnano":{preset:"advanced",autoprefixer:false,"postcss-zindex":false}}}各插件功能：postcss-px-to-viewport:add将px转换为vw"postcss-px-to-viewport":{viewportWidth:750,//窗口的宽度对应我们设计稿的宽度，一般为750viewportHeight:1334,//窗口的高度根据750设备的宽度指定，一般为1334，或者你也可以notconfigureunitPrecision:3,//指定将`px`转换为窗口单位值的小数位数（很多情况下不能整除）viewportUnit:'vw',//指定转换为的窗口单位,推荐使用vwselectorBlackList:['.ignore','.hairlines'],//指定不会转换为窗口单位的类，可以自定义，可以无限添加，推荐定义一两个普通类名minPixelValue:1,//小于等于`1px`不会转换为窗口单位，也可以设置成你想要的值mediaQuery:false//允许转换`px`在mediaquery}容器适配，可以使用vw文本适配，可以使用vw大于1px的边框，圆角，Shadows可以使用vw内距和外距，可以使用vwpostcss-px-to-viewport文档postcss-write-svg实现Retina屏1像素边框首先记得加上
