Uczciwe ostrzeżenie! To nie jest szybkie, proste, oparte na ekspertach omówienie tego, jak skonfigurować te technologie. Chociaż pod koniec udaje nam się wszystko uruchomić. Chodzi o udokumentowanie rzeczywistych doświadczeń związanych z wykonywaniem tego rodzaju pracy. Niektóre rzeczy działają łatwo, inne nie. Czasami to moja wina. Czasami dokumentacja jest niejasna. Czasami pod naszymi stopami zachodziły zmiany. Musimy przez to wszystko walczyć.
Mamy tutaj mały plan. Chcemy stworzyć lokalny projekt wykorzystujący:
- Reaguj: Powiedzmy, że budujemy SPA i bardzo chcemy pracować z modelem komponentów.
- ReactDOM - budujemy dla sieci.
- Webpack: Chcemy serwera deweloperskiego, ponownego ładowania modułów na gorąco i sposobu na spakowanie naszych zależności w sposób godny produkcji.
- Babel: Być może nie będziemy potrzebować dużo późniejszej kompilacji JavaScript, ale potrzebujemy JSX, a Babel jest tym, co go kompiluje.
- Moduły CSS: Chcemy napisać kilka izolowanych CSS specyficznych dla komponentów i jest to dobry sposób na zrobienie tego, gdy nasze style pozostają w arkuszach stylów.
Na szczęście planując nagranie tego filmu, znalazłem artykuł Linh Nguyen My „Jak stworzyć aplikację React od podstaw za pomocą Webpack 4”. 12,5K klaszcze na średnim poziomie! Łał! Dodałem też do tego mnóstwo oklasków, ponieważ wydaje się, że jest to jedyny samouczek, który faktycznie omawia tę super popularną kombinację przyjaciół w przystępny sposób, który faktycznie działa.
Nie oznacza to, że wszystko idzie łatwo i gładko! Po drodze napotykam mnóstwo drobnych kłopotów. Niektóre z nich to moje tłuste palce. Niektóre z nich to tajemnicze błędy, które pojawiają się, gdy uruchamiamy polecenia, których ledwo rozumiem. Wydaje się, że w niektórych z nich brakuje dokumentacji dotyczącej funkcji. Niemniej jednak w końcu wszystko załatwiliśmy i mamy działający projekt!