代码之家  ›  专栏  ›  技术社区  ›  J. Hesters

正在加载React Native:UnhandledPromisejectionWarning:错误:找不到模块“View”

  •  0
  • J. Hesters  · 技术社区  · 7 年前

    react-test-renderer 喜欢 react-native-testing-library 做。

    react-native 作为开发人员依赖项与 metro-react-native-babel-preset . 此外,我还为babel添加了预设。

    {
      "presets": [
        [
          "env",
          {
            "targets": {
              "browsers": ["last 2 versions", "safari >= 7"]
            }
          }
        ],
        "react",
        "module:metro-react-native-babel-preset"
      ]
    }
    

    tape .

    现在,每次测试( npm test )抛出错误:

    > node -r babel-register -r babel-polyfill source/test
    /path/to/node_modules/babel-core/lib/transformation/file/options/option-manager.js:328
            throw e;
            ^
    
    Error: Couldn't find preset "module:metro-react-native-babel-preset" relative to directory
    

    (node:1841) UnhandledPromiseRejectionWarning: Error: Cannot find module 'View'
        at Function.Module._resolveFilename (internal/modules/cjs/loader.js:581:15)
        at Function.Module._load (internal/modules/cjs/loader.js:507:25)
        at Module.require (internal/modules/cjs/loader.js:637:17)
        at require (internal/modules/cjs/helpers.js:22:18)
        at Object.get View [as View] (/path/to/node_modules/react-native/Libraries/react-native/react-native-implementation.js:165:12)
        at _callee7$ (/path/to/source/test.js:110:6)
        at tryCatch (/path/to/node_modules/babel-polyfill/node_modules/regenerator-runtime/runtime.js:65:40)
        at Generator.invoke [as _invoke] (/path/to/node_modules/babel-polyfill/node_modules/regenerator-runtime/runtime.js:303:22)
        at Generator.prototype.(anonymous function) [as next] (/path/to/node_modules/babel-polyfill/node_modules/regenerator-runtime/runtime.js:117:21)
        at step (/path/to/source/test.js:27:191)
    (node:1841) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). (rejection id: 3)
    (node:1841) [DEP0018] DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code.
    not ok 10 test exited without ending
      ---
        operator: fail
        at: process.<anonymous> (/path/to/node_modules/tape/index.js:90:19)
        stack: |-
          Error: test exited without ending
              at Test.assert [as _assert] (/path/to/node_modules/tape/lib/test.js:226:54)
              at Test.bound [as _assert] (/path/to/node_modules/tape/lib/test.js:77:32)
              at Test.fail (/path/to/node_modules/tape/lib/test.js:319:10)
              at Test.bound [as fail] (/path/to/node_modules/tape/lib/test.js:77:32)
              at Test._exit (/path/to/node_modules/tape/lib/test.js:191:14)
              at Test.bound (/path/to/node_modules/tape/lib/test.js:77:32)
              at process.<anonymous> (/path/to/node_modules/tape/index.js:90:19)
              at process.emit (events.js:194:15)
    

    如何让React本机组件在库中的测试中运行(并且在 expo init react-native init

    编辑: 我发现repo使用的是babel6,这就是metro预设似乎不起作用的原因。所以我把它换成了 babel-preset-react-native View 找不到。

    编辑2: package.json

      "scripts": {
        "lint": "eslint source && echo 'Lint complete.'",
        "typecheck": "npx -p typescript tsc --rootDir . source/test.js --allowJs --checkJs --noEmit --lib es6 --jsx react && echo 'TypeScript check complete.'",
        "ts": "npm run -s typecheck",
        "test": "node -r babel-register -r babel-polyfill source/test",
        "watch": "watch 'clear && npm run -s test | tap-nirvana && npm run -s lint && npm run -s typecheck' source",
        "precommit": "npm run -s test && npm run -s lint && npm run -s typecheck"
      },
      "devDependencies": {
        "@types/node": "10.12.27",
        "babel-cli": "6.26.0",
        "babel-eslint": "10.0.1",
        "babel-preset-env": "1.7.0",
        "babel-preset-react": "6.24.1",
        "babel-preset-react-native": "4.0.1",
        "babel-register": "6.26.0",
        "eslint": "5.14.1",
        "eslint-plugin-react": "7.12.4",
        "react": "16.8.3",
        "react-native": "0.58.5",
        "tap-nirvana": "1.1.0",
        "typescript": "3.3.3333",
        "watch": "1.0.2"
      },
      "dependencies": {
        "cheerio": "1.0.0-rc.2",
        "esm": "3.2.6",
        "react-dom": "16.8.3",
        "react-test-renderer": "16.8.3",
        "tape": "4.10.1"
      }
    

    编辑3: 很抱歉,显然我没有包含我的代码,尽管它对解决这个问题很有帮助。这很基本。我只是想呈现一个 <View /> 使用 ReactTestRenderer .

    import TestRenderer from 'react-test-renderer';
    import { Text, View } from 'react-native';
    import { describe } from 'riteway';
    
    describe('renderReactNativeComponent', async assert => {
      const text = 'Foo';
      const component = TestRenderer.create(
        <View>
          <Text>{text}</Text>
        </View>
      );
      console.log(Text);
    
      assert({
        given: 'A React Native component',
        should: 'return a working react test renderer instance',
        actual: component.findByType('text'),
        expected: text
      });
    });
    
    0 回复  |  直到 7 年前
        1
  •  1
  •   diogenesgg    7 年前

    根据 docs 从react native版本0.38开始,运行react native init时默认包括Jest安装程序。“ .

    以及

    “用一个笑话预设来回应本地船只,所以开玩笑你的领域包.json应该指向react native。预设是一个节点环境,模拟React本机应用程序的环境。因为它不加载任何DOM或浏览器API,所以大大缩短了Jest的启动时间。”

    关键是,Jest应该和React Native一起工作,而且 riteway 不是。当你跑的时候 react-native init 添加了以下依赖项: "jest-react-native" package.json :

    "jest": {
       "preset": "react-native"
    }
    

    显然,riteway还没有任何预设。

        2
  •  1
  •   Hrishi    7 年前

    卸下节点模块,然后重新安装

    rm -rf node_modules
    npm install
    
        3
  •  0
  •   Mr. Strike    7 年前

    你没有返回任何东西,你需要返回一个“视图”

        4
  •  0
  •   Subhendu Kundu    7 年前

    您可能只想使用中建议的示例 https://reactjs.org/docs/test-renderer.html 只是为了确保你写的代码没有错,然后加上你自己的逻辑来改进它(只是一个调试它的想法)。可能是加起来的 https://snack.expo.io ? 或者github,我会帮你调试。

    推荐文章