[英]Loading React Native: UnhandledPromiseRejectionWarning: Error: Cannot find module 'View'
I'm trying to contribute to a testing library. 我正在尝试为测试库做贡献。 The library should provide a wrapper for react-test-renderer like react-native-testing-library does.
该库应该像react-native-testing-library那样提供react-test-renderer的包装器 。
In order to see if my code worked I wrote a simple unit test using the code I wrote for the library. 为了查看我的代码是否有效,我使用我为库编写的代码编写了一个简单的单元测试。 Since this was the first test for React Native I added
react-native
as a dev dependency together with metro-react-native-babel-preset
. 由于这是对React Native的第一次测试,我将
react-native
作为dev依赖项与metro-react-native-babel-preset
。 Furthermore, I added the preset to babel. 此外,我将预设添加到了babel。
{
"presets": [
[
"env",
{
"targets": {
"browsers": ["last 2 versions", "safari >= 7"]
}
}
],
"react",
"module:metro-react-native-babel-preset"
]
}
The library does its assertions using tape . 该库使用磁带执行其断言。
Now, every test ( npm test
) throws the error: 现在,每个测试(
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
When I remove the preset from the babel config, I get the error: 当我从babel配置中删除预设时,我收到错误:
(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)
How can I get React Native components to run in my test in a library (and outside of an expo init
or react-native init
project? 如何在库中的测试中(以及
expo init
或react-native init
项目之外)运行React Native组件?
EDIT: I found out that the repo is using Babel 6, which is why the metro preset doesn't seem to work. 编辑:我发现回购正在使用Babel 6,这就是为什么地铁预设似乎不起作用的原因。 So I exchanged it for
babel-preset-react-native
and now I'm back to the initial error that View
can't be found. 所以我把它交换为
babel-preset-react-native
,现在我又回到了无法找到View
的初始错误。
EDIT 2: package.json
编辑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"
}
EDIT 3: Sorry, apparently I didn't include my code, even though it is a helpful for solving this problem. 编辑3:对不起,显然我没有包含我的代码,即使它有助于解决这个问题。 It's pretty basic.
这很基础。 I'm just trying to render a
<View />
using ReactTestRenderer
. 我只是想使用
ReactTestRenderer
渲染<View />
。
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
});
});
According to the docs , " Starting from react-native version 0.38, a Jest setup is included by default when running react-native init." 根据文档 ,“ 从react-native版本0.38开始,默认情况下在运行react-native init时包含Jest设置。” .
。
And 和
"react-native ships with a Jest preset, so the jest.preset field of your package.json should point to react-native. The preset is a node environment that mimics the environment of a React Native app. Because it doesn't load any DOM or browser APIs, it greatly improves Jest's startup time." “本机反应具有Jest预设,因此package.json的jest.preset字段应指向react-native。预设是一个模仿React Native应用程序环境的节点环境。因为它不加载任何DOM或浏览器API,都大大提高了Jest的启动时间。“
The point is that Jest is supposed to work with React-Native, and riteway
isn't. 关键是Jest应该使用React-Native,而
riteway
则不然。 When you run react-native init
the following dependency is added: "jest-react-native"
. 运行
react-native init
,会添加以下依赖项: "jest-react-native"
。 And a jest preset is added to package.json
: 并将一个jest预设添加到
package.json
:
"jest": {
"preset": "react-native"
}
Apparently there isn't any preset for riteway yet. 显然,还没有任何预设的riteway。
Remove node modules and install again 删除节点模块并重新安装
rm -rf node_modules
npm install
你没有返回任何东西,你需要返回一个“视图”
You might want to just use the suggested example in https://reactjs.org/docs/test-renderer.html just to make sure nothing wrong with code you have written, then add up your own logic to improve it (Just an idea to debug it). 您可能只想使用https://reactjs.org/docs/test-renderer.html中的建议示例,以确保您编写的代码没有任何问题,然后添加您自己的逻辑来改进它(只是一个想法)调试它)。 May be add it up in https://snack.expo.io ?
可以在https://snack.expo.io中添加它吗? or github, I will help you debug.
或github,我会帮你调试。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.