bash npm install postcss-px-to-viewport-8-plugin --save-dev 验证webpack或其他构建工具的配置文件: 确保你的webpack或其他构建工具的配置文件中已经正确引入了 postcss-px-to-viewport-8-plugin 插件。以下是一个在webpack中配置 postcss-px-to-viewport-8-plugin 的示例:javascript...
同时使用 unocss 和 postcss 中 postcss-px-to-viewport-8-plugin 这个插件可能会遇到一个问题。就是使用 unocss 中px选择器如 w-[1200px] ,期望的是最终页面显示一个 width: 1200px 的元素,但是 postcss-px-to-viewport-8-plugin 插件会把 px 转换成 vw,一个vw相当于屏幕视口的 1%,如果你使用了老师视频...
postcss-px-to-viewport 的 exclude 配置无效 原来是由于版本太低的缘故: postcss-px-to-viewport 0.0.3版本不支持 exclude属性。 更新到 1.1.0 配置: //路径中包含 PC ,则忽略 px转换为vw,vh,vmax,vminexclude: /(\/|\\)(PC)(\/|\\)/, 2、 反向正则帮了大忙。 // 非Phone ,就是指Phone转换 ex...
module.exports= {plugins: {'postcss-px-to-viewport-8-plugin': {unitToConvert:'px',// 需要转换的单位,默认为"px"viewportWidth:750,// 设计稿的视口宽度unitPrecision:5,// 单位转换后保留的精度propList: ['*','!font-size'],// 能转化为vw的属性列表,!font-size表示font-size后面的单位不会被...
import{defineConfig}from'vite';importpostcsspxtoviewport8pluginfrom'postcss-px-to-viewport-8-plugin';exportdefaultdefineConfig({css:{postcss:{plugins:[postcsspxtoviewport8plugin({unitToConvert:'px',viewportWidth:file=>{letnum=1920;if(file.indexOf('m_')!==-1){num=375;}returnnum;},unitPrecis...
postcsspxtoviewport({unitToConvert:'px',// 需要转换的单位,默认为"px"viewportWidth:1920,// 设计稿的视口宽度unitPrecision:5,// 单位转换后保留的精度propList:['*'],// 能转化为vw的属性列表viewportUnit:'vw',// 希望使用的视口单位fontViewportUnit:'vw',// 字体使用的视口单位selectorBlackList:[...
postcss-px-to-viewport 替换 postcss-px-to-viewport-8-plugin 修复因为postcss版本导致的atRule is not a constructor问题 对应库版本 "postcss":"^8.3.8",// 8.0.0版本都不会转单位"postcss-loader":"^6.1.1", 安装 npminstallpostcss-px-to-viewport-8-plugin-Doryarnaddpostcss-px-to-viewport-8-plugi...
include设置无效 "postcss-px-to-viewport": { "viewportWidth": 375, "minPixelValue": 1, include: [path.resolve('src/views/mobile')] } 这样设置以后,views下面的web文件夹下面的所有vue文件还是转换成了vw,请问下这是什么原因? include (Array or Regexp) 如果设置了include,那将只有匹配到的文件才会...
vite.config.ts importpptv,{AcceptedPlugin}from"postcss-px-to-viewport-8-plugin";constload_pptv:...
npm install postcss-px-to-viewport-8-plugin -D 具体使用参考迁移指南npm仓库 https://www.npmjs.com/pa...