无法解析模块 `metro/src/lib/bundle-modules/HMRClient`

Question

我刚刚从 RN 0.55.4 升级到 0.59.3.....现在出现以下错误：

错误：无法从...\node_modules\react-native\Libraries\Utilities\HMRClient.js 解析模块metro/src/lib/bundle-modules/HMRClient：模块metro/src/lib/bundle-modules/HMRClient 确实急速模块图中不存在

HMRClient.js 文件确实包含以下 require 语句： const MetroHMRClient = require('metro/src/lib/bundle-modules/HMRClient');.....而且我在任何地方都看不到以“metro”开头的路径，所以我想我需要以某种方式添加它。还有另一个 require 语句如下：const invariant = require('invariant');....也不存在文件名“invariant”。

Facebook 表示这个问题已在 0.53.0 master 中修复，但看起来又回到了 https://github.com/facebook/react-native/issues/17742

下面是我的 package.json

{
  "name": "xs",
  "version": "0.0.1",
  "private": true,
  "scripts": {
    "start": "node node_modules/react-native/local-cli/cli.js start",
    "test": "jest",
    "flow": "flow",
    "flow start": "flow start",
    "flow stop": "flow stop",
    "flow status": "flow status",
    "flow coverage": "flow coverage"
  },
  "dependencies": {
    "firebase": "^5.11.1",
    "flow": "^0.2.3",
    "flow-bin": "^0.65.0",
    "prop-types": "^15.6.1",
    "react": "16.8.3",
    "react-native": "0.59.3",
    "react-native-elements": "^0.19.0",
    "react-native-google-places-autocomplete": "^1.3.9",
    "react-native-maps": "git://github.com/react-native-community/react-native-maps.git#master",
    "react-native-switch": "^1.4.0",
    "react-native-vector-icons": "^4.5.0",
    "react-navigation": "^2.5.5",
    "react-redux": "^5.1.0",
    "redux": "^4.0.1",
    "redux-thunk": "^2.3.0"
  },
  "devDependencies": {
    "babel-eslint": "^8.2.6",
    "babel-preset-flow": "^6.23.0",
    "eslint": "^4.9.0",
    "eslint-config-airbnb": "^16.1.0",
    "eslint-plugin-import": "^2.17.3",
    "eslint-plugin-jsx-a11y": "^6.2.1",
    "eslint-plugin-react": "^7.13.0",
    "prettier-eslint": "^8.8.2",
    "@babel/core": "^7.4.3",
    "@babel/runtime": "^7.4.3",
    "babel-jest": "^24.7.1",
    "jest": "^24.7.1",
    "metro-react-native-babel-preset": "^0.53.1",
    "react-test-renderer": "16.8.3"
  },
  "jest": {
    "preset": "react-native"
  }
}

请帮忙！

ps以下建议不起作用

要解决此问题，请尝试以下操作： 1. 清除看守员手表：watchman watch-del-all。2. 删除node_modules文件夹：rm -rf node_modules && npm install。3. 重置 Metro Bundler 缓存：rm -rf /tmp/metro-bundler-cache-*或npm start -- --reset-cache。4. 删除加速缓存：rm -rf /tmp/haste-map-react-native-packager-*。

Answer 1

运行的时候注意看看npm install是否需要某个特定版本的东西。

首先检查 babel 配置文件，如果不起作用，请尝试更改package.json.

尝试如下配置文件和依赖项。这是一个适用于我从 0.54 更新到 0.59.5 的配置：

包.json：

  " dependencies": {
         "react": "16.8.3",
         "react-native": "0.59.5",
         // ...
  },

  "devDependencies": {
    "@babel/core": "^7.0.0-0",
    "babel-core": "^7.0.0-bridge.0",
    "metro-react-native-babel-preset": "0.53.0",
    "react-test-renderer": "16.6.3",
    // ...
  }

babel.config.js：

module.exports = {
  presets: ['module:metro-react-native-babel-preset'],
};

.babelrc：

{
  "presets": ["module:metro-react-native-babel-preset"]
}

我在 RN 发行说明中找到的有关 babel 和 Metro 更改的唯一有用信息位于 [0.57]：

https://github.com/react-native-community/releases/blob/master/CHANGELOG.md

更新说明：

尝试将配置文件作为新工作项目（使用 0.59.9 创建）中的配置文件似乎不适用于从 0.54 到 0.59 的更新

babel.config.js：

module.exports = {
  presets: ['module:metro-react-native-babel-preset'],
};

Metro.config.js：

module.exports = {
  transformer: {
    getTransformOptions: async () => ({
      transform: {
        experimentalImportSupport: false,
        inlineRequires: false,
      },
    }),
  },
};

并且没有.babelrc文件。

包.json：

"devDependencies": {
    "@babel/core": "^7.4.5",
    "@babel/runtime": "^7.4.5",
    "metro-react-native-babel-preset": "^0.54.1",
  },