使用汇总创建React Tree Shakable库

问题描述

我正在尝试使用Rollup为我们的组件构建一个React库。

这些组件使用样式化组件，某些组件被摇晃，而其他组件则没有。 我已经找到了问题所在，并且不是摇树的一个组件正在调用递归函数：

const recursiveCloneChildren = (children,textColor) => React.Children.map(children,(child) => {
  if (!React.isValidElement(child)) return child;
  const childProps = { color: textColor };
  childProps.children = recursiveCloneChildren(child.props.children,textColor);
  return React.cloneElement(child,childProps);
});

rollup.config.js

const commonPlugins = [
  babel({
    babelHelpers: 'bundled',exclude: ['node_modules/**','../../node_modules/**']
  }),resolve({
    extensions: ['.js','.jsx'],}),commonjs(),image()
];

const configBase = {
  input: './src/index.js',external: ['react','react-dom','styled-components','prop-types'],plugins: commonPlugins,};

export default [
  {
    ...configBase,output: [
      {
        file: pkg.module,format: 'esm',},{
        file: pkg.main,format: 'cjs',}
    ],}
];

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）