支持支付宝小程序启用2.0构建

[biluochun]

这个特性解决了什么问题？

支付宝小程序很多API需要用到 基础库2.X
比如Taro.onPageNotFound，在 Taro 3.3.5 构建后支付宝小程序环境内直接报错：TypeError: _tarojs_taro__WEBPACK_IMPORTED_MODULE_4___default.a.onPageNotFound is not a function;
因为支付宝小程序 该API介绍需要 基础库 2.7.2 或更高版本

目前的问题是，按照支付宝小程序基础库2.x启用文档，勾选【启用小程序基础库 2.0 构建】后编译报错：

Failed to compile
Module build failed (from C:/snapshot/code-repo/out/target/bundle/node_modules/@ali/antcube-thread-loader/lib/cjs.js):
Thread Loader (Worker 0)
slot 的祖先节点中未找到 element
at (d:\xxx\dist\alipay\base.axml:319:8)
317: 
318: <template name="tmpl_0_slot">
319:   <view slot="{{i.name}}"  id="{{i.uid}}">
             ^
320:     <block a:for="{{i.cn}}" a:key="uid">
321:       <template is="{{xs.e(0)}}" data="{{i:item}}" />

at (d:\xxx\dist\alipay\base.axml:319:8)
Module build failed (from C:/snapshot/code-repo/out/target/bundle/node_modules/@ali/antcube-thread-loader/lib/cjs.js):
Thread Loader (Worker 0)
slot 的祖先节点中未找到 element
at (d:\xxx\dist\alipay\pages-qr\pages\qrBarCode\qrBarCode.axml:321:8)
319: 
320: <template name="tmpl_0_slot">
321:   <view slot="{{i.name}}"  id="{{i.uid}}">
             ^
322:     <block a:for="{{i.cn}}" a:key="uid">
323:       <template is="{{xs.e(0)}}" data="{{i:item}}" />

at (d:\xxx\dist\alipay\pages-qr\pages\qrBarCode\qrBarCode.axml:321:8)
Module build failed (from C:/snapshot/code-repo/out/target/bundle/node_modules/@ali/antcube-thread-loader/lib/cjs.js):
Thread Loader (Worker 0)
slot 的祖先节点中未找到 element
at (d:\xxx\dist\alipay\pages\citySwitch\index.axml:321:8)
319: 
320: <template name="tmpl_0_slot">
321:   <view slot="{{i.name}}"  id="{{i.uid}}">
             ^
322:     <block a:for="{{i.cn}}" a:key="uid">
323:       <template is="{{xs.e(0)}}" data="{{i:item}}" />

at

这个 API 长什么样？

支持在支付宝小程序内勾选 【启用小程序基础库 2.0 构建】

[Chen-jj]

@biluochun 这个报错好像不是必现，可以提供一下 Demo 吗？

[qsjc]

我前面也提过issue 开了基础库2就会直接报祖先节点找不到的错误 而且现在支付宝小程序很多api都是2.0以上才支持

[biluochun]

@biluochun 这个报错好像不是必现，可以提供一下 Demo 吗？
我再去启动2.0构建时，发现当前的项目报错变成了 获取 ext 信息为undefined，后查支付宝文档发现是模板小程序开发的文档有变更：https://opendocs.alipay.com/mini/isv/creatminiapp
（未启用2.0构建时是配置在app.config.ts: ext: {} ）
按照文档配置了ext.json后，发现没有上面的slot 的祖先节点中未找到 element 这种报错信息出现了。
目前暂时没有复现，已经正常启用2.0构建。

[qsjc]

demo项目不会有问题 当项目大起来有点复杂度的时候直接就歇菜了 我们这边是写了很多之后开启2.0发现直接就报错了 想找原因都很难找到

[biluochun]

demo项目不会有问题 当项目大起来有点复杂度的时候直接就歇菜了 我们这边是写了很多之后开启2.0发现直接就报错了 想找原因都很难找到

试一下删代码排错。删除一半的代码，定位原因在哪一半。持续删下去。

[qsjc]

@biluochun @Chen-jj
当前我在项目中验证到的情况是如果我在组件中使用了<slot></slot> 那么就会出现上述情况
然后我在官方的NumberSubmit组件中加入插槽<slot></slot>标签 然后也出现了上述现象

[XGHeaven]

@Chen-jj 直接原因是支付宝不再支持 slot 在祖先没有非实体元素内，例如

<template>
  <!-- compile error -->
  <view slot="content"></view>
</template>

<some-demo>
  <!-- works -->
  <view slot="content"></view>
</some-demo>

当然不止 template，还有 block 也是这样的。

[Chen-jj]

备忘：

在支付宝小程序的所有 axml 模板中，把第三方自定义组件的 children 变为这样就可以在支付宝 2.0 正常使用 slot 了：

<!-- 假设有一个第三方原生组件 article  -->
<template name="tmpl_0_article">
  <article text="{{ i.text }}"  id="{{i.uid}}">
    <block a:for="{{i.cn}}" a:key="uid">
      <!-- 子元素是 slot 时，直接处理，不再去引用 template -->
      <view a:if="{{item.nn==='slot'}}" slot="{{item.name}}" id="{{item.uid}}">
        <block a:for="{{item.cn}}" a:key="uid">
          <template is="{{xs.e(0)}}" data="{{i:item}}" />
        </block>
      </view>
      <!-- 子元素是普通节点时正常引用 template -->
      <template a:else is="{{xs.e(0)}}" data="{{i:item}}" />
    </block>
  </article>
</template>

除了修改 @tarojs/plugin-plaftorm-alipay 去处理模板之外，还需要修改 @tarojs/mini-runner 里的 src/plugins/TaroNormalModulesPlugin，把

prop.properties
  .filter(p => p.type === 'Property' && p.key.type === 'Identifier')
  .forEach(p => attrs.add(p.key.name))

改为：

prop.properties
  .filter(p => p.type === 'Property' && p.key.type === 'Identifier' && p.key.name !== 'children')
  .forEach(p => attrs.add(p.key.name))

---

下个版本处理

[qsjc]

新的版本似乎并没有解决slot 的祖先节点中未找到 element的问题呀

[Chen-jj]

新的版本似乎并没有解决slot 的祖先节点中未找到 element的问题呀

还没发版，等等这周发 3.3.17

[git-onepixel]

新的版本似乎并没有解决slot 的祖先节点中未找到 element的问题呀

还没发版，等等这周发 3.3.17

Chen-jj 你好，我已经升到了3.3.17，但这个问题依然存在

[git-onepixel]

1.问题反馈：已经升到了3.3.17, slot 的祖先节点中未找到 element 依然存在。

2.依赖包更新列表：
"@tarojs/components": "3.3.17",
"@tarojs/react": "3.3.17",
"@tarojs/runtime": "3.3.17",
"@tarojs/taro": "3.3.17",
"@hb/codestyle-linter": "3.7.17",
"@tarojs/mini-runner": "3.3.17",
"@tarojs/plugin-platform-alipay": "3.3.17",
"@tarojs/plugin-platform-jd": "3.3.17",
"@tarojs/plugin-platform-qq": "3.3.17",
"@tarojs/plugin-platform-swan": "3.3.17",
"@tarojs/plugin-platform-tt": "3.3.17",
"@tarojs/plugin-platform-weapp": "3.3.17",
"@tarojs/webpack-runner": "3.3.17",
"babel-preset-taro": "3.3.17",

3.错误信息：
Module build failed (from /snapshot/code-repo/out/target/bundle/node_modules/@ali/antcube-thread-loader/lib/cjs.js):
Thread Loader (Worker 0)
slot 的祖先节点中未找到 element
at (/Users/xxx/base.axml:319:8)

  <template name="tmpl_0_slot-view">
    <view slot="{{i.name}}"  id="{{i.uid}}">
             ^
    <block a:for="{{i.cn}}" a:key="uid">
  <template is="{{xs.e(0)}}" data="{{i:item}}" />

4.前置操作：更新版本号后，删除node_modules 重新安装构建

[Chen-jj]

@git-onepixel 是使用的 taro vue 么

依赖里找 @tarojs/plugin-platform-alipay，找到这里，加一行 delete result['slot-view'] 试试

[git-onepixel]

@git-onepixel 是使用的 taro vue 么

依赖里找 @tarojs/plugin-platform-alipay，找到这里，加一行 delete result['slot-view'] 试试

我用的是taro+react，你的方法我再试试！

[Naico]

@git-onepixel 是使用的 taro vue 么
依赖里找 @tarojs/plugin-platform-alipay，找到这里，加一行 delete result['slot-view'] 试试

我用的是taro+react，你的方法我再试试！

我也用的是Taro+React，用这个方法试了试，OK的

[git-onepixel]

delete result['slot-view']

加上 delete result['slot-view'] 就可以了，通过 patch-package 已解决该问题。

[Chen-jj]

@git-onepixel @Naico 尴尬，应该是测试时漏了这种情况，下个版本修复的。

[l644738595]

下个版本 啥时候 啊啊啊 快要上线了

[ZakaryCode]

下个版本 啥时候 啊啊啊 快要上线了

milestone 上面剩下几个搞定就发版，预计明天就可以

[l644738595]

下个版本 啥时候 啊啊啊 快要上线了

milestone 上面剩下几个搞定就发版，预计明天就可以

好的 感谢 我用的3.4.beta 记得也合并发布下