无法使用postcss-px-to-viewport
- Dominant language
- JavaScript
- Stars
- 41.6k
- Forks
- 3.7k
- Avg merge
- 7h 6m
- Merged PRs (30d)
- 6
Description
**问题描述**
我已经了解有rpx做适应,但公司现在想让根据高度适应,而不是宽度。所以想到了postcss-px-to-viewport,但运行时报错
**复现步骤**
[复现问题的步骤]
npm install postcss-px-to-viewport --dev
编写postcss.config.js
```
module.exports = {
plugins: {
'autoprefixer': {
browsers: ['Android >= 4.0', 'iOS >= 7']
},
"postcss-px-to-viewport": {
viewportWidth: 667, // 设计稿宽度
//viewportHeight: 1334, // 设计稿高度,可以不指定
unitPrecision: 2, // px to vw无法整除时,保留几位小数
viewportUnit: 'vh', // 转换成vw单位
fontViewportUnit: 'vh',
selectorBlackList: ['.ignore', '.hairlines'], // 不转换的类名
minPixelValue: 1, // 小于1px不转换
mediaQuery: false, // 允许媒体查询中转换
// exclude: /(\/|\\)(node_modules)(\/|\\)/ //不转换我们引入的第三方包
},
}
}
```
点击hbuilder运行
[或者可以直接贴源代码]
**实际结果**
```
21:04:06.799 INFO Starting development server...
21:04:24.931 Module build failed (from ./node_modules/postcss-loader/src/index.js):
21:04:24.935 Error: Loading PostCSS Plugin failed: Cannot find module 'postcss-px-to-viewport'
21:04:24.939 (@D:\code\uniApps\easybuy-boss\postcss.config.js)
21:04:24.944 at load (D:\xx\HBuilderX\plugins\uniapp-cli\node_modules\postcss-load-config\src\plugins.js:28:11)
21:04:24.950 at Object.keys.filter.map (D:\xx\HBuilderX\plugins\uniapp-cli\node_modules\postcss-load-config\src\plugins.js:53:16)
21:04:24.957 at Array.map ()
21:04:24.963 at plugins (D:\xx\HBuilderX\plugins\uniapp-cli\node_modules\postcss-load-config\src\plugins.js:52:8)
21:04:24.969 at processResult (D:\xx\HBuilderX\plugins\uniapp-cli\node_modules\postcss-load-config\src\index.js:33:14)
21:04:24.970 at config.search.then (D:\xx\HBuilderX\plugins\uniapp-cli\node_modules\postcss-load-config\src\index.js:94:14)
21:04:24.976 at
```
**系统信息:**
- 发行平台: H5平台
- 操作系统 win7
- HBuilderX版本 2.6.16.20200424
- uni-app版本 hbuilder创建,不知道怎么查看?
- 设备信息 无
**补充信息**
或者有其他方案可以解决该需求?
Contributor guide
Assessment
This issue has not been assessed yet.