Udostępnij przez

Instalowanie oprogramowania React w podsystemie Windows dla systemu Linux

Ten przewodnik przeprowadzi Cię przez proces instalowania React w dystrybucji systemu Linux (np. Ubuntu) uruchomionej w Podsystemie Windows dla systemu Linux (WSL) przy użyciu narzędzia frontendowego vite.

Zalecamy wykonanie tych instrukcji, jeśli tworzysz jednostronicową aplikację (SPA), z którą chcesz używać poleceń lub narzędzi Bash, i/lub planujesz wdrożyć ją na serwerze Linux lub korzystać z kontenerów Docker. Jeśli dopiero zaczynasz pracować z platformą React i interesuje Cię nauka, warto rozważyć zainstalowanie narzędzia vite bezpośrednio w systemie Windows.

Aby uzyskać więcej ogólnych informacji na temat platformy React, podejmowania decyzji dotyczących platformy React (aplikacji internetowych), React Native (aplikacji mobilnych) i React Native for Desktop (aplikacji klasycznych), zobacz Omówienie platformy React.

Wymagania wstępne

  • Zainstaluj najnowszą wersję systemu Windows 10 (wersja 1903+, kompilacja 18362+) lub Windows 11
  • Zainstaluj podsystem Windows dla systemu Linux (WSL), w tym dystrybucję systemu Linux (np. Ubuntu) i upewnij się, że działa w trybie WSL 2. Możesz to sprawdzić, otwierając program PowerShell i wprowadzając następujące polecenie: wsl -l -v
  • Zainstaluj Node.js w WSL 2: Te instrukcje wykorzystują Node Version Manager (nvm) do instalacji, musisz mieć niedawną wersję NodeJS, aby uruchomić vite, oraz niedawną wersję Node Package Managera (npm).

Ważne

Zainstalowanie dystrybucji systemu Linux za pomocą programu WSL spowoduje utworzenie katalogu do przechowywania plików: \\wsl\Ubuntu-20.04 (zastąpić ubuntu-20.04 dowolną dystrybucją systemu Linux, której używasz). Aby otworzyć ten katalog w Eksploratorze plików systemu Windows, otwórz wiersz polecenia WSL, wybierz katalog główny przy użyciu cd ~polecenia , a następnie wprowadź polecenie explorer.exe . Zachowaj ostrożność, aby nie instalować środowiska NodeJS lub przechowywać pliki, z którymi będziesz pracować na zainstalowanym dysku C (/mnt/c/Users/yourname$). W ten sposób znacznie spowolni czas instalacji i kompilacji.

Instalowanie oprogramowania React

Aby zainstalować pełny łańcuch narzędzi React w programie WSL, zalecamy użycie narzędzia vite.

  1. Otwórz wiersz polecenia WSL (tj. Ubuntu).

  2. Utwórz nowy folder projektu: mkdir ReactProjects i wprowadź ten katalog: cd ReactProjects.

  3. Zainstaluj platformę React przy użyciu narzędzia vite :

    npm create vite@latest my-react-app -- --template react

  4. Po zainstalowaniu przejdź do katalogu nowej aplikacji ("my-react-app" lub cokolwiek innego, jak ją nazwałeś): cd my-react-app zainstaluj zależności: npm install a następnie uruchom lokalny serwer deweloperski: npm run dev

    To polecenie spowoduje uruchomienie serwera Node.js i uruchomienie nowego okna przeglądarki z wyświetloną aplikacją. Możesz użyć Ctrl + c , aby zatrzymać uruchamianie aplikacji React w wierszu polecenia.

Uwaga

Aplikacja Vite zawiera potok kompilacji frontendowej przy użyciu Babel, esbuild i Rollup, ale nie obsługuje logiki zaplecza ani baz danych. Jeśli chcesz utworzyć witrynę internetową renderowaną na serwerze z platformą React korzystającą z zaplecza Node.js, zalecamy zainstalowanie Next.js, a nie tej instalacji vite, która jest przeznaczona bardziej dla aplikacji jednostronicowych (SPA). Jeśli chcesz utworzyć statyczną witrynę internetową zorientowaną na treść, warto również rozważyć zainstalowanie Gatsby.

  1. Gdy wszystko będzie gotowe do wdrożenia aplikacji internetowej w środowisku produkcyjnym, uruchom polecenie npm run build w celu utworzenia kompilacji aplikacji w folderze "dist". Więcej informacji można dowiedzieć się w temacie Wdrażanie witryny statycznej.

Dodatkowe zasoby

  • Last updated on