Creați aliasuri de cale în React js

(13 sept. 2020)

Acest tutorial vă va ghida să creați aliasuri de cale pentru proiectul dvs. de reacție. Crearea aliasurilor de cale pentru active sau componente face codul să arate mai curat și mai frumos. De exemplu, uitați-vă la imaginea de mai jos, înainte și după.

Înainte
După

Nu pare mai curat? Acest lucru se potrivește foarte bine dacă proiectul dvs. este mare și trebuie să importați o mulțime de fișiere și componente în fișierul dvs. Așadar, să începem cum să creăm aliasuri de cale în react js.

Cerințe

  1. Deschideți terminal în directorul rădăcină al proiectului dvs. și instalați react-app-rewired și react-app-rewire-alias ca dependență de dev.
npm install react-app-rewired react-app-rewire-alias --save-dev

2. Acum, în directorul rădăcină, creați un fișier cu numele config-overrides.js și lipiți codul de mai jos.

Aici importăm mai întâi {alias} din react-app-rewire-alias. După aceea, adăugăm un obiect cu perechi cheie-valoare în alias unde cheia este definirea căii dvs. și valoarea este calea. Puteți adăuga mai multe perechi cheie-valoare pentru diferite definiții și căi.

3. Acum deschideți package.json și „Flip” apelurile existente de la react-scripts la react-app-rewired

4. Acum puteți utiliza noile aliasuri în cadrul proiectului React js.

5. Porniți-vă proiectul npm start pentru a verifica dacă funcționează sau nu.

Mai jos este depozitul Github pentru referință.

Mediumtutorial/path-aliases-react-medium

Acest proiect a fost încărcat cu aplicația Create React. În directorul proiectului, puteți rula: Rulează aplicația în …

github.com