Wie importiere ich Assets außerhalb des „src'-Verzeichnisses in der Create React App?

So handhaben Sie Importbeschränkungen außerhalb des Src-Verzeichnisses in Create-React-App

In Create-React-App werden Dateien von außerhalb importiert Das src-Verzeichnis ist eingeschränkt. Durch diese Einschränkung wird sichergestellt, dass die Quelldateien zur besseren Organisation im angegebenen Ordner verbleiben und unnötige Importe verhindert werden.

Wenn die folgende Fehlermeldung angezeigt wird:

Module not found: You attempted to... import ../../public/images/logo/WC-BlackonWhite.jpg which falls outside of the project src/ directory. Relative imports outside of src/ are not supported.

Das bedeutet, dass Sie versuchen zu importieren ein Bild von außerhalb des src-Verzeichnisses. Mehrere Ansätze können dieses Problem lösen:

1. Assets in das Src-Verzeichnis verschieben

Verschieben Sie die Bilddatei in das Src-Verzeichnis, damit sie importiert werden kann. Dadurch wird sichergestellt, dass sich alle wichtigen Dateien im angegebenen Quellordner befinden.

2. Verwenden Sie URLs für Assets aus öffentlichen Ordnern

Anstatt aus dem öffentlichen Ordner zu importieren, verwenden Sie absolute oder relative URLs, um direkt aus dem öffentlichen Ordner auf das Bild zuzugreifen. Dieser Ansatz vermeidet die Importbeschränkung und ermöglicht Ihnen den Zugriff auf Assets von außerhalb des src-Verzeichnisses.

Wichtiger Hinweis: Es ist wichtig, den direkten Import aus dem öffentlichen Ordner zu vermeiden, da dies zu Duplikaten führen kann Assets im Build und wirken sich auf die optimale Ladeeffizienz der Anwendung aus. Durch den Import aus dem src-Ordner wird sichergestellt, dass Webpack die Dateien effektiv bündelt und so deren Größe und Ladegeschwindigkeit optimiert.

Das obige ist der detaillierte Inhalt vonWie importiere ich Assets außerhalb des „src'-Verzeichnisses in der Create React App?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!