期望 TARO RN 能够通过开放 babel 配置支持 api 和 components 的组件库拓展功能

[charlzyx]

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

在实际使用 Taro RN 开发的时候, 需要根据公司情况去补充或者调整多个 RN 端的 api 或者 component, 根据当前 babel-preset-taro/rn/index.js 的处理逻辑, 无法做替换, 只能够 fork taro 的库到私有仓库, 但这样做的话, 对于跟进 Taro RN 的更新非常不方便, 因此希望能够开放一个 babel 的配置添加相关 api 和 component 的 extends 和 override 能力.

这个 API 长什么样？

// babel-preset-taro 更多选项和默认值：
// https://github.com/NervJS/taro/blob/next/packages/babel-preset-taro/README.md

module.exports = {
  presets: [
    ['taro', {
      framework: 'react',
      ts: true,
      rnPolyfill: {
         apiListEntry: '@myscope/rn-apis/apiList.js',
         libListEntry: '@myscope/rn-libs/libList.js',
      }
    }],
  ]
}

[zhiqingchen]

需要有api粒度的替换，只想替换一个或多个api时使用。

[charlzyx]

需要有api粒度的替换，只想替换一个或多个api时使用。

调整为

module.exports = {
  presets: [
    ['taro', {
      framework: 'react',
      ts: true,
      rnPolyfill: {
         // 根据同样格式的导出列表, 整体 extends
         // apisMap: '@myscope/rn-apis/apiList.js',
         apisMap: {
             // 细粒度替换: 重名则覆盖, 不存在则新增
             storageSync: '@myscope/dist/storageSync/index.js',
         },
         // 根据同样格式的导出列表, 整体 extends
         // libsMap: '@myscope/rn-libs/libList.js',
         libsMap: {
             // 细粒度替换: 重名则覆盖, 不存在则新增
             Map: '@myscope/dist/mymap/index.js',
         }
      }
    }],
  ]
}

这样?

[zhiqingchen]

疑问：

1. 对应用开发者来说，不需要区分 apisMap 与 libsMap。
2. 相对路径等如何处理？
3. 组件是否是类似的处理方案？

[charlzyx]

疑问：

1. 对应用开发者来说，不需要区分 apisMap 与 libsMap。
2. 相对路径等如何处理？
3. 组件是否是类似的处理方案？

或者, 更加本源一些, 相当于是在指定各个端的 @tarojs/components 和 @tarojs/taro 这两个仓库的细粒度补丁配置;

module.exports = {
  presets: [
    ['taro', {
      framework: 'react',
      ts: true,
      extends : {
         rn: {
            '@tarojs/components': {
               Map: '@myscope/dist/Map/index.js',
            },
            '@tarojs/taro': {
               storage: '@myscope/dist/storage/index.js',
            }
         },
         [platform]: {
            '@tarojs/components': {
            },
            '@tarojs/taro': {
            }
         }
      }
    }],
  ]
}

[zhiqingchen]

疑问：

1. 对应用开发者来说，不需要区分 apisMap 与 libsMap。
2. 相对路径等如何处理？
3. 组件是否是类似的处理方案？

或者, 更加本源一些, 相当于是在指定各个端的 @tarojs/components 和 @tarojs/taro 这两个仓库的细粒度补丁配置;

module.exports = {
  presets: [
    ['taro', {
      framework: 'react',
      ts: true,
      extends : {
         rn: {
            '@tarojs/components': {
               Map: '@myscope/dist/Map/index.js',
            },
            '@tarojs/taro': {
               storage: '@myscope/dist/storage/index.js',
            }
         },
         [platform]: {
            '@tarojs/components': {
            },
            '@tarojs/taro': {
            }
         }
      }
    }],
  ]
}

是个好想法，可以做个RFC设计，作为议题到 Taro 周会讨论

[zhiqingchen]

@Chen-jj 小程序是否需要以及是否可以做 api/components 替换

[Chen-jj]

根据当前 babel-preset-taro/rn/index.js 的处理逻辑, 无法做替换

这是因为这里的逻辑吗？

taro/packages/babel-preset-taro/rn/index.js

Lines 137 to 158 in c4124e4

	[require('babel-plugin-transform-imports-api').default, {
	packagesApis: new Map([
	['@tarojs/taro', new Set(nativeInterfaces)],
	['@tarojs/taro-rn', new Set(nativeInterfaces)]
	]),
	usePackgesImport: true, // Whether to use packagesImport
	packagesImport: {
	'^@tarojs/components(-rn)?$': {
	transform: '@tarojs/components-rn/dist/components/${member}'
	},
	'^@tarojs/taro(-rn)?$': {
	transform: (importName) => {
	if (nativeLibs.includes(importName)) {
	return `@tarojs/taro-rn/dist/lib/${importName}`
	} else {
	return '@tarojs/taro-rn/dist/api'
	}
	},
	skipDefaultConversion: true
	}
	}
	}],

小程序的组件和 API 扩充是通过 Taro 插件的形式修改，与 eslint preset 无关的。

[zhiqingchen]

这是因为这里的逻辑吗？
是的