【小程序】微信开发者工具警告：Some selectors are not allowed in component wxss

已于 2022-10-18 10:53:00 修改
阅读量3.9k 收藏 1
点赞数
分类专栏： 小程序 文章标签： 微信小程序 小程序 前端
于 2022-10-18 10:52:21 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/fanxin12138/article/details/127383174
版权

[pages/home/index] Some selectors are not allowed in component wxss, including tag name selectors, ID selectors, and attribute selectors.(./pages/home/components/tip-dialog/index.wxss:69:1)

这个警告意思是 微信小程序组件wxss中不允许使用某些选择器，包括标签选择器、ID选择器和属性选择器等。

自定义组件 | 微信开放文档

小程序本身的wxss也是css的子集，并不支持全部的css属性，包括部分常用选择器（平时稍微注意）， 在其组件中的wxss样式更为严苛，很多微信页面能使用的样式，在组件中是禁用的

 
WXSS | 微信开放文档

fanxin12138
关注
  • 0
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
解决：Some selectors are not allowed in component wxss, including tag name selectors, ID selectors
K8001的专栏
11-19 2万+
解决小程序开发过程中遇到的：[渲染层错误] Some selectors are not allowed in component wxss, including tag name selectors, ID selectors, and attribute selectors.错误
testcafe-react-selectors：用于React应用程序的TestCafe选择器扩展
02-06
咖啡馆React选择器 这个插件提供了选择器扩展，使使用测试ReactJS组件变得更加容易。 这些扩展允许您以React固有的方式选择页面元素。 安装 $ npm install testcafe-react-selectors 用法 等待应用程序准备运行测试 要等到React的组件树被加载后，将waitForReact方法添加到waitForReact的beforeEach挂钩中。 import { waitForReact } from 'testcafe-react-selectors' ; fixture `App tests` . page ( 'http://react
Some selectors are not allowed in component wxss, including tag name selectors, ID selectors, and at
最新发布
古猿写代码
03-28 1472
它支持类选择器、样式选择器、属性选择器、伪类选择器等，但不支持标签名选择器和ID选择器。这是由于微信小程序本身的限制，其设计原则上鼓励开发者使用类名来管理样式，而不是依赖于元素的标签名或ID。所以，如果你在 wxss 中使用了标签名选择器或ID选择器，你会收到一个错误信息，提示你这些选择器是不被允许的。你遇到的问题是在微信小程序的组件样式（wxss）中，有一些选择器是不被允许的，包括标签名选择器、ID选择器。如果需要针对特定元素应用样式，可以添加一个独特的类名，然后在 wxss 中使用这个类名作为选择器。
testcafe-aurelia-selectors:适用于Aurelia应用程序的TesCafe选择器扩展
05-28
testcafe-aurelia-选择器 该插件提供选择器扩展，使使用轻松测试Aurelia应用程序。 这些扩展允许您以Aurelia固有的方式选择页面元素。 安装 npm install testcafe-aurelia-selectors 选择器扩展 按值绑定 选择其value属性绑定到指定表达式的元素。 byValueBind(expression, parentSelector) 范围 描述 表达 元素的value属性绑定到JavaScript表达式。 parentSelector （可选） 一个TestCafe 。 如果指定，TestCafe将在此选择器标识的元素的后代中搜索目标元素。 由ShowBind 选择其可见性绑定到指定表达式的元素。 byShowBind(expression, parentSelector) 范围 描述 表达 元素可见性绑定到JavaS
Build input file cannot be found:
liubo的博客
01-20 1565
发现是文件没有添加到build phase 去掉这个灰色的，然后重新添加一下就可以了
小程序自定义组件报错：Some selectors are not allowed in component wxss, including tag name selectors...
热门推荐
lizhongyang21的博客
10-15 3万+
VM3564:1 Some selectors are not allowed in component wxss, including tag name selectors, ID selectors, and attribute selectors.(./components/componentLabel/index.wxss:3:1)This wxss file is ignored. 以...
微信小程序开发常见warnings警告解决方案
XH_jing的博客
12-03 8560
在小程序开发过程中，只要稍不注意代码细节，就会出现很多 warnings 警告，虽然在对小程序的运行并没有什么影响，但是作为一名严谨的程序猿，是不允许它们存在的。 下面我将从我的实际项目开发过程中碰到的warnings 问题进行分析处理。 Warning 1: Some selectors are not allowed in component wxss, including tag name selectors, ID selectors, and attribute selectors。 首.
Some selectors are not allowed in component wxss, including tag name selectors, ID selectors,and...
川川的博客
01-17 4759
我出现这个问题的原因是在组件的样式中使用了button { } 这个异常的原因是 解决方法 在组件的Component中添加 options: { addGlobalClass: true, }, 然后将组件中出现问题的样式剪切到使用该组件的page的样式中，我出现问题的样式是button { } 警告就解除了。 设置addGlobalClass: true 或者apply-shared 表示页面 wxss 样式将影响到自定义组件，但自定义组件 wxss 中指定的样式不会影响页面 .
微信开发者工具Some selectors are not allowed in component wxss警告报错
weixin_47681230的博客
12-05 1万+
微信开发者工具Some selectors are not allowed in component wxss警告报错 这警告的意思是“wxss组件中不允许使用某些选择器，包括标记名选择器、ID选择器和属性选择器。” 而在微信小程序开发文档中提到“子元素选择器（.a>.b）只能用于 view 组件与其子节点之间” 看一下报错所提示的位置：./components/compA/comp-a.wxss 报错代码如下： .comp-a{ font-size: 25px; } .comp-a &g
testcafe-angular-selectors:Angular应用程序的TestCafe选择器扩展
05-28
该插件提供了扩展，使使用轻松测试Angular应用程序。 这些扩展允许您创建一个Selector ，以Angular应用程序固有的方式在页面上查找元素。 安装 npm install testcafe-angular-selectors 用法 该模块包括用于Angular...
node-rename-css-selectors::memo:重命名文件中CSS类和ID
05-07
在使用rename-css-selectors处理它之后执行此操作此模块重命名给定文件中的所有CSS选择器。 它将从给定CSS文件中收集所有选择器。 不必担心选择器， rcs会为您完成选择。 你也可以使用一个配置文件与组合和 ，如果...
gulp-rcs：主模块的gulp任务named-css-selectors
02-03
gulp-rcs 插件。 缩小所有文件中的所有CSS选择器 总览 安装 npm i rcs-core gulp-rcs -D 要么 yarn add rcs-core gulp-rcs --dev 基本用法（带Gulp v3） 确保首先加载所有css文件。 文件不应该成为精缩/变丑。...
[pages/index/index] Some selectors are not allowed in component wxss, including tag name selectors,
weixin_62918410的博客
11-20 3147
组件和引用组件的页面不能使用 id 选择器（#a）、属性选择器（[a]）和标签名选择器，应改用 class 选择器。
uniapp在微信小程序端报错VM57:1 Some selectors are not allowed in component wxss
weixin_42447084的博客
05-14 1930
首先，会出现uniapp控制台没报错，但微信小程序存在报错且真机运行存在问题 这时候应该去看看报错信息中对应的页面的样式文件导入区 进入所导入的样式文件，查找是否存在id选择器【#】，或者属性选择器【[]】,做出修改甚至删除 原因：微信小程序不允许导入外部样式文件中存在id选择器【#】和属性选择器【[]】 ...
微信小程序警告：Some selectors are not allowed in component wxss, including tag name selectors, ID selectors
zero___1的博客
07-22 6537
小程序警告： Some selectors are not allowed in component wxss, including tag name selectors, ID selectors, and attribute selectors 解决办法：把组件中的wxss的标签选择器（text）和id（#id）全部换成属性选择器（.class）
微信小程序错误收录
lzzlcy的博客
08-07 164
1 警告：Some selectors are not allowed in component wxss, including tag name selectors, ID selectors, and attribute selectors less文件是这样写的： 用类去写样式就不会有这个警告 2 警告：[sitemap 索引情况提示] 根据 sitemap 的规则[0]，当前页面 [pages/search/index] 将被索引 sitemap 解释： https://zhuanlan.zh
uni-app Some selectors are not allowed in component wxss解决方案
xuelang532777032的博客
02-22 2253
1、组件和引用组件的页面不能使用 id 选择器（#a）、属性选择器（[a]）和标签名选择器，请改用 class 选择器。5、除继承样式外， app.wxss 中的样式、组件所在页面的的样式对自定义组件无效（除非更改组件样式隔离选项）。2、组件和引用组件的页面中使用后代选择器（.a .b）在一些极端情况下会有非预期的表现，如遇，请避免使用。3、子元素选择器（.a>.b）只能用于 view 组件与其子节点之间，用于其他组件可能导致非预期的情况。组件对应 wxss 文件的样式，只对组件 wxml 内的节点生效。
为什么在HBuilderX预览中正常显示的组件到微信开发者工具上就不能正常显示还报错Some selectors are not allowed in component wxss, including tag name selectors, ID selectors, and attribute selectors.
06-06
这是因为微信开发者工具和HBuilderX使用的渲染引擎不同，可能存在一些差异。在微信开发者工具中，组件的wxss文件中不能使用标签名选择器、ID选择器和属性选择器，否则会报错，而在HBuilderX预览中可能会正常显示，但实际上也是不符合规范的。因此，建议在编写组件样式时，尽量避免使用这些选择器，遵循小程序官方的规范，以确保代码的正确性和兼容性。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值