Expo裸工作流中missing-asset-registry-path解析失败及资源加载问题求助

原本基于SDK 49的Expo Bare Workflow项目运行正常，但执行expo-doctor时出现大量Gradle和依赖相关错误。听从建议新建项目后，expo-doctor检测无异常，但出现SVG、PNG及字体加载问题：

• 提示无法从node_modules/@expo-google-fonts/poppins/Poppins_100Thin.ttf解析missing-asset-registry-path
• 移除谷歌字体后，又出现PNG或SVG的同类报错
  已尝试更新依赖、降级Expo、清除缓存等方案，问题仍存在，因项目复杂度高不愿重新搭建。

项目的package.json配置如下：

"dependencies": {
    "@babel/preset-env": "^7.23.9",
    "@expo-google-fonts/poppins": "^0.2.3",
    "@firebase/firestore": "^4.4.2",
    "@gorhom/bottom-sheet": "^4.6.1",
    "@react-native-firebase/app": "^19.0.0",
    "@react-native-firebase/auth": "^19.0.0",
    "@react-native/babel-preset": "^0.73.21",
    "@react-navigation/native": "^6.1.12",
    "@react-navigation/stack": "^6.3.23",
    "@reduxjs/toolkit": "^2.2.1",
    "@types/react": "~18.2.45",
    "@types/styled-components": "^5.1.34",
    "dotenv": "^16.4.5",
    "expo": "~50.0.7",
    "expo-asset": "~9.0.2",
    "expo-checkbox": "~2.7.0",
    "expo-clipboard": "~5.0.1",
    "expo-constants": "~15.4.5",
    "expo-dev-client": "^3.3.8",
    "expo-image-manipulator": "~11.8.0",
    "expo-image-picker": "~14.7.1",
    "expo-splash-screen": "~0.26.4",
    "expo-status-bar": "~1.11.1",
    "expo-system-ui": "^2.9.3",
    "expo-updates": "~0.24.11",
    "firebase": "^10.8.0",
    "lodash": "^4.17.21",
    "phosphor-react-native": "^2.0.0",
    "react": "18.2.0",
    "react-native": "0.73.4",
    "react-native-bouncy-checkbox": "^3.0.7",
    "react-native-dotenv": "^3.4.10",
    "react-native-dropdown-picker": "^5.4.6",
    "react-native-element-dropdown": "^2.10.1",
    "react-native-gesture-handler": "2.14.0",
    "react-native-get-random-values": "1.8.0",
    "react-native-paper": "^5.12.3",
    "react-native-reanimated": "3.6.2",
    "react-native-safe-area-context": "4.8.2",
    "react-native-svg": "^14.1.0",
    "react-native-svg-transformer": "^1.3.0",
    "react-native-vector-icons": "^10.0.3",
    "react-redux": "^9.1.0",
    "styled-components": "^6.1.8",
    "typescript": "^5.3.0",
    "uuid": "^9.0.1"
  },
  "devDependencies": {
    "@babel/core": "^7.20.0",
    "@types/uuid": "^9.0.7",
    "typescript": "^5.1.3"
  },

1. 修复Asset Registry配置 #

Expo SDK 50调整了资源加载逻辑，需确保metro.config.js配置正确的资源解析规则：

const { getDefaultConfig, mergeConfig } = require('@react-native/metro-config');
const config = {};

module.exports = mergeConfig(getDefaultConfig(__dirname), {
  resolver: {
    assetExts: ['ttf', 'png', 'svg', 'jpg'],
    sourceExts: ['js', 'jsx', 'json', 'ts', 'tsx', 'svg'],
  },
  transformer: {
    babelTransformerPath: require.resolve('react-native-svg-transformer'),
  },
});

同时，使用expo-asset的标准API加载资源，比如字体：

import { Asset } from 'expo-asset';
import { Poppins_100Thin } from '@expo-google-fonts/poppins';

async function loadFonts() {
  await Asset.loadAsync(Poppins_100Thin);
}

2. 统一依赖版本冲突 #

package.json中typescript同时在dependencies和devDependencies存在不同版本，会导致编译冲突：

• 删除dependencies中的typescript条目，仅保留devDependencies里的版本（或统一升级至同一版本）
• 执行rm -rf node_modules package-lock.json yarn.lock && npm install重新安装依赖

3. 彻底清除缓存 #

执行以下命令清除深层缓存：

• npx expo start --clear
• Android构建缓存：cd android && ./gradlew clean && cd ..
• iOS构建缓存：cd ios && pod deintegrate && pod install && cd ..

4. 修正Babel配置 #

替换@react-native/babel-preset为Expo官方预设，确保babel.config.js适配SDK 50：

module.exports = function(api) {
  api.cache(true);
  return {
    presets: ['babel-preset-expo'],
    plugins: [
      'react-native-reanimated/plugin',
      ['module:react-native-dotenv', {
        moduleName: '@env',
        path: '.env',
      }]
    ],
  };
};

然后卸载@react-native/babel-preset依赖：npm uninstall @react-native/babel-preset

5. 验证SVG加载配置 #

确保SVG文件以ES模块方式导入：

import MyIcon from './assets/my-icon.svg';

避免使用require()加载SVG，同时确认react-native-svg版本与React Native 0.73兼容（当前^14.1.0符合要求）

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