React Native iOS Release构建Tree Shaking致函数未定义问题求助

问题分析 #

1. 块级作用域函数声明的兼容性问题：你将onAppleLogin函数声明放在if块内部，这种写法在严格模式下属于不规范语法。Debug模式下JS引擎对语法的容忍度较高，而Release模式下代码压缩工具（如Terser）会执行tree-shaking优化，判定该函数未被直接引用，将其移除导致变为undefined。
2. 语法错误导致判断失效：代码中typeof onAppleLogin !== function存在错误，typeof返回的是字符串类型，正确写法应为typeof onAppleLogin !== 'function'，这个错误会导致判断逻辑异常。

修复方案 #

1. 修正变量声明方式 #

提前用let声明变量，将块内的函数声明改为函数表达式赋值，确保变量作用域覆盖后续使用场景，避免被优化工具误删：

import ...;

let onAppleLogin; // 提前声明变量，确保作用域覆盖
const {PLATFORM} = Config;
if(PLATFORM === 'APN'){
   // 改用函数表达式赋值
   onAppleLogin = async function(callback = ()=>{}){
       // some logic here
   }
}

class LoginPage extends React.Component{
   onAppleBtnPres = () => {
       console.log(typeof onAppleLogin);

       // 修正typeof判断的字符串引号
       if(typeof onAppleLogin !== 'function'){
          // some logic here
          return false
       }

       onAppleLogin(()=>{
          // some logic here
       })
   }

   render(){
      return (
         <Button 
             onPress={this.onAppleBtnPres} 
             title="Apple Sign In"
         />
      ) // 补充缺失的闭合括号
   }
}

2. 修复代码语法漏洞 #

补充render方法中return语句的闭合括号，以及<Button>组件的闭合标签，避免编译阶段出现错误。

内容的提问来源于stack exchange，提问作者jian