我想知道关于开发项目引入该组件库后的组件的适配问题,由于我的项目用了postcss-pxtorem,将px自动转成rem,导致该组件库的组件样式 也px转成 rem了。
如picker组件,在iphone X上:
在iphone 8 plus上:
发布于 2020-11-20 18:49
共2个回答
AD
游客AdtNgf
修改postcss.config.js
文件:
module.exports = ({ file }) => {
let remUnit
if (file && file.dirname && file.dirname.indexOf("nut")>-1) {
remUnit = 37.5
} else {
remUnit = 75
}
return {
plugins: {
'postcss-pxtorem': {
rootValue: remUnit,
propList: ['*']
}
}
}
}
KN
游客KnHhFZ
另外一种方案,转换的时候排除node_modules
文件夹,修改vue.config.js
:
module.exports = {
css: {
loaderOptions: {
// 给 sass-loader 传递选项
scss: {
// @/ 是 src/ 的别名
// 注意:在 sass-loader v7 中,这个选项名是 "data"
prependData:
`
@import "@/styles/custom_theme.scss";
@import "@nutui/nutui/dist/styles/index.scss";
`
},
postcss: {
plugins: [
pxtorem({
rootValue: 37.5,
propList: ['*'],
exclude: 'node_modules' // 排除node_modules,不对node_modules 中的内容进行转换
})
]
}
}
}
}
回答问题