Ionic React项目使用Expo运行时Android打包失败：Stencil Core中存在无效调用

看起来你在第一次尝试用Expo运行Ionic React项目时踩了打包的坑，之前用ionic serve好好的，换Expo就出问题，这种情况大多是Stencil Core（Ionic组件的底层依赖）和Expo Metro打包器的兼容问题，我之前帮好几个开发者解决过类似的问题，给你几个实用的排查方向：

• 检查并调整Stencil Core版本
  旧版的@stencil/core和新版Expo Metro的模块解析逻辑不兼容是常见原因。你可以先尝试升级到最新稳定版：

  npm install @stencil/core@latest --save-dev
  

  如果升级后还是报错，回退到经过验证的兼容版本（比如4.7.0，这个版本和Expo 49+适配得不错）：

  npm install @stencil/core@4.7.0 --save-dev
  

• 配置Metro打包器适配Stencil
  Expo的Metro打包器默认不会处理Stencil的编译输出，需要手动在项目根目录的metro.config.js里添加规则：

  const { getDefaultConfig } = require('expo/metro-config');
  
  const config = getDefaultConfig(__dirname);
  
  // 让Metro正确识别Stencil的各类模块文件
  config.resolver.sourceExts.push('jsx', 'js', 'ts', 'tsx', 'cjs');
  config.transformer.getTransformOptions = async () => ({
    transform: {
      experimentalImportSupport: false,
      inlineRequires: true,
    },
  });
  
  // 排除Stencil的内部测试文件和类型定义，避免打包冲突
  config.resolver.blockList = [/\.stencil\.d\.ts$/, /__tests__\/.*/];
  
  module.exports = config;
  

• 彻底清理缓存后重新构建
  缓存导致的打包玄学问题真的不少，先把Expo和npm的缓存清干净：

  npx expo start --clear
  npm cache clean --force
  

  接着删除依赖目录和锁文件，重新安装依赖：

  rm -rf node_modules package-lock.json yarn.lock
  npm install
  

• 确保Ionic和Expo版本匹配
  版本不兼容也会触发各种奇怪的报错，你可以先查看当前的版本组合：

  npm list @ionic/react expo
  

  比如Expo 49+建议搭配Ionic 7.x版本，不匹配的话可以调整：

  npm install @ionic/react@7.0.0 expo@49.0.0
  

• 排查代码中的无效调用
  从你提到的“Stencil Core中存在无效调用”报错来看，可能是你代码里直接调用了Stencil的内部API（比如@stencil/core的h或render方法），而Expo环境下只认React的API。检查你的代码，把这类调用替换成React的对应方法（比如React.createElement）。

如果试完这些还是没解决，你可以把报错的具体日志内容贴出来，我再帮你针对性排查～

内容来源于stack exchange