Faire Warnung! Dies ist keine schnelle, unkomplizierte und von Experten gesteuerte Einführung in die Einrichtung dieser Technologien. Obwohl wir am Ende alles erfolgreich in Gang bringen. Hier geht es darum, die reale Erfahrung dieser Art von Arbeit zu dokumentieren. Manche Dinge funktionieren leicht, andere nicht. Manchmal ist es meine Schuld. Manchmal sind die Dokumente unklar. Manchmal sind Veränderungen unter unseren Füßen passiert. Wir müssen uns durch alles kämpfen.
Wir haben hier einen kleinen Plan. Wir möchten ein lokales Projekt starten, das Folgendes verwendet:
- Reaktion: Nehmen wir an, wir bauen ein SPA und möchten unbedingt mit einem Komponentenmodell arbeiten.
- ReactDOM - Wir bauen für das Web.
- Webpack: Wir möchten einen Entwicklungsserver, ein erneutes Laden heißer Module und eine Möglichkeit, unsere Abhängigkeiten produktionswürdig zu bündeln.
- Babel: Wir brauchen möglicherweise nicht viel zukünftiges JavaScript-Kompilieren, aber wir brauchen JSX, und Babel ist das, was es kompiliert.
- CSS-Module: Wir möchten isoliertes komponentenspezifisches CSS schreiben. Dies ist eine gute Möglichkeit, wenn unsere Stile in Stylesheets verbleiben.
Glücklicherweise fand ich bei der Planung dieses Videos den Artikel „Erstellen einer React-App von Grund auf mit Webpack 4“ von Linh Nguyen My. 12,5K klatscht auf Medium! Beeindruckend! Ich habe auch eine Menge Klatschen hinzugefügt, weil es das einzige Tutorial zu sein scheint, das diese sehr beliebte Kombination von Freunden auf eine ansprechbare Art und Weise behandelt, die tatsächlich funktioniert.
Das heißt nicht, dass alles einfach und reibungslos verläuft! Auf dem Weg stoße ich auf viele kleine Probleme. Einiges davon bin ich fettfingernde Dinge. Einige davon sind mysteriöse Fehler, die auftreten, wenn wir Befehle ausführen, die ich kaum verstehe. In einigen Fällen scheint die Dokumentation zu den Funktionen zu fehlen. Trotzdem haben wir am Ende alles geklärt und haben ein funktionierendes Projekt!