在vue中使用flexible(手淘rem布局)

在做这个vue移动端项目之前,因为一定要用rem布局,网上查了很多资料。但貌似很麻烦。引入之前要配置这里,配置那里,写完代码还要转换px之类的。其实不用这么麻烦,只需下载好手淘rem布局插件之后,直接在vue项目中的main.js中全局引入。

// 手淘rem布局插件下载地址
https://github.com/amfe/lib-flexible

第一步:

image.png

第二步

在main.js中直接全局引入rem布局插件


image.png

第三步

直接在vue项目中编写代码,CSS样式中直接使用rem为单位。
使用pxCook软件,可以直接将PSD设计稿中的图转换为rem单位。(记得设置基数值)


image.png

你可能感兴趣的:(在vue中使用flexible(手淘rem布局))