一、学习内容
先测试单位会不会变为em,编写app.vue
<template> <div id="app"> <div class="test"></div> </div></template>.test{ width: 100px; height: 100px; background-color: red;}
安装:postcss-pxtorem
npm install postcss-pxtorem -D
module.exports = { plugins: { autoprefixer: {}, 'postcss-pxtorem': { rootValue: 100, // 根元素字体大小 // 只有宽度高度需要转rem,其他不需要转换 propList: ['width', 'height'] } }
} 这样只有宽度高度需要转rem,其他不需要转换。 但后面还有margin padding等,不断添加很麻烦,所以还是写成转换全部,在px不需要转换的时候大写就不会转em了 propList: ['*'] App.vue中将 .test{ width: 100Px;} 所以我们的variable.scss中所有字体单位的Px都大写 二、是否遇到问题
无
三、是否解决
|