开设网站步骤,个人网站用什么开发,龙岗建设工程交易中心官网,设计师可以做兼职的网站vue 移动端布局字体自适应
安装插件
//根节点会根据页面视口变化而变化font-size大小
// 版本推荐 1.0.2
npm install lib-flexible-computer -S
//自动将px转换为rem
//版本推荐 0.1.9
npm i px2rem-loader -D
//将代码中px自动转化成对应的rem的一个插件
npm install post…vue 移动端布局字体自适应
安装插件
//根节点会根据页面视口变化而变化font-size大小
// 版本推荐 1.0.2
npm install lib-flexible-computer -S
//自动将px转换为rem
//版本推荐 0.1.9
npm i px2rem-loader -D
//将代码中px自动转化成对应的rem的一个插件
npm install postcss-px2rem-exclude -D
在main.js引入
//自适应不同分辨率
import lib-flexible-computer在vue.config.js中配置
module.exports {devServer: {},css: {loaderOptions: {postcss: {postcssOptions: {plugins: [require(postcss-pxtorem)({rootValue: 120, // 换算的基数 屏幕宽度/10propList: [*],// 需要转换的属性*表示所有属性都需要转换})]}}}}
};配置完之后如果报错 node.getIterator is not a function 使用 postcss-px2rem-exclude 会出现该错误 解决方法 // 卸载npm uninstall postcss-px2rem-exclude//重新安装npm install postcss-pxtorem6.0.0搞定亲测有效
