web-dev-qa-db-de.com

Native React-App erstellen - Plugin/Preset-Dateien dürfen keine Objekte exportieren, sondern nur Funktionen

Brauche Hilfe, ich bekomme einen seltsamen Fehler aus dem linken Feld, den ich nicht debuggen konnte. Dieses Projekt wurde bis gestern erfolgreich gebündelt, nachdem ich mein reaktives Projekt auf einem anderen Mac eingerichtet hatte.

Ich frage mich, ob es sich um die Versionierung von npm-Paketen handelt, die ich neu installieren musste. 

Jede Richtung wäre hilfreich, es ist immer das Setup, das am schwierigsten ist, weil Sie es so selten tun ...

Meine Babelrc-Datei sieht wie folgt aus -

{
    "presets": ["babel-preset-expo"],
    "env": {
        "development": {
            "plugins": ["transform-react-jsx-source"]
        }
    }
}

Und mein package.json

{
  "name": "hancho_frontend",
  "version": "0.1.0",
  "private": true,
  "devDependencies": {
    "jest-expo": "~27.0.0",
    "react-native-scripts": "^1.14.1",
    "react-test-renderer": "16.3.1"
  },
  "main": "./node_modules/react-native-scripts/build/bin/crna-entry.js",
  "scripts": {
    "start": "react-native-scripts start",
    "eject": "react-native-scripts eject",
    "Android": "react-native-scripts Android",
    "ios": "react-native-scripts ios",
    "test": "jest"
  },
  "jest": {
    "preset": "jest-expo"
  },
  "dependencies": {
    "@expo/vector-icons": "^6.2.0",
    "axios": "^0.18.0",
    "babel-core": "^6.26.3",
    "babel-loader": "^7.1.4",
    "babel-preset-es2015": "^6.24.1",
    "babel-preset-react": "^6.24.1",
    "babel-upgrade": "0.0.19",
    "color": "^2.0.0",
    "expo": "^27.1.0",
    "hoist-non-react-statics": "^2.3.0",
    "moment": "^2.22.2",
    "prop-types": "^15.6.2",
    "react": "^16.3.1",
    "react-dom": "^16.4.1",
    "react-fontawesome": "^1.6.1",
    "react-native": "^0.56.0",
    "react-native-dropdownalert": "^3.1.2",
    "react-native-extended-stylesheet": "^0.8.0",
    "react-navigation": "^2.6.1",
    "react-redux": "^5.0.7",
    "react-router-dom": "^4.3.1",
    "redux": "^4.0.0",
    "redux-axios-middleware": "^4.0.0",
    "redux-logger": "^3.0.6",
    "redux-thunk": "^2.3.0",
    "webpack": "^4.15.1"
  }
}

Ich habe definitiv Pakete, die ich nicht installiert habe, aber es hat in der Vergangenheit kein Problem verursacht. 

Ich habe den Cache geleert, node_modules deinstalliert und neu installiert. Ich habe auch auf eine frühere Version von Expo zurückgegriffen, die ich zuvor gearbeitet hatte. Immer noch kein Glück. 

Danke im Voraus!

6
hancho

create-React-native-app verwendet Expo, die ab dem aktuellen Release (SDK V29) React Native 0.56 nicht unterstützt. Seine Veröffentlichung Ankündigung erklärt warum:

Aus zwei Gründen haben wir für diese Version kein Update auf React Native 0.56.0 durchgeführt. Zunächst und vor allem in React Native 0.56.0 wurde babel von 7.04.1 auf 7.0.0-beta.47 aktualisiert. Frühere Erfahrungen mit Babel-Updates haben uns gezeigt, dass sie frustrierend und zeitaufwendig für Entwickler sein können, die nur ihre App versenden und die Zeit für Infrastruktur-Thrashing auf ein Minimum reduzieren möchten. Daher wollten wir uns mehr Zeit für die Stabilisierung geben.

Zweitens führt 0.56.0 einige Fehler ein und enthält nicht genügend nützliche Funktionen und Korrekturen über 0.55.4, um den Kompromiss zwischen der Aktualisierung von babel zu rechtfertigen.

Wenn Sie wirklich RN 0.56 verwenden möchten und Expo nicht verwenden müssen, können Sie die Abhängigkeit entfernen, indem Sie npm run eject im Projekt ausführen. Es wird immer noch eine ähnliche Fehlermeldung angezeigt, wenn Sie Ihre App laden, jedoch aufgrund einer anderen Abhängigkeit, die beim Auswerfen auftritt. Um dies zu beheben, installieren Sie [email protected] und ersetzen Sie "Babel-Preset-React-Native-Stage-0/Decorator-Support" durch "Babel-Preset-React-Native" in der .babelrc-Datei des Projekts. (Beachten Sie, dass .babelrc nach der Ausführung des Auswurfbefehls anders aussieht.)

6
fagerbua

Ich habe versucht, ein reaktives System von 0.55.2 auf 0.53.0 zu aktualisieren, und bin auf diesen Fehler gestoßen. Ich habe nicht versucht, es darüber hinaus aufzuspüren, aber das Reagieren auf 0.55 sollte das Problem beheben.

2
Rob D

Meine App wird ausgeworfen und die Antwort von fagerbua hat geholfen, aber ich musste mich noch ein bisschen weiter darum kümmern, damit es funktioniert. Ich startete schließlich eine neue Create-React-native-App, die auswirft, und package.json und .babelrc für die Verwendung von babel-preset-react-native, die Version 0.56.0 von react-native und die Version 16.4.1 von react bearbeitet. Ich musste auch das transform-react-jsx-source-Plugin aus der .babelrc-Datei entfernen. Nachfolgend sind die Dateien aufgeführt, die für eine minimal funktionierende [email protected]-App verwendet werden:

.babelrc-Datei:

{
  "presets": [
    "babel-preset-react-native"
  ]
}

package.json:

{
  "name": "myapp",
  "version": "0.1.0",
  "private": true,
  "devDependencies": {
    "babel-preset-react-native": "^5",
    "jest": "^23.4.2",
    "jest-react-native": "^18.0.0",
    "react-test-renderer": "16.3.1"
  },
  "scripts": {
    "start": "react-native start",
    "Android": "react-native run-Android",
    "ios": "react-native run-ios",
    "test": "jest"
  },
  "jest": {
    "preset": "react-native"
  },
  "dependencies": {
    "react": "^16.4.1",
    "react-native": "^0.56.0"
  }
}

Nachdem ich mit der Basis-App gearbeitet hatte, kopierte ich diese Änderungen zurück in meine Haupt-App, entfernte meinen node_modules-Ordner, tat npm install und alles hat funktioniert. Ich bin nicht sicher, ob die aktualisierte Jest-Version benötigt wurde. Ich verwende keinen Jest, wurde aber beim Erstellen automatisch hinzugefügt.

1
Dan Taylor

Als Ergänzung zu @fagerbua antworten. Wenn Sie [email protected] verwenden möchten, müssen Sie .babelrc Durch { "presets": [ "react-native" ] } Ändern. Sie benötigen jest-react-native Nicht mehr, aber Sie müssen [email protected]

1
user9908214