nuxt移动端适配

弘道者人

根据有赞的vant官网的提示,用了两个插件

postcss-pxtoremlib-flexible

以下是有赞官网的提示
image.png

第一步:用yarn安装上面两个插件。

第二步:引用postcss-pxtorem

需要配置到nuxt.config.js的build中
image.png

第三步:把flexible.js放到static/js中,并在nuxt.config.js的head中引用。
具体做法是,从node_modules中找到amfe-flexible把index.js复制出来,重命名为flexible.js,放入static/js中
然后在head中引用

image.png

这样就大功告成了。字体和元素大小会自动根据屏幕的大小而发生变化

注意:只有元素使用rem单位,元素才会自动适应屏幕

阅读 5.2k
48 声望
1 粉丝
0 条评论
48 声望
1 粉丝
文章目录
宣传栏