# 170: Гледайте проект за аматьорски завъртане на React + Babel + Webpack + CSS модули - CSS-трикове

Anonim

Честно предупреждение! Това не е бърза, ясна, експертно ориентирана обработка на начина за настройване на тези технологии. Въпреки че в края на краищата ние успешно го правим. Тук става въпрос за документиране на реалния опит от извършването на този вид работа. Някои неща работят лесно, други не. Понякога аз съм виновен. Понякога документите са неясни. Понякога се случват промени под краката ни. Трябва да се бием през всичко това.

Тук имаме малък план. Това, което искаме да направим, е да завъртим локален проект, който използва:

  1. Реагирайте: Да кажем, че изграждаме SPA и силно желаем да работим с модел на компоненти.
  2. ReactDOM - Ние изграждаме за мрежата.
  3. Webpack: Искаме сървър за разработчици, презареждане на горещи модули и начин да обединим зависимостите си по начин, достоен за производството.
  4. Babel: Може да нямаме нужда от много бъдещо компилиране на JavaScript, но се нуждаем от JSX и Babel е това, което го компилира.
  5. CSS модули: Искаме да напишем някои изолирани CSS специфични за компонентите и това е хубав начин да го направим там, където стиловете ни остават в таблици със стилове.

За щастие, докато планирах да направя това видео, намерих статията „Как да създам React приложение от нулата с помощта на Webpack 4“ от Linh Nguyen My. 12.5K пляска на Medium! Еха! Добавих и куп пляскане към него, защото изглежда, че това е единственият урок, който всъщност обхваща тази супер популярна комбинация от приятели по достъпен начин, който всъщност работи.

Това не означава, че всичко върви лесно и гладко! По пътя се натъквам на куп малки проблеми. Част от това са моите дебели пръсти. Някои от тях са загадъчни грешки, които се появяват, когато изпълняваме команди, които едва разбирам. Изглежда, че в някои от тях липсва документация за функциите. Независимо от това, в крайна сметка всичко е подредено и имаме работещ проект!