英文:
How to Resolve MODULE_NOT_FOUND Exception while Debugging React-Native App?
问题
这是您提供的代码的部分翻译:
在调试React-Native代码时出现异常 [MODULE_NOT_FOUND]
刚刚使用 npx react-native init May
创建了一个应用,并获得了默认的React-Native App.js。
/**
* 示例 React Native 应用
* https://github.com/facebook/react-native
*
* @format
*/
import React from 'react';
import type {PropsWithChildren} from 'react';
import {
SafeAreaView,
ScrollView,
StatusBar,
StyleSheet,
Text,
useColorScheme,
View,
} from 'react-native';
import {
Colors,
DebugInstructions,
Header,
LearnMoreLinks,
ReloadInstructions,
} from 'react-native/Libraries/NewAppScreen';
type SectionProps = PropsWithChildren<{
title: string;
}>;
function Section({children, title}: SectionProps): JSX.Element {
const isDarkMode = useColorScheme() === 'dark';
return (
<View style={styles.sectionContainer}>
<Text
style={[
styles.sectionTitle,
{
color: isDarkMode ? Colors.white : Colors.black,
},
]}>
{title}
</Text>
<Text
style={[
styles.sectionDescription,
{
color: isDarkMode ? Colors.light : Colors.dark,
},
]}>
{children}
</Text>
</View>
);
}
function App(): JSX.Element {
const isDarkMode = useColorScheme() === 'dark';
const backgroundStyle = {
backgroundColor: isDarkMode ? Colors.darker : Colors.lighter,
};
return (
<SafeAreaView style={backgroundStyle}>
<StatusBar
barStyle={isDarkMode ? 'light-content' : 'dark-content'}
backgroundColor={backgroundStyle.backgroundColor}
/>
<ScrollView
contentInsetAdjustmentBehavior="automatic"
style={backgroundStyle}>
<Header />
<View
style={{
backgroundColor: isDarkMode ? Colors.black : Colors.white,
}}>
<Section title="第一步">
编辑 <Text style={styles.highlight}>App.tsx</Text> 以更改此屏幕,然后返回查看您的编辑内容。
</Section>
<Section title="查看更改">
<ReloadInstructions />
</Section>
<Section title="调试">
<DebugInstructions />
</Section>
<Section title="了解更多">
阅读文档以发现下一步要做什么:
</Section>
<LearnMoreLinks />
</View>
</ScrollView>
</SafeAreaView>
);
}
const styles = StyleSheet.create({
sectionContainer: {
marginTop: 32,
paddingHorizontal: 24,
},
sectionTitle: {
fontSize: 24,
fontWeight: '600',
},
sectionDescription: {
marginTop: 8,
fontSize: 18,
fontWeight: '400',
},
highlight: {
fontWeight: '700',
},
});
export default App;
如果您有任何其他问题或需要更多帮助,请随时提出。
英文:
Exception while debugging React-Native code [MODULE_NOT_FOUND]
Just created an app using npx react-native init May
and got the default React-Native App.js.
/**
* Sample React Native App
* https://github.com/facebook/react-native
*
* @format
*/
import React from 'react';
import type {PropsWithChildren} from 'react';
import {
SafeAreaView,
ScrollView,
StatusBar,
StyleSheet,
Text,
useColorScheme,
View,
} from 'react-native';
import {
Colors,
DebugInstructions,
Header,
LearnMoreLinks,
ReloadInstructions,
} from 'react-native/Libraries/NewAppScreen';
type SectionProps = PropsWithChildren<{
title: string;
}>;
function Section({children, title}: SectionProps): JSX.Element {
const isDarkMode = useColorScheme() === 'dark';
return (
<View style={styles.sectionContainer}>
<Text
style={[
styles.sectionTitle,
{
color: isDarkMode ? Colors.white : Colors.black,
},
]}>
{title}
</Text>
<Text
style={[
styles.sectionDescription,
{
color: isDarkMode ? Colors.light : Colors.dark,
},
]}>
{children}
</Text>
</View>
);
}
function App(): JSX.Element {
const isDarkMode = useColorScheme() === 'dark';
const backgroundStyle = {
backgroundColor: isDarkMode ? Colors.darker : Colors.lighter,
};
return (
<SafeAreaView style={backgroundStyle}>
<StatusBar
barStyle={isDarkMode ? 'light-content' : 'dark-content'}
backgroundColor={backgroundStyle.backgroundColor}
/>
<ScrollView
contentInsetAdjustmentBehavior="automatic"
style={backgroundStyle}>
<Header />
<View
style={{
backgroundColor: isDarkMode ? Colors.black : Colors.white,
}}>
<Section title="Step One">
Edit <Text style={styles.highlight}>App.tsx</Text> to change this
screen and then come back to see your edits.
</Section>
<Section title="See Your Changes">
<ReloadInstructions />
</Section>
<Section title="Debug">
<DebugInstructions />
</Section>
<Section title="Learn More">
Read the docs to discover what to do next:
</Section>
<LearnMoreLinks />
</View>
</ScrollView>
</SafeAreaView>
);
}
const styles = StyleSheet.create({
sectionContainer: {
marginTop: 32,
paddingHorizontal: 24,
},
sectionTitle: {
fontSize: 24,
fontWeight: '600',
},
sectionDescription: {
marginTop: 8,
fontSize: 18,
fontWeight: '400',
},
highlight: {
fontWeight: '700',
},
});
export default App;
If I try to start it using npm run android
(I'm using Android Studio Emulator) I get a message in terminal like that:
Starting a Gradle Daemon, 1 incompatible and 1 stopped Daemons could not be reused, use --status for details
:ReactNative:Unexpected empty result of running '[node, C:\Users\-\Desktop\проекты\приложение RN\May\node_modules\@react-native-community\cli\build\bin.js, config]' command.
:ReactNative:Running '[node, C:\Users\-\Desktop\проекты\приложение RN\May\node_modules\@react-native-community\cli\build\bin.js, config]' command failed.
FAILURE: Build failed with an exception.
* Where:
Script 'C:\Users\-\Desktop\�������\���������� RN\May\node_modules\@react-native-community\cli-platform-android\native_modules.gradle' line: 413
* What went wrong:
A problem occurred evaluating script.
> node:internal/modules/cjs/loader:1078 throw err; ^Error: Cannot find module 'C:\Users\-\Desktop\проекты\приложение RN\May\node_modules\@react-native-community\cli\build\bin.js' at Module._resolveFilename (node:internal/modules/cjs/loader:1075:15) at Module._load (node:internal/modules/cjs/loader:920:27) at Function.executeUserEntryPoint [as runMain] (node:internal/modules/run_main:81:12) at node:internal/main/run_main_module:23:47 { code: 'MODULE_NOT_FOUND', requireStack: []}Node.js v18.16.0
* Try:
> Run with --stacktrace option to get the stack trace.
> Run with --info or --debug option to get more log output.
> Run with --scan to get full insights.
* Get more help at https://help.gradle.org
BUILD FAILED in 8s
error Failed to install the app. Make sure you have the Android development environment set up: https://reactnative.dev/docs/environment-setup.
Error: Command failed: gradlew.bat app:installDebug -PreactNativeDevServerPort=8081
:ReactNative:Unexpected empty result of running '[node, C:\Users\-\Desktop\проекты\приложение RN\May\node_modules\@react-native-community\cli\build\bin.js, config]' command.
:ReactNative:Running '[node, C:\Users\-\Desktop\проекты\приложение RN\May\node_modules\@react-native-community\cli\build\bin.js, config]' command failed.
FAILURE: Build failed with an exception.
* Where:
Script 'C:\Users\-\Desktop\�������\���������� RN\May\node_modules\@react-native-community\cli-platform-android\native_modules.gradle' line: 413
* What went wrong:
A problem occurred evaluating script.
> node:internal/modules/cjs/loader:1078 throw err; ^Error: Cannot find module 'C:\Users\-\Desktop\проекты\приложение RN\May\node_modules\@react-native-community\cli\build\bin.js' at Module._resolveFilename (node:internal/modules/cjs/loader:1075:15) at Module._load (node:internal/modules/cjs/loader:920:27) at Function.executeUserEntryPoint [as runMain] (node:internal/modules/run_main:81:12) at node:internal/main/run_main_module:23:47 { code: 'MODULE_NOT_FOUND', requireStack: []}Node.js v18.16.0
* Try:
> Run with --stacktrace option to get the stack trace.
> Run with --info or --debug option to get more log output.
> Run with --scan to get full insights.
* Get more help at https://help.gradle.org
BUILD FAILED in 8s
at makeError (C:\Users\-\Desktop\проекты\приложение RN\May\node_modules\execa\index.js:174:9)
at C:\Users\-\Desktop\проекты\приложение RN\May\node_modules\execa\index.js:278:16
at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
at async runOnAllDevices (C:\Users\-\Desktop\проекты\приложение RN\May\node_modules\@react-native-community\cli-platform-android\build\commands\runAndroid\runOnAllDevices.js:82:7)
at async Command.handleAction (C:\Users\-\Desktop\проекты\приложение RN\May\node_modules\@react-native-community\cli\build\index.js:108:9)
info Run CLI with --verbose flag for more details.
Android Studio's emulator starts working, gets to the Home screen, but nothing shows on the screen as I get an exception. Just started looking into React-Native, so I'll appreciate any help. For more information: I use Node.JS v18.16.0, Java JDK 11, code in Visual Studio Code. Tried using npm install
, didn't help. Tried to reinstall Node.js, also didn't help.
答案1
得分: 1
Move it to Desktop and try again, looking at the logs the folder path seems inconsistent so use English directory names.
英文:
Move it to Desktop and try again, looking at the logs the folder path seems inconsistent so use English directory names.
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库,让每个人都能够通过互相帮助和分享经验来进步。
评论