博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
出现VW自适应方案报错already has a ‘content‘ property, give up to overwrite it的原因及解决办法
阅读量:2345 次
发布时间:2019-05-10

本文共 817 字,大约阅读时间需要 2 分钟。

出现VW自适应方案报错already has a 'content' property, give up to overwrite it的原因及解决办法

背景及原因

在使用vw自适应解决方案的时候,当引入第三方UI组件库或者使用伪类选择器出现了already has a ‘content’ property, give up to overwrite it的报错。

在这里插入图片描述

这是因为postcss-viewport-units插件会自动给html元素添加content属性,由此就造成了伪类选择器的冲突。

在这里插入图片描述

解决办法

那么如何解决这样的报错呢?

postcss-viewport-units插件文档其实已经给出了解决办法,配置一个过滤规则函数即可解决问题

在这里插入图片描述

首先我们需要安装最新的postcss-viewport-units (很多情况下配置过滤规则函数也解决不了问题就是因为postcss-viewport-units版本太低的原因导致)

npm i postcss-viewport-units@0.1.6 -S

其次.postcssrc.js文件配置postcss-viewport-units插件

"postcss-viewport-units": {
filterRule: rule => rule.selector.includes('::after') && rule.selector.includes('::before') && rule.selector.includes(':after') && rule.selector.includes(':before')},

在这里插入图片描述

重新启动项目,不再抛出类似错误。
在这里插入图片描述

文章参考

https://blog.csdn.net/perryliu6/article/details/80965734

https://zhuanlan.zhihu.com/p/164422789

你可能感兴趣的文章
Java NIO(六)SocketChannel、ServerSocketChannel
查看>>
6 Netty 架构剖析
查看>>
Netty简介
查看>>
Redis,API的理解和使用-全局命令
查看>>
shell之eval
查看>>
postgresql基本操作
查看>>
SQLAlchemy使用
查看>>
word设置标题
查看>>
git之HEAD
查看>>
基于2.6内核的Init_task进程之一
查看>>
C代码插入汇编
查看>>
C++基础知识-之强指针(韦东山视频学习)
查看>>
C++之Android弱指针
查看>>
C++基础知识之vector和[=] [&] [=,&]拷贝
查看>>
C语言常见错误
查看>>
Init中的next_token()函数
查看>>
STL之MAP和Vector
查看>>
智能指针 unique_ptr
查看>>
Init.rc配置文件Action字段解析
查看>>
uml问题解决
查看>>