dowiedz się, jak skonfigurować projekt motywu Gatsby z Lerna: ten przewodnik pomoże Ci zrozumieć, co to jest mono-repozytorium i jak zarządzać nim za pomocą Lerna używając NPM zamiast Przestrzeni Roboczych Yarn.

Index

  • co to jest Lerna i dlaczego warto spróbować?
  • ustawienie Lerny z NPM z powłoki
  • teczki i pliki rusztowań z powłoki
  • Korzystanie z Lerny
    • Wybierz swoje podejście
  • zaaranżuj wszystko za pomocą Lerna bootstrap
  • uruchamiaj polecenia i skrypty
  • Kreator aktualizacji

czym jest Lerna i dlaczego warto spróbować?

zacząłem podążać za kursem Gatsby Theme Authoring od Jasona Lengstorfa (@jlengstorf) i wkrótce zdałem sobie sprawę, że nie wiem nic o 'Przędzalniach Workspaces’. To ładny sposób na zarządzanie tak zwanym mono-repo: repozytorium, które zawiera więcej niż jeden projekt i może współdzielić zależności.

By doppelmutzi from doppelmutzi.github.io:

takie projekty nazywane są przestrzeniami roboczymi lub pakietami. Natomiast używanie wielu repozytoriów z każdym repozytorium zawierającym tylko jeden projekt nazywa się podejściem Multi-Repo.

jedną rzeczą, która zaskoczyła mnie podejściem mono-repo, było to, że moje Pakiety/obszary robocze mogą lokalnie współdzielić te same zależności node_modules. To oszczędza mi czas i przestrzeń fizyczną.

Lerna i obszary robocze yarn dają nam możliwość budowania bibliotek i aplikacji w jednym repozytorium bez zmuszania nas do publikowania w npm lub innych rejestrach. Piękno tych technologii polega na tym, że mogą one znaleźć zależności pakietów, analizując pakiet.pliki json znajdujące się w folderze głównym każdego projektu. Dlatego te narzędzia sprawiają, że ręczne tworzenie dowiązań symbolicznych lub bezpośrednie używanie „niskopoziomowego” łącza npm jest przestarzałe.

teraz, nawet jeśli już używasz yarn workspaces myślę, że Lerna warto spróbować, ponieważ zapewnia szereg widoków. Poza tym można użyć Lerna z przędzy Workspaces:

za pomocą jednego polecenia lerna można iterować przez wszystkie lub poszczególne pakiety, wykonując serię operacji (takich jak linting, testing i building) na każdym pakiecie. W ten sposób uzupełnia obszary robocze yarn, które przejmują proces zarządzania zależnościami.

więc w końcu postanowiłem nauczyć się Lerny-przepraszam za skręcanie języka-ale nie chciałem przestawiać się na włóczkę (bo po prostu dobrze mi z npm). Oto jak udało mi się to zrobić:

ustawienie Lerna z npm z powłoki

Utwórz katalog dla swojego projektu i wpisz na nim to polecenie:

mkdir try-lernacd try-lerna

możesz zainstalować Lerna globalnie (npm i -g lerna) lub użyć go z npx.

  • Init lerna

    npx lerna init --independent

to będzie:

  • init repozytorium git
  • Utwórz package.json
  • Utwórz lerna.json
  • utwórz folder packages (tutaj możesz umieścić swoje przestrzenie robocze).

Pakiety to sposób, w jaki Lerna nazywa przestrzenie robocze.

możesz rozmieścić Pakiety tak, jak chcesz, jeśli wolisz, możesz umieścić wszystkie pakiety w folderze głównym, a następnie zmienić tablicę w celu dopasowania (jak podejście „obszary robocze przędzy”).

Moja lerna.plik json ma stream: true (aby zobaczyć wyjście gatsby ’ ego podczas uruchamiania z lerną) i hoist: true (aby podnieść node_modules również za pomocą polecenia lerna add; wyjaśnię tę ostatnią funkcję do przodu):

{ "packages":, "version":"independent", "stream":true, "command":{ "bootstrap":{ "hoist":true } }}

możesz dodać to ręcznie lub użyć tego prostego polecenia powłoki:

echo "{\r\t\"packages\":,\r\t\"version\":\"independent\",\r\t\"stream\":true,\r\t\"command\":{\r\t\t\"bootstrap\":{\r\t\t\t\"hoist\":true\r\t\t}\r\t}\r}" > lerna.json 

teczki i teczki rusztowań z powłoką

Ta sekcja może być wykonana ręcznie po pierwszej lekcji z kursu Jasona Lengstorfa połączonego we wstępie.
po prostu zbieram wszystkie podstawowe fragmenty, aby je wykonać za pomocą kilku poleceń z powłoki.
w przypadku, gdy chcesz użyć mojego podejścia pamiętaj, aby zastąpić „nazwa” nazwą Twojego motywu, a następnie po prostu skopiuj i wklej to polecenie:

mkdir -p packages/{gatsby-theme-NAME,site}
touch packages/{gatsby-theme-NAME,site}/{index.js,package.json}
echo "//loop" >> packages/{gatsby-theme-NAME,site}/index.js

wstępna Zawartość opakowania.json w folderze strony:

echo "{\r\t\"private\":true,\r\t\"name\":\"site\",\r\t\"version\":\"1.0.0\",\r\t\"license\":\"MIT\",\r\t\"scripts\":{\r\t\t\"builds\":\"gatsby build\",\r\t\t\"develop\":\"gatsby develop\",\r\t\t\"clean\":\"gaysby clean\"\r\t}\r}" >> packages/site/package.json 

paczka.json na temat folderu (zamień nazwę ponownie, a także Wstaw YOUR_NPM_USER):

echo "{\r\t\"name\": \"@YOUR_NPM_USER/gatsby-theme-NAME\",\r\t\"version\": \"1.0.1\",\r\t\"license\": \"MIT\",\r\t\"main\": \"index.js\",\r\t\"scripts\": {\r\t\t\"builds\": \"gatsby build\",\r\t\t\"develop\": \"gatsby develop\",\r\t\t\"clean\": \"gaysby clean\"\r\t}\r}" >> packages/gatsby-theme-NAME/package.json 

oto wynik:

├── packages│ ├── site│ └── gatsby-theme-NAME├── .gitignore├── package.json└── lerna.json

PS: radzę utworzyć .gitignore i od razu dodać node_modules :

echo "node_modules" > .gitignore

używanie Lerny

jednym z problemów z Lerną jest to, że nie można zainstalować wielu zależności na pakiet za pomocą jednego polecenia (tak jak robisz to z yarn workspace name_workspace add package1 package2 etc). Musisz to zrobić jeden po drugim, w ten sposób (jeśli nie zainstalowałeś go globalnie, będziesz musiał poprzedzić każdą komendę npx):

lerna add gatsby --scope site 
lerna add react --scope site
lerna add react-dom --scope site

tutaj --scope site jest używany, aby powiedzieć Lernie, aby zainstalować tylko w pakiecie „site”.

jednak możesz zainstalować zależność, powiedzmy gatsby, dla każdego pakietu za pomocą jednego polecenia:

lerna add gatsby

to polecenie będzie:

  • zainstaluj Gatsby dla każdego pakietu (tak więc w tym przypadku dla witryny, a także dla pakietu motywów).
  • jeśli włączyłeś hoist na lernie.JSON utworzy folder node_modules w katalogu głównym (patrz 'Lerna Bootstrap forward’):

Wybierz swoje podejście

Jeśli podoba ci się to podejście, możesz kontynuować instalowanie wszystkich typowych zależności (react, react-dom) na pakietach. Jeśli chcesz zainstalować niektóre zależności tylko dla jednego pakietu, użyj --scope name_of_the_package (pamiętaj, że jest to nazwa określona na pakiecie.json Nie nazwa folderu).

Możesz również użyć npm, instalując każdą zależność, którą chcesz w danym pakiecie. Pamiętaj jednak, że to podejście zainstaluje zależności node_modules dla każdego odpowiedniego folderu. To może być czyste, a następnie podniesione później. Chociaż ta opcja jest ważna, zajmie ci to więcej czasu.

niezależnie od wybranej opcji pamiętaj, aby dodać / połączyć lokalny Pakiet motywu jako zależność dla pakietu witryny (użyj nazwy, na której Ustawiłeś package.json):

lerna add @YOUR_NPM_USER/gatsby-theme-NAME --scope=site

zaaranżuj wszystko za pomocą Lerna bootstrap

w końcu możesz bezpiecznie zrobić:

lerna bootstrap 

to polecenie jest bardzo pomocne, szczególnie jeśli masz już swój pakiet.json wypełnił ich odpowiednie zależności.

z opcją hoist: true (na lerna.json) umieści współdzielony folder node_modules znajdujący się w katalogu głównym, a następnie połączy lokalne zależności z odpowiednimi package.json.

I really like — Hoist feature jest to proces, który unika powielania zależności od node_modules, dzięki czemu oszczędza fizyczną przestrzeń i czas instalacji.

jeśli z jakiegoś powodu chcesz coś najpierw wyczyścić, możesz:

lerna clean && lerna link && lerna bootstrap 

Uruchamianie poleceń i skryptów

aby uruchomić skrypty (umieszczone na package.json) musisz określić (lub nie) Pakiet docelowy:

lerna run develop --scope Package_name

Lerna pozwala również na uruchamianie dowolnych poleceń z katalogu głównego do każdego pakietu (użyj dash). Na przykład:

lerna exec -- rm -rf node_modules 

spowoduje to usunięcie modułów węzłów w każdym folderze pakietów.

Kreator aktualizacji

w przyszłości, gdy będziesz musiał zaktualizować swoje pakiety, możesz użyć Kreatora aktualizacji:

npm install --save-dev lerna-update-wizard

następnie musisz uruchomić tylko to polecenie, a kreator ci pomoże:

lernaupdate