reactjs 找不到模块：无法解析'react-native' - React Native
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/49667452/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Module not found: Can't resolve 'react-native' - React Native
提问by Alpesh Trivedi
I have just started learning React Native and wanted to add input fields to the page. I have gone through this tutorialto add input fields. But whenever I run the React App it throws the following error.
我刚刚开始学习 React Native，想在页面中添加输入字段。我已经完成了本教程以添加输入字段。但是每当我运行 React App 时，它都会抛出以下错误。
./src/Inputs.js
Module not found: Can't resolve 'react-native' in 'E:\hybrid\reactDemo\src'
I have checked if the react-native node-modules is there or not, then I came to know that the module react-native was not there. I installed it run the app again, but it shows the same error. I have spent more than 8 hours on this but unable to resolve this error. I have tried out all the solution from google but none of them worked for me.
我已经检查过 react-native node-modules 是否存在，然后我才知道 react-native 模块不存在。我安装它再次运行该应用程序，但它显示相同的错误。我已经为此花费了 8 多个小时，但无法解决此错误。我已经尝试了谷歌的所有解决方案，但没有一个对我有用。
Note:I am using windows PC
注意：我使用的是 Windows PC
Update 1:I am importing react-native like following
更新 1：我正在导入 react-native，如下所示
import { View, Text, TouchableOpacity, TextInput, StyleSheet } from 'react-native'
Update 2:
更新 2：
This is my package.json file
这是我的 package.json 文件
{
"name": "reactDemo",
"version": "0.1.0",
"private": true,
"dependencies": {
"react": "^16.3.1",
"react-dom": "^16.3.1",
"react-native": "^0.54.4",
"react-router": "^3.0.5",
"react-scripts": "1.1.4"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test --env=jsdom",
"eject": "react-scripts eject"
}
}
回答by Alekssandro Assis Barbosa
Your project can't see the react-native package. If you already have all required dependencies installed (for use of react-native) go the end of this post. if not, I suggestyou have the following:
你的项目看不到 react-native 包。如果您已经安装了所有必需的依赖项（用于使用 react-native），请转到本文末尾。如果没有，我建议你有以下几点：
- react-scripts:contains the scripts used in create-react-app.
- react-dom:allows react-code to be rendered into an HTML page
- react-native-web:the main source of magic in this app. This library will convert our react-native components into web elements.
- react-art:a peer dependency for react-native-web
- react-router-native:routing library for React Native
- react-router-dom:routing library for React on the web
- react-scripts：包含 create-react-app 中使用的脚本。
- react-dom：允许将反应代码呈现到 HTML 页面中
- react-native-web：这个应用程序的主要魔法来源。这个库会将我们的 react-native 组件转换为 web 元素。
- react-art：react-native-web 的对等依赖
- react-router-native：React Native 的路由库
- react-router-dom：Web 上 React 的路由库
========================================================================
================================================== ======================
First thing first, you need compatible babel-jest dependencies. To fix the dependency tree, try following the steps below in the exact order:
首先，您需要兼容的 babel-jest 依赖项。要修复依赖关系树，请尝试按照以下确切顺序执行以下步骤：
- Delete package-lock.json (not package.json!) and/or yarn.lock in your project folder.
- Delete node_modules in your project folder.
- Remove "babel-jest" from dependencies and/or devDependencies in the package.json file in your project folder.
- Run npm install or yarn, depending on the package manager you use.
- 删除项目文件夹中的 package-lock.json（不是 package.json！）和/或 yarn.lock。
- 删除项目文件夹中的 node_modules。
- 从项目文件夹中的 package.json 文件中的依赖项和/或 devDependencies 中删除“babel-jest”。
- 运行 npm install 或 yarn，具体取决于您使用的包管理器。
The above configuration do not require you to have webpack manually configured, because react-scripts does that.
上面的配置不需要你手动配置 webpack，因为 react-scripts 做到了。
Maybe you don't use all that nor even react-scripts, so you must have to configure your webpack.config.js. To fix this, try the following:
也许你不使用所有这些，甚至不使用 react-scripts，所以你必须配置你的 webpack.config.js。要解决此问题，请尝试以下操作：
const path = require('path')
module.exports = ({platform}, defaults) => ({
...defaults,
entry: './index.js',
/* ... */
resolve: {
...defaults.resolve,
alias: {
...defaults.resolve.alias,
react: path.join(__dirname, 'node_modules/react'),
'react-native': path.join(__dirname, 'node_modules/react-native'),
}
}
})
回答by Payal Munjewar
You are trying to add react-native in other react project. React Native is like React, but it uses native components instead of web components as building blocks. So install react-native using npm install -g react-native-cliin a new folder and then initiate new react-native project using react-native init ProjectName.
您正在尝试在其他 react 项目中添加 react-native。React Native 类似于 React，但它使用原生组件而不是 Web 组件作为构建块。因此，在新文件夹中使用npm install -g react-native-cli 安装 react-native，然后使用react-native init ProjectName启动新的 react-native 项目。
Run react-native run-ios / run-androidinside your React Native project folder
在 React Native 项目文件夹中运行react-native run-ios / run-android
回答by Naleen Dissanayake
File path doesn't mention correctly. Please check it again. Issue is in your external import of the files in src directory and confirm that the file is in the mentioned path.
文件路径没有正确提及。请再次检查。问题在于您外部导入 src 目录中的文件并确认该文件位于上述路径中。
回答by henrik
What does your package.json look like?
你的 package.json 是什么样的？
Does it contain "react-native": "x.x.x" under dependencies?
依赖项下是否包含“react-native”：“xxx”？
