微信小程序组件样式警告问题：Some selectors are not allowed in component wxss, including tag name selectors......

介绍

在小程序里使用组件，写样式文件后，提示警告信息： Some selectors are not allowed in component wxss, including tag name selectors......, 如下所示：

样式代码如下：

.search-bar {
  height: 90rpx;
  padding: 10px;
  background-color: var(--themeColor);
  navigator {
    height: 100%;
    icon {
      margin-right: 5rpx;
    }
  }
}

分析

小程序内部，自定义组件，文件中禁止使用 标签名选择器， id选择器,属性,选择器。
所以在书写样式的时候，给组件加上一个类名，然后通过类名来书写样式即可。
修改后的代码如下：

.search-bar {
  height: 90rpx;
  padding: 10px;
  background-color: var(--themeColor);
  .navigator-box {
    height: 100%;
    .icon-search {
      margin-right: 5rpx;
    }
  }
}