vue3.0+vite 使用 postcss-pxtorem 实现移动自适应(px转rem)
下载 postcss-pxtoremnpm i postcss-pxtorem -D与package.json同级目录创建postcss.config.js文件module.exports = {plugins: {autoprefixer: {overrideBrowserslist: ["Android 4.1","iOS 7.1",.
·
- 下载
postcss-pxtorem
npm i postcss-pxtorem -D
- 与
package.json
同级目录创建postcss.config.js
文件
module.exports = {
plugins: {
autoprefixer: {
overrideBrowserslist: [
"Android 4.1",
"iOS 7.1",
"Chrome > 31",
"ff > 31",
"ie >= 8",
"last 10 versions", // 所有主流浏览器最近10版本用
],
grid: true,
},
'postcss-pxtorem': {
rootValue: 37.5,
propList: ['*'],
unitPrecision: 5
}
}
}
这里只实现了 px
转rem
,还要安装 amfe-flexible
npm i amfe-flexible -D
在main.ts
文件中 import 一下就好可以了
import ‘amfe-flexible/index.js’
:可能会出现下面情况
[vite] Internal server error: Loading PostCSS Plugin failed: Cannot find module 'autoprefixer'
这时候尝试安装 autoprefixer
就可以了
npm i autoprefixer
更多推荐
已为社区贡献8条内容
所有评论(0)