it-swarm.com.de

Reagieren Sie nativ: lokale Abhängigkeit von npm link, Modul kann nicht aufgelöst werden

Ich entwickle ein Button-UI-Paket für das native Reagieren. Ich versuche, ein Beispielprojekt zu erstellen, um diese Schaltfläche zu testen. Die Verzeichnisstruktur sieht wie folgt aus:

my-button/
    package.json
    index.js
    example/
        package.json
        index.js

Ich versuche, npm link zu verwenden:

cd my-button
npm link

cd example
npm link my-button

In example/node_modules/ kann ich den MyLink-Symlink sehen. VSCode kann auch die Funktion zum automatischen Abschließen des My-Button-Pakets verwenden.

Die Beispielanwendung ausführen zeigt jedoch einen Fehler an:

Unable to resolve module my-button ...
Module does not exist in the module map or in these directories: ...

Der Pfad in der Fehlermeldung ist jedoch korrekt.

Wissen Sie nicht, wo ich mich geirrt habe, oder haben Sie in React-Native eine spezielle Möglichkeit, mit der lokalen Abhängigkeit von Links umzugehen?

Ich habe auch npm install file:../. ausprobiert. Es funktioniert auf diese Weise gut, aber es ist nicht einfach, die Abhängigkeit in example/ zu aktualisieren, nachdem ich meine Schaltfläche bearbeitet habe.

22
Rick Liao

Der Befehl npm link funktioniert nicht, da der React Native-Packager keine Symlinks unterstützt.

Nach einer kurzen Recherche entdeckte ich, dass es zwei Möglichkeiten gibt, dies zu tun.

  1. Verwenden Sie haul packager in der Beispiel-App. Haul unterstützt Symlinks, sodass Sie npm link wie gewohnt verwenden können.
  2. Verwenden Sie die lokale Abhängigkeit über file:../ und bearbeiten Sie dann die Dateien im Ordner node_modules, oder installieren Sie sie jedes Mal neu, wenn Sie Änderungen vornehmen.

Ich habe Haul gefunden, um für diesen Anwendungsfall großartig zu arbeiten und sogar ein kleines Starterprojekt einzurichten das auch Storybook enthält, was wirklich hilfreich ist, wenn Sie viele Komponenten zum Wechseln haben.

12
pavloko

Versuchen Sie es mit wml ( https://github.com/wix/wml )

Es ist eine Alternative zu npm link, bei dem geänderte Dateien tatsächlich in die Zielordner kopiert werden

# add the link to wml using `wml add <src> <dest>`
wml add ~/my-package ~/main-project/node_modules/my-package

# start watching all links added
wml start
15
Asaf Katz

Ich bin in das gleiche Problem geraten. Ich konnte zwar npm link nicht so arbeiten lassen, wie es sollte, aber ich habe das lokale Paket im Projektordner installiert

npm install ../<package-folder> --save

Dadurch wird das Paket wie ein normales Paket installiert, jedoch aus dem lokalen Ordner. Der Nachteil ist, dass die Änderungen, die Sie an dem Paket vornehmen, nicht übernommen werden. Sie müssen nach jeder Änderung npm install.

2
aayush shrestha

Ändern Sie Ihre package.json

//...
"dependencies": {
   //...
    "my-button" : "file:../"
  },
//...
0
KimHau