Expo项目添加NativeWind时遇Android打包失败及Babel配置错误求助

这个错误源于Babel插件版本不兼容或配置冲突，以下是具体解决步骤：

• 统一Babel依赖版本
  卸载可能冲突的旧插件，安装适配版本：

  npm uninstall babel-plugin-react-native-classname-to-style
  npm install babel-plugin-react-native-classname-to-style@^1.2.2 --save-dev
  

  确保@babel/core版本与Expo、NativeWind兼容（Expo 49+建议用7.20+版本）：

  npm install @babel/core@^7.20.0 --save-dev
  

• 修正Babel配置文件
  打开babel.config.js，确保NativeWind插件放在Expo Router插件之前，且不要手动添加visitor相关自定义选项：

  module.exports = function (api) {
    api.cache(true);
    return {
      presets: ['babel-preset-expo'],
      plugins: [
        "nativewind/babel",
        require.resolve("expo-router/babel"),
      ],
    };
  };
  

• 清理缓存并重装依赖
  清除Expo和npm缓存：

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

  删除依赖目录和锁文件后重新安装：

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

• 验证版本兼容性
  确保NativeWind版本适配当前Expo版本，例如Expo 49对应NativeWind ^2.0.11：

  npm install nativewind@^2.0.11 --save-dev
  

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