এই ত্রুটিটি পাওয়া: ত্রুটি: বান্ডিলিং ব্যর্থ হয়েছে: ত্রুটি: মডিউলটি সমাধান করতে অক্ষম native স্থানীয়-নিরাপদ-অঞ্চল-প্রসঙ্গটি প্রতিক্রিয়া করুন `


42

আমার অ্যাপটি চালানোর পরে আমি এই ত্রুটিটি পাচ্ছি:

ত্রুটি: বান্ডিলিং ব্যর্থ হয়েছে: ত্রুটি: react-native-safe-area-contextথেকে মডিউলটি সমাধান করতে অক্ষম node_modules/react-navigation-stack/lib/module/vendor/views/Stack/StackView.js: প্রকল্পের মধ্যে রিঅ্যাক্ট-নেটিভ-নিরাপদ-অঞ্চল-প্রসঙ্গটি পাওয়া যায়নি।

তবে আমি আমার পুরানো ডেমোটির জন্য একই জিনিস করেছি। এটি পুরোপুরি ঠিকঠাক কাজ করেছে।

আমি জানি না আমি এখানে কী ভুল করছি। আমার কোড পরীক্ষা করুন:

ইনস্টলের জন্য:

  1. নেটিভ নেভিগেশন এবং অঙ্গভঙ্গি হ্যান্ডলার প্রতিক্রিয়া:

npm install --save react-navigation

npm install --save react-native-gesture-handler

  1. নেটিভ স্ট্যাক প্রতিক্রিয়া:

npm install --save react-navigation-stack

App.js

import { createAppContainer } from "react-navigation";
import { createStackNavigator } from "react-navigation-stack";
import FirstOptionsPage from "./FirstOptionsPage";

const MainNavigator = createStackNavigator(
  {
    FirstOptions: FirstOptionsPage
  },
  {
    defaultNavigationOptions: {
      headerStyle: {
        // backgroundColor: '#28F1A6',
        elevation: 0,
        shadowOpacity: 0
      },
      headerTintColor: "#ca375e",
      headerTitleStyle: {
        fontWeight: "bold",
        color: "#161616"
      }
    }
  }
);

const App = createAppContainer(MainNavigator); // For setting Navigation Stack
export default App;

এবং ফার্স্টঅপশন পেজ.জেএস:

import React from "react";
import {
  SafeAreaView,
  StyleSheet,
  View,
  Text,
  ScrollView,
  Switch
} from "react-native";

export default class FirstOptionsPage extends React.Component {
  static navigationOptions = {
    title: "Preferences"
  };

  constructor(props) {
    super(props);
    this.state = {
      switch1Value: false
    };
  }

  toggleSwitch1 = value => {
    this.setState({ switch1Value: value });
    console.log("Switch 1 is: " + value);
  };

  render() {
    const { navigate } = this.props.navigation;
    return (
      <SafeAreaView style={styles.mainContainerStyle}>
        <View style={styles.subContainerStyle}>
          <Text style={styles.subtitleTextStyle}>Someone likes my post</Text>
          <View style={styles.switchStyle}>
            <Switch
              onValueChange={this.toggleSwitch1}
              value={this.state.switch1Value}
              thumbColor={MAGENTA_COLOR_CODE}
              trackColor={{
                false: GREY_COLOR_CODE,
                true: DARK_GREY_COLOR_CODE
              }}
            />
          </View>
        </View>
      </SafeAreaView>
    );
  }
}

আমি প্রতিক্রিয়া-নেটিভ নতুন। এটি ঠিক করতে দয়া করে আমাকে সহায়তা করুন।


1
react-native-safe-area-contextআপনার নোড মডিউলগুলি পরীক্ষা করুন , react-navigation-stackএটির প্রয়োজন তবে আপনার নোড মডিউলগুলির মধ্যে এটি নেই
— জিগার শাহ

উত্তর:


32

আমি মনে করি যে SafeAreaViewনতুন প্রতিক্রিয়া-দেশীয় সংস্করণের জন্য সমস্যাটি রয়েছে , এতে স্থানান্তরিত হয়েছে react-native-community/react-native-safe-area-view। আপনি যদি ব্যবহার করতে চান তবে আপনার SafeAreaViewপ্রথমে এটি ইনস্টল করা উচিত।

নতুন ব্যবহারটি এরকম:

import SafeAreaView from 'react-native-safe-area-view';

export default function MyAwesomeApp() {
  return (
    <SafeAreaView style={{ flex: 1 }}>
      <View style={{ flex: 1 }}>
        <Text>
          Look, I'm safe! Not under a status bar or notch or home indicator or
          anything! Very cool
        </Text>
      </View>
    </SafeAreaView>
  );
}

এটা ইনস্টল করার জন্য আপনি নিম্নলিখিত কমান্ড ব্যবহার করতে পারেন:
yarn add react-native-safe-area-view react-native-safe-area-context।

আপনি যদি অটো-লিঙ্ক ব্যবহার না করেন তবে আপনাকে এটি লিঙ্ক করতে হবে। এটি সম্পর্কে বিশদ জন্য, এই লিঙ্কটি দেখুন


এখন আমি এই ত্রুটিটি পাচ্ছিerror: bundling failed: Error: Unable to resolve module `@react-native-community/masked-view` from `node_modules/react-navigation-stack/lib/module/vendor/views/MaskedView.js`: @react-native-community/masked-view could not be found within the project.
— গৌতম শ্রীবাস্তব

এবং আসলে আমার পূর্বের প্রকল্পে সবকিছু ঠিকঠাক কাজ করছিল। এখন এটি এই সমস্যাটি দেখায়।
— গৌতম শ্রীবাস্তব

আপনার জানা উচিত যে দেশীয় 0.6 প্রতিক্রিয়া দেখানোর পরে, অনেক লাইব্রেরি ফ্যাক্ট-নেটিভ মূলটি সরিয়ে ফেলেছিল। পূর্ববর্তী সমস্যার মতো এই সমস্যাটি, এই লিঙ্কটি পড়ুন [ github.com/react-native-commune/react-native-masked-view]
— লেনোরোড

7
আপনার উত্তরে আপনি যা বলেছিলেন তা করার পরেও আমাকে @react-native-community/masked-viewএটি ঠিক করার জন্য ইনস্টল করতে হয়েছিল। তারপরে আমার কোডটি সফলভাবে কাজ করেছে। সাহায্যের জন্য ধন্যবাদ.
— গৌতম শ্রীবাস্তব

1
হ্যাঁ, এটি প্রকাশিত নোটগুলিতে লেখা হয়েছে github.com/react-navication/stack/releases/tag/v2.0.1
— mexique1

20

এটি কিছুটা মজার বিষয়, আমি নেভিগেশন যুক্ত করতে চেয়েছিলাম তাই আমি যুক্ত করেছিলাম

এনপিএম ইনস্টল - সেভ প্রতিক্রিয়া-নেভিগেশন

এটি ঠিকঠাক কাজ করার জন্য আমাকে যুক্ত করতে হয়েছিল:

এক্সপো ইনস্টল রিঅ্যাক্ট-নেটিভ-অঙ্গভঙ্গি-হ্যান্ডলার রিঅ্যাক্ট-নেটিভ-পুনর্নির্মাণ

তারপর আমি পেয়েছি

"স্থানীয়-নিরাপদ-অঞ্চল-প্রসঙ্গে প্রতিক্রিয়া" সমাধান করতে অক্ষম তাই আমি যুক্ত করেছি:

এক্সপো ইনস্টল প্রতিক্রিয়া-নেভিগেশন-স্ট্যাক

এক্সপো ইনস্টল করুন রিএ্যাক্ট-নেটিভ-সেফ-এরিয়া-ভিউ রিঅ্যাক্ট-নেটিভ-সেফ-এরিয়া-প্রসঙ্গ

তারপর আমি পেয়েছিলাম

বান্ডিলিং ব্যর্থ: ত্রুটি: মডিউলটি সমাধান করতে অক্ষম @react-native-community/masked-view

সুতরাং আমি মুখোশযুক্ত দর্শনটি অনুসন্ধান করেছি (এটি বর্তমানে গিট ডকুমেন্ট অনুযায়ী এক্সপো দ্বারা সমর্থনযোগ্য নয়)। তারপরে আমি জানতে পারি আমি বিড়ালের ব্যবহার:

এক্সপো ইনস্টল করুন @ রিএ্যাক্ট-নেটিভ-কমিউনিটি / মাস্কড ভিউ যা কাজ করতে পারে বা না :)

অতএব, এখন থেকে আমি আমার সমস্ত প্রতিক্রিয়া-নেটিভ প্রকল্পগুলির শুরুতে নীচের আদেশগুলি ব্যবহার করি, নেভিগেশন সঠিকভাবে ব্যবহার করতে সক্ষম হতে:

এনপিএম ইনস্টল - সেভ প্রতিক্রিয়া-নেভিগেশন

এক্সপো ইনস্টল করুন রিএ্যাক্ট-নেটিভ-অঙ্গভঙ্গি-হ্যান্ডলার রিঅ্যাক্ট-নেটিভ-রিনিমেটেড রিএ্যাক্ট-নেভিগেশন-স্ট্যাক

এক্সপো ইনস্টল করুন রিএ্যাক্ট-নেটিভ-সেফ-এরিয়া-ভিউ রিঅ্যাক্ট-নেটিভ-সেফ-এরিয়া-প্রসঙ্গ

এক্সপো ইনস্টল করুন @ রিএ্যাক্ট-নেটিভ-সম্প্রদায় / মাস্কড ভিউ


মডিউল পাওয়া যায় নি: '
— রিএ্যাক্ট

জঘন্য, এটি সত্য hahaha
— কাই

15

এই আদেশগুলি চালনার পরে:

npm i react-native-safe-area-view react-native-safe-area-context &&
react-native link react-native-safe-area-context

এটি আমাকে মুখোশযুক্ত দর্শন সম্পর্কে ত্রুটি তৈরি করেছিল, সুতরাং আমাকেও চালাতে হয়েছিল npm i @react-native-community/masked-viewএবং তারপরে আমার কোডটি এখন অ্যান্ড্রয়েড শারীরিক ডিভাইসে সফলভাবে চালানো যেতে পারে।

সঠিক দিক নির্দেশ করার জন্য লেনোরোদ এবং গৌতম শ্রীবাস্তবকে ধন্যবাদ জানাই ।


নেটিভ সংস্করণ 0.60এবং উপরের প্রতিক্রিয়াটির জন্য , এনএমপির পরিবর্তে সুতা ব্যবহার করুন এবং লিঙ্ক করবেন না ।
— ফাতেহ মের্ট দোয়ানকান

4

আমি মনে করি আপনি আপনার প্রকল্পের সাথে লিঙ্কের অবক্ষয়কে মিস করেছেন যাতে আপনি নীচের মতো চেষ্টা করতে পারেন:

নেটিভ 0.6 বা উচ্চতর প্রতিক্রিয়া সহ:

আইওএসে, নিশ্চিত হয়ে নিন যে আপনি কোকোপড ইনস্টল করেছেন এবং চালাচ্ছেন:

cd ios
pod install
cd ..

নেটিভ 0.59 প্রতিক্রিয়া এবং নিম্ন চেষ্টা সহ:

react-native link react-native-safe-area-context

আমি এটি ইতিমধ্যে করেছি তবে ভাগ্য নেই।
— গৌতম শ্রীবাস্তব

2

সমস্ত অনুলিপি করুন এবং টার্মিনাল এ পেস্ট করুন

expo install react-navigation react-native-gesture-handler react-native-reanimated react-native-screens

আমার জন্য কাজ


1

নিম্নলিখিত চালান:

expo install react-native-safe-area-context

expo সঠিক সংস্করণ নির্বাচন করবে এবং তারপরে এটি ইনস্টল করবে।


1

এই ত্রুটিটি সমাধান করার জন্য আমি এনএমপি প্রশংসনীয় নেভিগেশন-স্ট্যাক টি ব্যবহার করব


1

প্রকল্প ডিরেক্টরি থেকে সরাসরি মেট্রো বান্ডিলার শুরু করা আমার পক্ষে কাজ করে। কেউ যদি আমাকে জানতে দেয় যে এটি তাদের জন্যও কাজ করে?

# পরিষ্কার ক্যাশে আরএম-আরএফ $ টিএমপিডিআইআর / প্রতিক্রিয়া- ; rm -rf $ টিএমপিডিআইআর / তাড়াতাড়ি- ; rm -rf $ টিএমপিডিআইআর / মেট্রো- ; প্রহরী প্রহরী-দেল-সব

* # স্টার্ট মেট্রো বান্ডলার সরাসরি-নেটিভ শুরুতে প্রতিক্রিয়া জানান

* # এখন চালান react-native run-androidবা react-native run-iosঅন্য ট্যাবে

আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.