v3 版本改动前瞻

将会有什么改动？

v3 版本主要是删去一些过时的功能，配置项，同时会改变插件的默认值，使得整体插件变得更易用，更容易安装假如你没有用到什么自定义配置，那么恭喜你，完全可以平滑升级上来。

配置项改动

删除的配置项

删去 replaceUniversalSelectorWith 选项，使用 cssSelectorReplacement.universal 来代替
删去 minifiedJs 选项，现在完全遵从用户的配置，用户压缩就压缩，反之亦然
删去 jsEscapeStrategy 选项，现在默认只有一种模式 replace/ 不再提供 regenerate 模式
删去 customReplaceDictionary 的 complex 模式，只内置 simple 模式 (你如果还要 complex 模式 ,可以从 '@weapp-core/escape' 引入，再传入 customReplaceDictionary 配置项即可)
cssMatcher/htmlMatcher/jsMatcher/ mainCssChunkMatcher / wxsMatcher 不再能够传入 glob 表达式(**/*.html 这种)，现在都是传入一个方法: (name: string) => boolean
cssPreflightRange 只存在一种模式，为 all, 之前的 view 选项交给 cssSelectorReplacement.universal 进行托管

增加的配置项

rem2rpx : type rem2rpx?: boolean | rem2rpxOptions rem 转 rpx 配置，默认为 false，不开启，可传入配置项，配置项见 https://www.npmjs.com/package/postcss-rem-to-responsive-pixel 这个配置项代表插件内置了 postcss-rem-to-responsive-pixel ，不过默认不开启，传入一个 true 可以开启:
```
  // 32 意味着 1rem = 32rpx
  rootValue: 32,
  // 默认所有属性都转化
  propList: ['*'],
  // 转化的单位,可以变成 px / rpx
  transformUnit: 'rpx',
```
这样的配置，当然你也可以传入 rem2rpxOptions 这样一个 object

为什么默认不开启？

为了从 2.x 版本可以平滑的过渡到 3.x
从我的视角看，内置 postcss 虽然整体集成度上更高了，但是对其他开发者可能不是那么自由，比如在 2.x 时候，由于 postcss-rem-to-responsive-pixel 是外置的，所以开发者可以自由的决定它的加载顺序，不像内置之后都是我决定的。不过内置好处也有，就是开箱即用

增强的配置项

cssChildCombinatorReplaceValue, cssSelectorReplacement.root,cssSelectorReplacement.universal 现在都可以接受字符串数组了，它们可以自动展开，防止选择器格式化错误问题

修改的默认值

cssPreflightRange 从 'view' 变为 undefined, 现在 all 的作用变成了在 tailwindcss 变量注入区域的选择器，添加一个 :not(not) 的选择器作为全局选择器的替代
cssSelectorReplacement.universal 从 'view' 变为 ['view', 'text'], 这意味着 * 选择器会被展开成 view,text 以及对应方式
cssChildCombinatorReplaceValue 从 'view + view' 变为 ['view']
replaceUniversalSelectorWith,jsEscapeStrategy 选项被删除

现在选项合并，数组默认行为变为覆盖，原先是合并：

const options = getOptions(input,defaults)
defaults: ['a','b'], input:['c'] 
// before: 
options == ['a','b','c']
// after:
options == ['c']

原因解释

cssChildCombinatorReplaceValue

在 tailwindcss h5 环境中, space-y-4 这类的类名默认会生成这样的选择器: .space-y-4>:not([hidden])~:not([hidden])

不过很遗憾，这种选择器在小程序里会直接挂掉，因为小程序中 ~(后续兄弟选择器) 是非常受限的，包括 .space-y-2>view ~ view 这种选择也会在小程序里面之间挂掉，所以不得以使用了 +(接续兄弟组合器)，这2个选择的区别主要在于后一个元素是否紧挨着前一个元素。类似于 .space-y-2>view + view，但是这样又存在缺陷了，也就是说必须是紧挨着的 view 才会生效, 所以：

    <view class="space-y-2">
      <view>view0</view>
      <view>view1</view>
      <text>text0</text>
      <view>view2</view>
      <text>text1</text>
    </view>

只有 view1 会生效 mt-2 的距离，cssChildCombinatorReplaceValue 是一个解决方案，你可以这样设置: cssChildCombinatorReplaceValue: ['view', 'text'] (其实没有必要把 'text' 加入进来，因为它默认是 inline 的，在布局方面给上下外边距无效，除非你改成 block/inline-block 这种，那还不如使用 view 呢), 它会生成这样的选择器:

.space-y-2>view + view,.space-y-2>view + text,.space-y-2>text + view,.space-y-2>text + text

什么！为什么这么长？？因为只有这样才能让 view, text 标签不论怎么排列都有效，这就是代价，假如你传入更多选项，它还会变得更长:

cssChildCombinatorReplaceValue: ['view', 'text', '.ice']: .space-y-2>view:not(.weapp-tw-ig) + view:not(.weapp-tw-ig),.space-y-2>view:not(.weapp-tw-ig) + text:not(.weapp-tw-ig),.space-y-2>view:not(.weapp-tw-ig) + .ice,.space-y-2>text:not(.weapp-tw-ig) + view:not(.weapp-tw-ig),.space-y-2>text:not(.weapp-tw-ig) + text:not(.weapp-tw-ig),.space-y-2>text:not(.weapp-tw-ig) + .ice,.space-y-2>.ice + view:not(.weapp-tw-ig),.space-y-2>.ice + text:not(.weapp-tw-ig),.space-y-2>.ice + .ice

那只传入一个 ':not(n)' 可以嘛，不行 .space-y-2>:not(n) + :not(n) 之间报错挂掉了。因为 > 在小程序里面也存在着诸多限制，后面之间跟伪类会挂。

sonofmagic / weapp-tailwindcss

v3 大版本改动与迁移 #259