[Q]: selectorBlackList失效

[hemengke1997]

React中使用 selectorBlackList 中的类，无效

postcss.config.js

 require('@tcstory/postcss-px-to-viewport')({
      selectorBlackList: ['ignore'],
  }),

x.jsx

<div classNames="ignore otherClass"></div>

otherClass 中的 px 转换了

[tcstory]

你应该给我看看, 你的 css 样式是如何写的. 因为这个插件主要是作用于 css 文件

[hemengke1997]

没事了，我fork了一份，改了些代码， 满足我的需求了。谢谢你。 BTW，请问一下，postcss8 plugin 怎么跳出hook，我看到你的代码里面用了许多flag来判断return，看起来挺麻烦的，也不好维护。我看了很多文档，没找到解决方案 🤣

[tcstory]

你可以给我看看你的场景是怎么样的, 这样可以帮助我提升这个插件的功能....

[tcstory]

没事了，我fork了一份，改了些代码， 满足我的需求了。谢谢你。 BTW，请问一下，postcss8 plugin 怎么跳出hook，我看到你的代码里面用了许多flag来判断return，看起来挺麻烦的，也不好维护。我看了很多文档，没找到解决方案 rofl

在 postcss 中, 遍历 ast 有两种方法

1. 8.x 之前的旧版本
2. 8.x 之后的版本

你现在看到我代码里面写的, 就是 8.x 推荐的版本. 这种版本的遍历方式, 对于 postcss 来说, 能提升代码转换的性能. 但是缺点就像你看到的那样. 需要使用 return 来返回. 整体来说, 不是很好理解.

另外一种应该能满足你的需求... 他那种是更偏向于动态遍历的方式... 我试试能不能找到以前的写法给你参考

[tcstory]

找到了. 这个文档里面, 有一个AST Explorer的链接, 在这个链接里面, 你能看到那种动态的写法

[hemengke1997]

我希望的功能：

1. 可以指定单个类css文件跳过postcss-px-to-viewport的检查，即不转换
2. 指定过滤某个class，如: selectorBlackList:['my-ignore-class']，在 jsx 中使用:

   <div className="my-ignore-class otherClass"></div> // 此时 otherClass中的px应该被忽略

   这个功能看起来应该不能通过postcss实现，但是我在vue的SFC中用这种写法却可以被插件处理:

   
   <template>
   <div class="my-ignore-class otherClass"></div>
   </template>