React-Native: แอปพลิเคชันยังไม่ได้ลงทะเบียนข้อผิดพลาด

ขณะนี้ฉันกำลังเข้าสู่บทเรียนแบบโต้ตอบ React-Native ฉันเริ่มต้นด้วยการสอนการเริ่มต้นใช้งานซึ่งฉันสร้างโปรเจ็คต์แบบเนทีฟใหม่และสามารถจัดการโปรเจ็กต์บนอุปกรณ์ของฉันได้สำเร็จ

จากนั้นฉันก็เริ่มต้นบทช่วยสอนอุปกรณ์ประกอบฉากฉันคัดลอกข้อมูลโค้ดและพยายามเรียกใช้โครงการอีกครั้งและมีข้อความแสดงข้อผิดพลาดต่อไปนี้ปรากฏขึ้นบนหน้าจอ:

ฉันเดาว่ามันเป็นข้อผิดพลาดที่เกิดจากการไม่ตรงกับชื่อโครงการและส่วนประกอบที่ลงทะเบียนของคุณ

คุณมีโครงการที่มีชื่อเดียวเช่น

react-native init AwesomeApp

แต่ในไฟล์ index.ios.js คุณต้องลงทะเบียนส่วนประกอบอื่น ๆ

AppRegistry.registerComponent('Bananas', () => Bananas);

เมื่อมันต้องเป็น

AppRegistry.registerComponent('AwesomeApp', () => Bananas);

พยายามแก้ไข

ปัญหาส่วนใหญ่คือคุณมีreact-native startเซิร์ฟเวอร์อื่น(เช่น React Native Packager) ที่ทำงานบนเทอร์มินัลอื่นหรือแท็บอื่นของ TMUX (ถ้าคุณใช้ TMUX)

คุณต้องค้นหากระบวนการนั้นและปิดมันดังนั้นหลังจากใช้งานreact-native run-iosแล้วมันจะสร้างเซิร์ฟเวอร์แพ็คเก็ตใหม่ที่ลงทะเบียนสำหรับแอปพลิเคชันเฉพาะนั้น

เพียงค้นหากระบวนการที่ใช้:

ps aux | grep react-native

ค้นหา id กระบวนการ (PID) และฆ่ากระบวนการบรรจุหีบห่อโดยใช้killคำสั่ง (เช่นkill -9 [PID]) คุณควรหาlaunchPackager.commandแอพนี้ใน macOS ไม่แน่ใจเกี่ยวกับระบบปฏิบัติการอื่น

จากนั้นลองเรียกใช้run-ios(หรือ Android) อีกครั้ง คุณควรจะเห็นเส้นทางใหม่หลังจากใช้งานเซิร์ฟเวอร์แพ็คเกจใหม่เช่น:

Looking for JS files in
   /Users/afshin/Desktop/awesome-app 

แก้ไขMainActivityแบบนี้

@Override
protected String getMainComponentName() {
    return "Bananas"; // here
}

โซลูชันของฉันคือเปลี่ยนชื่อโมดูลใน "AppDelegate.m"

จาก moduleName:@"AwesomeProject"

ถึง moduleName:@"YourNewProjectName"

ก่อนอื่นคุณต้องเริ่มต้นแอปพลิเคชันของคุณ:

react-native start

จากนั้นคุณต้องตั้งชื่อแอปพลิเคชันของคุณเป็นอาร์กิวเมนต์แรกของ registerComponent

มันใช้งานได้ดี

AppRegistry.registerComponent('YourProjectName', () => YourComponentName);

โปรดตรวจสอบไฟล์ app.json ของคุณในโครงการ หากไม่มีแอป LineKey คุณจะต้องเพิ่ม

{
  "expo": {
    "sdkVersion": "27.0.0",
    "appKey": "mydojo"
  },
  "name": "mydojo",
  "displayName": "mydojo"
}

ในกรณีของฉันมีบรรทัดนี้ใน MainActivity.java ซึ่งพลาดเมื่อฉันใช้react-native-renamecli (จาก NPM)

protected String getMainComponentName() {
    return "AwesomeApp";
}

เห็นได้ชัดว่าคุณต้องเปลี่ยนชื่อเป็นชื่อแอปของคุณ

ฉันคิดว่าเซิร์ฟเวอร์โหนดทำงานจากโฟลเดอร์อื่น ดังนั้นฆ่ามันและเรียกใช้ในโฟลเดอร์ปัจจุบัน

ค้นหาเซิร์ฟเวอร์โหนดที่ทำงาน: -

lsof -i :8081

ปิดการใช้งานโหนดเซิร์ฟเวอร์: -

kill -9 <PID>

เช่น:-

kill -9 1653

เริ่มเซิร์ฟเวอร์โหนดจากโฟลเดอร์เนทีฟปัจจุบัน: -

react-native run-android

ฉันมีปัญหาเดียวกันและสำหรับฉันสาเหตุที่ฉันเรียกใช้ (เริ่มต้น - ดั้งเดิมเริ่ม) ผู้ทำแพ็กเก็ตจากโฟลเดอร์ปฏิกิริยาอื่น (AwesomeApp) ในขณะที่ฉันสร้างโครงการอื่นในโฟลเดอร์อื่น

การเรียกใช้ตัวทำสำเนาจากไดเรกทอรีของแอพใหม่นั้นแก้ไขได้

นี่อาจเป็นเพราะชื่อส่วนประกอบรูทเริ่มต้นด้วยตัวพิมพ์เล็ก

สร้างใหม่อีกครั้งหรือสร้างโครงการอีกครั้งด้วยชื่อ PascalCase

เช่นติดไฟ HelloWord ใหม่

คำตอบที่ได้รับทั้งหมดไม่ได้ผลสำหรับฉัน

ฉันมีกระบวนการโหนดอื่นที่ทำงานในเทอร์มินัลอื่นฉันปิดเทอร์มินัลคำสั่งนั้นและทุกอย่างทำงานตามที่คาดไว้

คุณต้องลงทะเบียนใน index.android.js / index.ios.js

แบบนี้:

'use strict';

import {
    AppRegistry
} from 'react-native';

import app from "./app";

AppRegistry.registerComponent('test', () => app);

ฉันแก้ไขสิ่งนี้ได้โดยเปลี่ยนสิ่งต่อไปนี้ในไฟล์ app.json ดูเหมือนว่าอักษรตัวใหญ่กำลังโยนข้อผิดพลาดนี้

จาก:

{
  "name": "Nameofmyapp",
  ...
}

ถึง:

{
  "name": "nameofmyapp",
  ...
}

แทนที่จะเปลี่ยนชื่อในAppRegistry,

เรียกใช้ชุดเริ่มต้นของกล้วยปฏิกิริยาซึ่งจะสร้างรหัสตัวเร่งปฏิกิริยาสำหรับโครงการกล้วยและAppRegistry.registerComponentจะชี้ไปที่กล้วยโดยอัตโนมัติ

AppRegistry.registerComponent('Bananas', () => Bananas);

ไม่ใช่วิธีแก้ปัญหาที่ได้ผลสำหรับฉัน ฉันต้องฆ่ากระบวนการต่อไปนี้และรันการโต้ตอบแบบเนทีฟ - รัน - แอนดรอยด์และทำงานได้

โหนด. / local-cli/cli.js สตาร์ท

ผมมีปัญหาเหมือนกัน. ฉันใช้ Windows เพื่อสร้างแอปที่ตอบสนองพื้นเมืองสำหรับ Android และมีข้อผิดพลาดเดียวกัน นี่คือสิ่งที่ทำงาน

• นำทางไปยังโฟลเดอร์ANDROIDในรูทของคุณ
• สร้างไฟล์ที่มีชื่อ: local.properties
• เปิดในเครื่องมือแก้ไขและเขียน:

sdk.dir = C: \ Users \ USERNAME \ AppData \ Local \ Android \ sdk

• แทนที่ USERNAME ด้วยชื่อเครื่องของคุณ

บันทึกและเรียกใช้แอปตามปกติ ที่ทำงานให้ฉัน

ปัญหานี้จะปรากฏเมื่อใน index.js คุณได้ตั้งชื่อแอปที่แตกต่างจากชื่อที่คุณมอบให้เป็นหุ่นยนต์ / iOS แพคเกจ ; อาจเกิดขึ้นเมื่อคุณเปิดแอป ดังนั้นโปรดตรวจสอบให้แน่ใจว่าเมื่อโทร AppRegistry.registerComponent('someappname', () => App)แล้วจะใช้ชื่อแอปพลิเคชันบางอย่างสำหรับแพ็กเกจดั้งเดิมหรือชื่อผู้ใช้

ฉันคิดว่าปัญหาเกิดขึ้นในกรณีของฉัน (Windows 10 OS) แต่อาจช่วยใน Linux ด้วย (คุณอาจลอง)

ในwindows power shellเมื่อคุณต้องการเรียกใช้แอพ (ครั้งแรกหลังจากบูตพีซี) โดยดำเนินการคำสั่งต่อไปนี้

react-native run-android

มันเริ่มต้นnode process/JS serverในอีกconsole panelและคุณไม่พบข้อผิดพลาดนี้ แต่เมื่อคุณต้องการเรียกใช้แอปอื่นคุณต้องจำเป็นต้องปิดที่ทำงานอยู่แล้ว JS server console panelจากนั้นดำเนินการคำสั่งเดียวกันสำหรับแอปอื่นจากpower shellคำสั่งนั้นจะเริ่มต้นเซิร์ฟเวอร์ JS ใหม่สำหรับแอปนี้โดยอัตโนมัติและคุณจะไม่พบข้อผิดพลาดนี้

คุณไม่จำเป็นต้องปิดและเปิดใหม่ power shellสำหรับการเรียกใช้แอปอื่นคุณต้องปิด node consoleเพื่อเรียกใช้แอปอื่น

หลังจากได้อ่านทั้งหมดข้างต้นฉันพบว่าอาจมีเหตุผลอื่นสำหรับเรื่องนี้

ในกรณีของฉัน:

react-native-cli: 2.0.1

ปฏิกิริยาพื้นเมือง: 0.60.4

และโครงสร้างต่อไปนี้:

ก่อนอื่นจะต้องมีการตั้งข้อสังเกตว่า index.android ไม่ได้รับการอัพเดตใน Android Studio เมื่อบิลด์ build รันโดย Metro builder (react-native run-android) ดังนั้นจึงต้องทำด้วยตนเอง นอกจากนี้ใน Android studio ไม่ "อ่าน"

app.json (สร้างโดยค่าเริ่มต้นพร้อมกับ index.js ซึ่งเปลี่ยนชื่อเป็น index.android.js):

 {
    "name": "authApp",
    "displayName": "authApp"
 }

และเช่นนี้

(ในกรณีของฉัน)

import {authApp as appName} from './app.json';

ทำให้ข้อเท็จจริงที่ว่า Android studio ไม่ทราบว่า authApp อ้างถึงอะไร ฉันแก้ไขในขณะที่อ้างถึงชื่อแอปด้วยชื่อสตริงและไม่ได้ใช้การนำเข้านั้นจาก app.json:

AppRegistry.registerComponent('authApp', () => MyApp);

วิธีนี้แก้ไขได้สำหรับฉัน

AppRegistry.registerComponent('main', () => App);

ดังนั้นindex.jsไฟล์ของฉัน

import { AppRegistry } from 'react-native';
import App from './App';
AppRegistry.registerComponent('main', () => App);

และpackage.jsonไฟล์ของฉัน:

"dependencies": {
    "react": "^16.13.1",
    "react-dom": "~16.9.0",
    "react-native": "~0.61.5"
},

วิธีนี้ใช้ได้ผลกับฉันหลังจากการดีบัก 2 วัน เปลี่ยนสิ่งนี้:

AppRegistry.registerComponent('AppName', () => App);

ถึง

AppRegistry.registerComponent('main', () => App);