কীভাবে আপনি প্রতিক্রিয়া নেটিভ ডিবাগ করবেন?


264

অ্যাপটি অ্যাপ সিমুলেটারে চলমান অবস্থায় কেউ কীভাবে তাদের প্রতিক্রিয়া কোডটি রিঅ্যাক্ট নেটিভের সাথে ডিবাগ করতে পারে?



এই উত্তরগুলি ছাড়াও, যদি আপনি ভিএস কোডে কাজ করছেন এবং এটি ক্রোমের পরিবর্তে ডিবাগ করতে চান তবে আমার এই উত্তরটি দেখুন
gprathour

এই ব্লগ অনুসরণ করুন। medium.com/javascript-in-plain-english/...
Tunvir রহমান তুষার

উত্তর:


158

Cmd+Dসিমুলেটারের মধ্যে থেকে। এটি ক্রোমকে পপআপ করবে এবং সেখান থেকে আপনি বিকাশকারী সরঞ্জামগুলি ব্যবহার করতে পারেন।

সম্পাদনা:

এটি এখন সহায়তা ডক্সে লিঙ্কযুক্ত ।


8
V8.2 সিমুলেটর ব্যবহার করে, Cmd + D কিছুই করার মনে হচ্ছে না। ক্রোম সর্বশেষ। ক্রোমের কিছু বিশেষ প্লাগইন দরকার বা প্রক্সি?
ম্যাকজি

5
"ওয়েবসাইটকেট ডিবাগার পাওয়া যায় না you আপনি কি আরসিটিওয়েবসকেট এক্সেকিউটারকে অন্তর্ভুক্ত করতে ভুলে গেছেন?"। : /
টাইলার ম্যাকগিনিস

1
আমার নিম্নলিখিত ত্রুটি ছিল: / ব্যবহারকারী / সার্জ / প্রজেক্টস / সিসার / মাইপ্রজেক্ট / নোড_মডিউলস / রিরেট-নেটিভ / প্যাকগার / লঞ্চ ক্রোমডেভটুলস.এপলস স্ক্রিপ্ট: 686868::1১: স্ক্রিপ্ট ত্রুটি: শ্রেণীর নাম প্রত্যাশিত তবে সম্পত্তি পাওয়া গেছে। (-2741)। আমি খুঁজে পেয়েছি যে আমি যদি ম্যাকের সাথে সমান্তরালে উইন্ডোজ অ্যাপ্লিকেশনগুলি ভাগ করা অক্ষম করি তবে এটি কাজ করা শুরু করে। স্ট্যাকওভারফ্লো . com/ প্রশ্নগুলি / 29310936/ … দেখুন ।
সার্জ ভ্যান ড্যান ওভার

5
ওটা হবে Cmd+MOS X এবং Android এর উপর
স্তরপূর্ণ

2
মনে রাখবেন যে আপনার বিল্ড কনফিগারেশনটি "রিলিজ" এ সেট করা থাকলে সিএমডি + ডি কিছুই করবে না - এটি "ডিবাগ" এ সেট করা আছে তা নিশ্চিত করুন।
jwinn

79

ডিবাগিং প্রতিক্রিয়া নেটিভ অ্যাপ্লিকেশন

আপনার প্রতিক্রিয়া অ্যাপ্লিকেশনটির জাভাস্ক্রিপ্ট কোডটি ডিবাগ করতে নিম্নলিখিতগুলি করুন:

  1. আইওএস সিমুলেটারে আপনার অ্যাপ্লিকেশন চালান।
  2. টিপুন Command + Dএবং একটি ওয়েবপৃষ্ঠা http: // লোকালহোস্ট: 8081 / ডিবাগার-ইউআই এ খুলতে হবে । (কেবলমাত্র ক্রোম) বা ব্যবহার করুনShake Gesture
  3. আরও উন্নত ডিবাগিং অভিজ্ঞতার জন্য বিরাম পাকানো ব্যতিক্রম সক্ষম করুন ।
  4. Command + Option + IChrome বিকাশকারী সরঞ্জাম খুলতে টিপুন , বা View-> Developer-> এর মাধ্যমে এটি খুলুন Developer Tools
  5. আপনার এখন স্বাভাবিকভাবে ডিবাগ করতে সক্ষম হওয়া উচিত।

ঐচ্ছিক

গুগল ক্রোমের জন্য প্রতিক্রিয়া বিকাশকারী সরঞ্জাম এক্সটেনশানটি ইনস্টল করুন । Reactবিকাশকারী সরঞ্জাম খোলা থাকলে আপনি যদি ট্যাবটি নির্বাচন করেন তবে এটি আপনাকে ভিউ হায়ারার্কি নেভিগেট করার অনুমতি দেবে ।

লাইভ রিলোড করুন

লাইভ পুনঃলোড সক্রিয় করতে নিম্নলিখিত করুন:

  1. আইওএস সিমুলেটারে আপনার অ্যাপ্লিকেশন চালান।
  2. টিপুন Control + Command + Z
  3. আপনি এখন Enable/Disable Live Reload, Reloadএবং Enable/Disable Debuggingবিকল্পগুলি দেখতে পাবেন ।

এই উত্তরটি মূলত ডকটিকে অনুলিপি করে, যা একটি শুরু, তবে বিশেষত আলোকিত নয়। এই প্রসঙ্গে "আপনি যেমন স্বাভাবিকভাবে ডিবাগ করবেন" তার অর্থ কী?
গ্রিনআসজেড

6
গুরুত্বপূর্ণ দ্রষ্টব্য: প্রতিক্রিয়া বিকাশকারী সরঞ্জামগুলি কয়েক মাস ধরে রিএ্যাক্ট নেটিভের সাথে কাজ করছে না এবং এখনও তা স্থির করে দেওয়া হবে। এখানে আরও তথ্য: github.com/facebook/react-devtools/issues/229
লেন

কে বলল ম্যাক এ?
shinzou

@ শিনজৌ এটি একটি সিমুলেটর (এটি আইওএস ডেভসের জন্য সিমুলেটর, অ্যান্ড্রয়েড ডিভসের জন্য এমুলেটর) উল্লেখ করে বোঝানো হয়েছে। হ্যাঁ আমি জানি এটি কিছুক্ষণ হয়ে গেছে, তবে এখনও, কেবল এফডাব্লুআইডাব্লু
কনরাড মোরাউস্কি

58

একটি অ্যান্ড্রয়েড অ্যাপের জন্য, আপনি জিনমোশন ব্যবহার করছেন যদি আপনি মেনু টিপতে টগল করতে পারেন CMD + mতবে এটি করে মেনুতে আপনাকে সক্ষম করতে হতে পারে।

  • আনটিক উইজেট
  • ক্রোম ডিবাগ এCMD + m ক্লিক করে এটি সক্ষম করুন

5
অবশেষে একটি অ্যান্ড্রয়েড সমাধান পাওয়া গেল, ধন্যবাদ! এবং সর্বশেষ সংস্করণে, এর debug in chromeসাথে প্রতিস্থাপন করা হয় start debug remotely
মেওয়াক্স

@ মেওএক্সএক্স আপনি কীভাবে দয়া করে আমাদের তা জানান? 🤔
মো।

@Muhammed হাই, আপনি শুধু অনুসরণ করতে পারে cmd + mঅথবা ctrl + m, এবং নির্বাচন করুন start debug remotelyআপনার কাল্পনিক মধ্যে popup উইন্ডো থেকে
MewX

31

অন্যান্য উত্তর ছাড়াও। আপনি ডিবাগার স্টেটমেন্টটি ব্যবহার করে রিট্যাক্ট-নেটিব ডিবাগ করতে পারেন

উদাহরণ:

debugger; //breaks execution

এটির জন্য আপনার ক্রোম ডেভ সরঞ্জামগুলি অবশ্যই উন্মুক্ত থাকতে হবে


এফ ইয়া! এটাই আমার দরকার! ধন্যবাদ বন্ধু!
I_am_learning_ এখন

27

আপনি যদি উইন্ডোজে অ্যান্ড্রয়েড ডিভাইস ব্যবহার করে ডিবাগ করতে চান তবে কেবল একটি কমান্ড প্রম্পট খুলুন টাইপ করুন (আপনার অ্যাডাবটি সঠিকভাবে কাজ করছে তা নিশ্চিত করুন)

adb shell input keyevent 82

এটি চিত্রের মতো একটি পর্দা প্রম্পট করবে এখানে চিত্র বর্ণনা লিখুন

তারপরে সিলেক্ট করুন

debug JS Remotely

এটি স্বয়ংক্রিয়ভাবে একটি নতুন উইন্ডো খুলবে then


এই আদেশের সমত কোনও আইওএস আছে কি? আমি সম্প্রতি আরএন দিয়ে সম্প্রতি শুরু করেছি এবং এটি ভবিষ্যতে অনেক সহায়তা করবে
জুয়ান কার্লোস আলপিজার চিনচিলা

26

এখানে চিত্র বর্ণনা লিখুন

এই প্রোগ্রামটি ব্যবহার করে দেখুন: https://github.com/jhen0409/react-native-debugger

উপর কাজ করে: windows, osxএবং linux

এটি সমর্থন করে: react nativeএবংredux

আপনি ভার্চুয়াল উপাদান গাছটিও পরিদর্শন করতে পারেন এবং অ্যাপ্লিকেশনটিতে প্রতিবিম্বিত শৈলীগুলিকে সংশোধন করতে পারেন।


আমি কি এই ডিবাগারটির মাধ্যমে নির্দিষ্ট ভেরিয়েবলের মান দেখতে পারি? আমি চেষ্টা করেছি console.log(url), কিন্তু আউটপুট কোথায় তা খুঁজে পাচ্ছি না।
কোয়ার্ক

24

cmd ⌘+ + Dঅদ্ভুত আমার জন্য কাজ করে নি। টিপলে ctrl+ + cmd ⌘+ + ZiOS এর কাল্পনিক আমার জন্য ডিবাগ ব্রাউজার উইন্ডো বন্ধ পদাঘাত করেনি।

এটি পপ আপ পর্দা:

নেটিভ ডিবাগিং বিকল্পগুলি প্রতিক্রিয়া জানান

আরও বিশদ এখানে।


আমি এই বিকল্পগুলি দেখতে পাচ্ছি না: :(
নোহ

16

আপনার অ্যাপ্লিকেশনটি অ্যান্ড্রয়েড সিমুলেটারে চলার সময় ক্রোমিয়াম বা ফায়ারবগে http: // লোকালহোস্ট: 8081 / ডিবাগার-ইউআই নেভিগেট করে ডিবিয়ান 8 (জেসি) -তে 0.40.0-দেশীয় প্রতিক্রিয়া প্রদর্শন করা যেতে পারে । অ্যাপ্লিকেশন বিকাশকারী মেনু অ্যাক্সেস করতে, এখানে নির্দেশিত হিসাবে অন্য টার্মিনাল উইন্ডোতে নিম্নলিখিত কমান্ডটি চালান :

adb shell input keyevent 82


14

পূর্বের উত্তরগুলিতে মন্তব্য করার মতো যথেষ্ট খ্যাতি আমার নেই যা দুর্দান্ত। :) প্রতিক্রিয়া-নেটিভ অ্যাপ্লিকেশন বিকাশ করার সময় আমি কীভাবে ডিবাগ করছি তার কয়েকটি উপায় এখানে রইল।

  1. লাইভ পুনরায় লোড হচ্ছে

    প্রতিক্রিয়া-নেটিভ আপনার পরিবর্তনগুলি ⌘ + আর কীগুলির সাহায্যে দেখতে পারা সহজ করে তোলে বা সরাসরি লাইভ পুনরায় লোড সক্ষম করে এবং প্রহরী সর্বাধিক পরিবর্তনগুলি সহ সিমুলেটরটিকে "রিফ্রেশ" করবে। আপনি যদি কোনও ত্রুটি পান তবে আপনি সেই লাল পর্দা থেকে লাইন নম্বর থেকে একটি চিহ্ন পেতে পারেন। কিছু পূর্বাবস্থায় ফিরে আসার পরে আপনাকে আবার কর্মক্ষম অবস্থায় ফিরিয়ে আনতে হবে।

  2. console.log('yeah, seriously.')

    আমি নিজেকে debuggerব্রেক পয়েন্ট যুক্ত করার চেয়ে প্রোগ্রামটি চালিয়ে দেওয়া এবং কিছু তথ্য লগইন করতে পছন্দ করি । (বাহ্যিক প্যাকেজগুলি / লাইব্রেরিগুলির সাথে কাজ করার চেষ্টা করার সময় শক্ত ডিবাগারটি কার্যকর এবং এটি স্বয়ংক্রিয়রূপে আসে, সুতরাং আপনি কী কী অন্যান্য পদ্ধতি ব্যবহার করতে পারবেন তা আপনি জানেন))

  3. Enable Chrome Debuggingdebugger;আপনার প্রোগ্রাম বিরতি পয়েন্ট সহ ।

ঠিক আছে এটি আপনার ত্রুটিগুলির ধরণের এবং আপনার কীভাবে ডিবাগ করবেন তার পছন্দগুলির উপর নির্ভর করে। বেশিরভাগ ক্ষেত্রে undefined is not an object (evaluating 'something.something'), পদ্ধতি 1 এবং 2 আমার পক্ষে যথেষ্ট ভাল হবে।

অন্য বিকাশকারীদের দ্বারা লিখিত বাহ্যিক গ্রন্থাগারগুলি বা প্যাকেজগুলির সাথে ডিল করার ক্ষেত্রে ডিবাগ করার জন্য আরও বেশি প্রচেষ্টা প্রয়োজন তাই একটি ভাল সরঞ্জামের মতো Chrome Debugging

কখনও কখনও এটি প্রতিক্রিয়া-নেটিভ প্ল্যাটফর্ম থেকে নিজেই আসে তাই রিঅ্যাক্ট-নেটিভ সমস্যাগুলির জন্য গুগল করা অবশ্যই সহায়তা করবে।

আশা করছি এটা ওখানে কাওকে সাহায্য করবে.


12

পরিবর্তে Cmd+M, F10উইন্ডোজ এন্ড্রয়েড এমুলেটর প্রেসের জন্য । এমুলেটরটি সমস্ত প্রতিক্রিয়া-নেটিভ ডিবাগ বিকল্পগুলি দেখাতে শুরু করে।

ভাবমূর্তি



9

আপনি যদি মাইক্রোসফ্ট ভিজ্যুয়াল কোড ব্যবহার করে থাকেন তবে নেটিভ টুলস এক্সটেনশন প্রতিক্রিয়াটি ইনস্টল করুন। তারপরে আপনি পছন্দসই লাইন নম্বরটিতে ক্লিক করে ব্রেক পয়েন্ট যুক্ত করতে পারেন। অ্যাপটি সেটআপ এবং ডিবাগ করার জন্য এই পদক্ষেপগুলি অনুসরণ করুন: সেটআপ চালান

আপনি যদি এটি ব্যবহার করেন তবে এমবুটরটিতে দূরবর্তী জেএসকে দূর থেকে সক্ষম করতে ভুলে যাবেন না।


9

অ্যান্ড্রয়েডের জন্য: মেনু প্রকাশের জন্য Ctrl + M (এমুলেটর) বা ফোনটি (ডিভাইসে) কাঁপুন।

আইওএসের জন্য: মেনু প্রকাশের জন্য সিএমডি + ডি বা ফোনটি কাঁপুন

আপনার ক্রোম রয়েছে তা নিশ্চিত করুন।

প্রকাশিত মেনুতে ডিবাগ জেএস রিমোটলি অপশন নির্বাচন করুন।

ক্রোম লোকালহোস্টে স্বয়ংক্রিয়ভাবে খোলা হবে: 8081 / ডিবাগার-ইউআই। আপনি নিজে এই লিঙ্কটি দিয়ে ডিবাগারেও যেতে পারেন।

সেখানে কনসোল প্রকাশিত হয় এবং আপনি দেখতে পাবেন লগগুলি নোট করা হচ্ছে।


8

আমার কাছে বিক্রিয়া -নেটিভ ডিবাগ করার সর্বোত্তম উপায় হ'ল "রিঅ্যাক্ট্রন" ব্যবহার করে ।

রিঅ্যাকট্রন ইনস্টল করুন তারপরে এগুলি আপনার প্যাকেজ.জসনে যুক্ত করুন:

"reactotron-apisauce": "^1.1.2",
"reactotron-react-native-under-37": "^1.1.2",
"reactotron-redux": "^1.1.2", 

এখন, এটি আপনার কোডটিতে লগইন করার বিষয়টি। উদাহরণ:console.tron.log('debug')


8
  1. সিমুলেটারে আপনার অ্যাপ্লিকেশন চালান - দেশীয় রান-আইওসের প্রতিক্রিয়া
  2. Ctrl + d টিপুন এবং ডিবাগ জেএস রিমোটলি ক্লিক করুন

এখানে চিত্র বর্ণনা লিখুন

  1. ওয়েবপৃষ্ঠাটি http: // লোকালহোস্ট: 8081 / ডিবাগার-ইউআই এ খুলতে হবে , যদি URL টি টাইপ না করে এবং ক্রোমে এই লিঙ্কটিতে না যায়
  2. পৃষ্ঠায় ডান ক্লিক করুন এবং পরিদর্শন ক্লিক করুন এবং এটি ক্রোমের জন্য বিকাশকারী সরঞ্জামগুলি খুলতে হবে

এখানে চিত্র বর্ণনা লিখুন

  1. উপরের মেনুতে উত্সগুলিতে যান এবং ডান হাতের ফাইল এক্সপ্লোরারটিতে আপনার জেএস ক্লাস ফাইলটি সন্ধান করুন

  2. আপনি ছবিতে দেখতে দেখতে ব্রেকপয়েন্টগুলি রাখতে পারেন এবং কোডটি সেখানে ডিবাগ করতে পারেন।


6

ডিফল্টরূপে, আমার আইওএস সিমুলেটর কী-স্ট্রোকগুলি তুলছিল না যার কারণে সেমিডি-ডি কাজ করে না। সিমুলেটারের মেনু ব্যবহার করে আমাকে কীবোর্ডের জন্য সেটিংস চালু করতে হয়েছিল:

হার্ডওয়্যার> কীবোর্ড> সংযুক্ত কীবোর্ড

এখন সিএমডি-ডি ক্রোম ডিবাগিং চালু করে।


6

Android এর জন্য অ্যাপ্লিকেশন .Press জন্য Ctrl + এম ডিবাগ JS নির্বাচন দূরবর্তী অবস্থান থেকে এটা দিয়ে URL Chrome এ একটি নতুন উইন্ডো খুলবে HTTP: // স্থানীয় হোস্ট: 8081 / ডিবাগার-ui এ । আপনি এখন ক্রোম ব্রাউজারে অ্যাপটি ডিবাগ করতে পারেন


5

ফাইল পথে একটি স্থান থাকা + কাজ করা থেকে বাধা দেয় । আমি আমার প্রকল্পটি কোনও স্থান ছাড়াই কোনও লোকেশনে স্থানান্তরিত করেছি এবং অবশেষে আমি Chrome ডিবাগারটি কাজ করতে পেয়েছি। বাগের মতো মনে হচ্ছে ।CmdD


5

আপনি যদি ডিফল্ট হিসাবে ডিবাগিং সক্ষম করতে চান:

import { NativeModules } from 'react-native';

if (__DEV__) {
  NativeModules.DevSettings.setIsDebuggingRemotely(true)
}

এন্ড্রয়েড এ কাজ করতে:

npm install --save react-native-devsettings-android
react-native link react-native-devsettings-android

তথ্যসূত্র: ডিফল্ট হিসাবে সক্ষম "ডিবাগ জেএস রিমোটলি" সহ একটি প্রতিক্রিয়া নেটিভ অ্যাপ্লিকেশন চালু করুন


নির্দিষ্ট জায়গায় আমি এই 4 লাইন করা উচিত? App.js বা index.js এ?
জুলিয়েন লামারচে

@ জুলিয়েন ল্যামারচে অ্যাপ.জেএস-এ রাখুন
অলকায় এরতাş

এটিকে উত্তর হিসাবে গ্রহণ করা উচিত .... কেন আদেশগুলিতেও বিশ্বাস করুন .....
তুষার পান্ডে

4

খুব সহজ মাত্র দুটি কমান্ড

For IOS $ react-native log-ios
For Android $ react-native log-android

এইভাবেই আমি এটি করি!
জ্যাচ কুক

এটি আপনার স্টোরের সাথে কী চলছে তা দেখার একটি দুর্দান্ত দুর্দান্ত উপায়
দান

4

ধরে নিচ্ছি আপনি অ্যান্ড্রয়েড এমুলেটরটিতে এই মেনুটি প্রদর্শন করতে চান এখানে চিত্র বর্ণনা লিখুন

  • তারপরে, ⌘+mকোনও ম্যাকের অ্যান্ড্রয়েড এমুলেটারে এই ডেভ সেটিংস ডায়ালগটি পপআপ করার চেষ্টা করুন ।

  • যদি এটি না দেখায় তবে যান AVD > (click the pen to edit your emulator configuration) > advanced settings > check the enable keyboard input boxএখানে চিত্র বর্ণনা লিখুন

  • এবং তারপরে আবার চেষ্টা করুন ⌘+m

  • যদি এটি এখনও না দেখায় তবে চলমান এমুলেটর সেটিংসে এবং Send keyboard shortcuts toকম্বোবক্স / ড্রপডাউনটিতে যান তবে Emulator controls (default)বিকল্পটি নির্বাচন করুন ।

এখানে চিত্র বর্ণনা লিখুন

  • এবং তারপরে আবার চেষ্টা করুন ⌘+m

  • আমি আশা করি এটি সাহায্য করে, এটি আমার পক্ষে কাজ করেছিল।


4

আপনি যদি রেডাক্স ব্যবহার করেন তবে আমি নেটিভ ডিবাগারকে প্রতিক্রিয়া জানাতে সুপারিশ করি। এটিতে ক্রোম ডেভোলগুলি অন্তর্ভুক্ত রয়েছে তবে এতে রেডাক্স ডেভলগুলি এবং প্রতিক্রিয়া দেবতুলও রয়েছে।

রেডাক্স ডিভলটুলস : এটি আপনাকে আপনার ক্রিয়াকলাপগুলি দেখতে এবং সেগুলির মধ্য দিয়ে পিছনে এগিয়ে যেতে সহায়তা করে। এটি আপনাকে আপনার রডেক্স স্টোরটি দেখতে দেয় এবং প্রতিটি ক্রিয়াকলাপের জন্য আপডেট হওয়া রাষ্ট্রের সাথে পূর্ববর্তী অবস্থানে স্বয়ংক্রিয়ভাবে পৃথক হওয়ার বৈশিষ্ট্য রয়েছে, যাতে আপনি দেখতে পাচ্ছেন যে ক্রমগুলির ক্রমবর্ধমান পদক্ষেপের মধ্য দিয়ে আপনি পিছনে পিছনে পদক্ষেপ নিচ্ছেন।

দেবতুলের প্রতিক্রিয়া : এটি আপনাকে কোনও নির্দিষ্ট উপাদান, যেমন এর সমস্ত প্রপস তেমনি এটির উপাদান হিসাবেও পরিদর্শন করতে দেয়। যদি আপনার কাছে উপাদানটির একটি অংশ রয়েছে যা বুলিয়ান, এটি আপনাকে এটি টগল করতে ক্লিক করতে দেয় এবং দেখুন যে আপনার অ্যাপ্লিকেশনটি পরিবর্তিত হলে কীভাবে প্রতিক্রিয়া দেখায়। দুর্দান্ত বৈশিষ্ট্য।

ক্রোম ডেভল্টুলস আপনাকে আপনার সমস্ত কনসোল আউটপুটগুলি দেখতে, ব্রেকপয়েন্টগুলি ব্যবহার করতে, ডিবাগারে বিরতি দেওয়ার অনুমতি দেয়; ইত্যাদি স্ট্যান্ডার্ড ডিবাগিং বৈশিষ্ট্য। আপনি যদি রেডাক্স ডিভলটুলগুলিতে আপনার ক্রিয়াগুলি তালিকাভুক্ত থাকে এমন জায়গায় যদি আপনি সঠিকভাবে ক্লিক করেন এবং 'নেটওয়ার্ক পরিদর্শনকে মঞ্জুরি দিন' বাছাই করেন, তবে আপনি ক্রোম ডেভটোলসের নেটওয়ার্ক ট্যাবে আপনার API কলগুলি পরিদর্শন করতে পারেন যা মিষ্টি।

উপসংহারে এই সমস্ত এক জায়গায় থাকা দুর্দান্ত! আপনার যদি তাদের কোনওটির প্রয়োজন না হয় তবে আপনি এটি অন / অফ টগল করতে পারেন। নেটিভ ডিবাগারটি প্রতিক্রিয়া পান এবং জীবন উপভোগ করুন।


4

প্রতিক্রিয়া নেটিভ ডিবাগার অ্যাপ্লিকেশনটি ব্যবহার করার বিকল্প উপায় এটি।

আপনি নীচের লিঙ্কটি ব্যবহার করে অ্যাপ্লিকেশনটি ডাউনলোড করতে পারেন এটি উত্স কোডের সাথে রিডুএক্স স্টোর পরিচালনার জন্য খুব ভাল অ্যাপ্লিকেশন।

প্রতিক্রিয়া-দেশীয়-ডিবাগার

পাশাপাশি এখন আপনার নিজের সহায়তার জন্য নীচের লিঙ্কটি সরাসরি ব্যবহার করতে পারেন।

ক্রোম-ডেভেলপার-সরঞ্জাম


3
  1. আপনি যদি এমুলেটর ব্যবহার করেন তবে Ctrl+ M& সিমুলেটর Cmd+ ব্যবহার করুনD

  2. দূরবর্তী অবস্থান থেকে - ডিবাগ js এ ক্লিক করুন

  3. গুগল ক্রোম কনসোলে যান


3

একটি খুব ভাল ডিবাগার নাম রিঅ্যাকট্রনও রয়েছে। https://github.com/infinitered/reactotron

কিছু ডেটা মান দেখতে আপনাকে ডিবাগ মোডে থাকতে হবে না এবং প্রচুর বিকল্প রয়েছে।

সত্যিই দরকারী যে একবার দেখুন। ;)


ধন্যবাদ! আমরা আরএন 0.59 ব্যবহার করছিলাম যা ফিলিপারের সাথে সামঞ্জস্যপূর্ণ বলে মনে হচ্ছে না।
চিচিলেট

3

প্রতিক্রিয়া-নেটিভ ডিবাগিং মধ্যে অনেক সহজ।

  • আইওএস ব্যবহার ডিবাগ করতে

সেমিডি + ডি

ctrl + cmd + z (সিমুলেটারের জন্য)

  • অ্যান্ড্রয়েডে ডিবাগ করতে

স্পর্শ সহ ডিভাইস কাঁপুন (আপনার বিকাশকারী বিকল্প সক্ষম হয়েছে তা নিশ্চিত করুন)


1
সুন্দর ব্যাখ্যা।
নরেন্দ্র সোলঙ্কি

3

পদক্ষেপ 1:debugger আপনি যেখানে স্ক্রিপ্টটি থামাতে চান সেখানে স্থান দিন :

  async saveItem(item, selectedValue) {
    debugger
    try {
        await AsyncStorage.setItem(item, selectedValue);
    }
    catch (error) {
        console.error('AsyncStorage error: ' + error.message);
    }
}

কোডের এই ব্লকে কখনও নিয়ন্ত্রণ এলে এটি ডিবাগারকে বিরতি দেয়।

পদক্ষেপ 2: প্রেস Cmd+Dউপর iOS এমুলেটর এবং Cmd+Mউপর অ্যান্ড্রয়েড কাল্পনিক । আপনার যদি আসল ডিভাইস থাকে তবে ডেভ মেনু খুলতে ডিভাইসটি কাঁপুন, আপনি যদি ডিভাইসটি নাড়াতে না চান তবে এই ব্লগটি অনুসরণ করুন

পদক্ষেপ 3: নির্বাচন করুন Enable Remote JS Debugging, এটি ক্রোম খুলবে

এখানে চিত্র বর্ণনা লিখুন

পদক্ষেপ 4: নির্বাচন করুনDeveloper Tools.

এখানে চিত্র বর্ণনা লিখুন

পদক্ষেপ 5:Sources আপনি debuggerনিজের কোডের মধ্যে যেখানেই লিখেছেন সেখানে আপনার ডিবাগারটি ট্যাবে বিরাম দেওয়া হয়েছে । কনসোলে যান এবং আপনি যে কোনও প্যারামিটারগুলি ডিবাগ করতে চান তা টাইপ করুন (যা কোড ব্লকে উপস্থিত রয়েছে) যেমন: এখানে চিত্র বর্ণনা লিখুন পরবর্তী ডিবাগার পয়েন্টে যেতে আবার সূত্রগুলিতে যান -> স্ক্রিপ্ট এক্সিকিউশন পুনরায় চালু করুন বোতামটিতে ক্লিক করুন (ডান কোণার নীল বোতাম)

আপনি যেখানেই স্ক্রিপ্টটি থামাতে চান সেখানে ডিবাগারটি রাখুন।

ডিবাগ উপভোগ করুন !!


3

আপনি "ডিবাগ জেএস রিমোটলি" সক্ষম না করেই আপনার অ্যাপের আইওএস সংস্করণটি ডিবাগ করতে সাফারি ব্যবহার করতে পারেন, কেবল নীচের পদক্ষেপগুলি অনুসরণ করুন:

1. Enable Develop menu in Safari: Preferences  Advanced  Select "Show Develop menu in menu bar"
2. Select your app's JSContext: Develop → {Your Simulator} → Automatically Show Web Inspector for JS JSContext
3. Safari's Web Inspector should open which has a Console and a Debugger

3

প্রথমে আপনার আইওএস সিমুলেটারে, আপনি যদি [কমান্ড + ডি] কী টিপেন তবে আপনি এই স্ক্রিনটি দেখতে পাবেন।

এখানে চিত্র বর্ণনা লিখুন

তারপরে ডিবাগ জেএস দূরবর্তী বোতামে ক্লিক করুন।

আপনি এর পরে রিয়েট নেটিভ ডিবাগার পৃষ্ঠাটি দেখতে পাবেন।

এখানে চিত্র বর্ণনা লিখুন

এবং তারপরে আপনার পরিদর্শককে [f12] খুলুন, এবং এটি ডিবাগ কনসোলটিতে যান! :)


1

এটি আসলে বেশ সহজ। শুধু সেন্টিমিডি ডি চাপুন (ম্যাক থাকলে) এবং সিমুলেটর একটি পপ আপ মেনু তৈরি করবে। সেখান থেকে কেবল "ডিবাগ জেএস রিমোটলি" বা তার লাইনের পাশাপাশি কিছু ক্লিক করুন। সাবধান থাকুন যে নির্দিষ্ট প্যাকেজ সম্পর্কিত কোড সম্পাদন করার সময় ডিবাগারটি চালানো লোকজনকে সমস্যা বলে পরিচিত। প্রতিক্রিয়া-স্থানীয়-মানচিত্র এবং ডিবাগার নিয়ে আমার সমস্যা ছিল। তবে তা স্থির ছিল। বেশিরভাগ অংশের জন্য আপনার ভাল হওয়া উচিত।

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