N.E.K.O.-RN/metro.config.js at main · yiyiyiyiGKY/N.E.K.O.-RN · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
const { getDefaultConfig } = require('expo/metro-config');
const path = require('path');

const config = getDefaultConfig(__dirname);

// 添加其他可能需要的文件扩展名，但不包括 .js 以避免与 HMR 冲突
config.resolver.assetExts.push('moc3', 'motion3', 'exp3', 'physics3', 'pose3', 'cdi3', 'txt', 'html', 'pcm', 'wav');

// 确保 .js 文件不在 assetExts 中，以免干扰 HMR
config.resolver.assetExts = config.resolver.assetExts.filter(ext => ext !== 'js');

// 配置源文件扩展名优先级
// 保持默认配置，Metro 会根据平台自动选择正确的扩展名
// 默认顺序：平台特定 (.native.*, .ios.*, .android.*, .web.*) > 通用 (.tsx, .ts, .jsx, .js)
const defaultSourceExts = config.resolver.sourceExts || ['js', 'jsx', 'json', 'ts', 'tsx'];
config.resolver.sourceExts = [...defaultSourceExts];

// 解决 Web 平台上 React Native 内部模块导入问题
config.resolver.resolveRequest = (context, moduleName, platform) => {
  // 在 Web 平台上，跳过或重定向 React Native 的内部模块
  if (platform === 'web') {
    // 将 react-native 导入重定向到我们的扩展包装器（包含 TurboModuleRegistry）
    if (moduleName === 'react-native') {
      return {
        type: 'sourceFile',
        filePath: path.resolve(__dirname, 'react-native-web-extended.js'),
      };
    }

    // 不要 shim react-native-web 的任何模块
    if (moduleName.includes('react-native-web')) {
      return context.resolveRequest(context, moduleName, platform);
    }

    // 不要 shim 相对路径导入 - 让 react-native-web 内部的相对导入正常工作
    if (moduleName.startsWith('./') || moduleName.startsWith('../')) {
      return context.resolveRequest(context, moduleName, platform);
    }

    // 处理 React Native 内部模块 - 只匹配绝对路径导入
    if (
      moduleName.startsWith('react-native/Libraries') ||
      moduleName.startsWith('react-native/src/private') ||
      moduleName.startsWith('react-native/src/') ||
      moduleName.includes('ReactDevToolsSettingsManager') ||
      moduleName.includes('setUpReactDevTools') ||
      moduleName.startsWith('@expo/metro-runtime/src/location/install.native') ||
      moduleName.includes('NativeReactNativeFeatureFlags')
    ) {
      console.log('🔄 [Metro] Shimming module for web:', moduleName);
      // 返回一个空的 shim 模块
      return {
        type: 'sourceFile',
        filePath: path.resolve(__dirname, 'metro-web-shims.js'),
      };
    }
  }

  // 使用默认的解析逻辑
  return context.resolveRequest(context, moduleName, platform);
};

// 支持 monorepo 结构
const projectRoot = __dirname;
const workspaceRoot = path.resolve(projectRoot, '.');

config.watchFolders = [workspaceRoot];
config.resolver.platforms = ['native', 'android', 'ios', 'web'];
config.resolver.nodeModulesPaths = [
  path.resolve(projectRoot, 'node_modules'),
  path.resolve(workspaceRoot, 'node_modules'),
];

// 关键：在 workspace 依赖未被正确链接/或尚未 build 时，仍能让 Metro 解析到本地 packages
// 这样 `import 'react-native-live2d'` 会直接指向 `packages/react-native-live2d`（同理 pcm-stream）
config.resolver.extraNodeModules = {
  ...(config.resolver.extraNodeModules || {}),
  'react-native-live2d': path.resolve(projectRoot, 'packages/react-native-live2d'),
  'react-native-pcm-stream': path.resolve(projectRoot, 'packages/react-native-pcm-stream'),
  '@project_neko/common': path.resolve(projectRoot, 'packages/project-neko-common'),
  '@project_neko/request': path.resolve(projectRoot, 'packages/project-neko-request'),
  '@project_neko/components': path.resolve(projectRoot, 'packages/project-neko-components'),
  '@project_neko/audio-service': path.resolve(projectRoot, 'packages/project-neko-audio-service'),
  '@project_neko/live2d-service': path.resolve(projectRoot, 'packages/project-neko-live2d-service'),
  '@project_neko/realtime': path.resolve(projectRoot, 'packages/project-neko-realtime'),
};

module.exports = config;