Sdílet prostřednictvím


Instalace Reactu v subsystému Windows pro Linux

Tato příručka vás provede instalací Reactu v linuxové distribuci (tj. Ubuntu) spuštěné v subsystému Windows pro Linux (WSL) s využitím nástrojů vite front-endu.

Pokud vytváříte jednostránkovou aplikaci (SPA), kterou chcete použít příkazy nebo nástroje Bash s a/nebo plánujete nasazení na server s Linuxem nebo použít kontejnery Dockeru, doporučujeme postupovat podle těchto pokynů. Pokud s Reactem teprve začínáte a zajímáte se jen o výuku, můžete zvážit instalaci pomocí virtuálních počítačů přímo ve Windows.

Další obecné informace o React, rozhodování mezi React (webové aplikace), React Native (mobilní aplikace) a React Native for Desktop (desktopové aplikace) najdete v přehledu React.

Požadavky

  • Instalace nejnovější verze Windows 10 (verze 1903+, build 18362+) nebo Windows 11
  • nainstalovat subsystém Windows pro Linux (WSL), včetně distribuce Linuxu (například Ubuntu) a ujistěte se, že je spuštěný v režimu WSL 2. Můžete to zkontrolovat tak, že otevřete PowerShell a zadáte: wsl -l -v
  • nainstalovat Node.js na WSL 2: Tyto pokyny používají správce verzí uzlu (nvm) k instalaci, budete potřebovat nejnovější verzi NodeJS ke spuštění vite a také nejnovější verzi Node Package Manageru (npm).

Důležité

Instalace linuxové distribuce pomocí WSL vytvoří adresář pro ukládání souborů: \\wsl\Ubuntu-20.04 (nahraďte Ubuntu-20.04 libovolnou distribucí Linuxu, kterou používáte). Pokud chcete tento adresář otevřít v Průzkumníku souborů Windows, otevřete příkazový řádek WSL, vyberte svůj domovský adresář pomocí cd ~a pak zadejte příkaz explorer.exe . Dávejte pozor, abyste nenainstalovali NodeJS nebo ukládal soubory, se kterými budete pracovat na připojené jednotce C (/mnt/c/Users/yourname$). Tím se výrazně zpomalí doba instalace a sestavení.

Nainstalujte React

Pokud chcete nainstalovat úplnou sadu nástrojů React na WSL, doporučujeme použít vite.

  1. Otevřete příkazový řádek WSL (tj. Ubuntu).

  2. Vytvořte novou složku projektu: mkdir ReactProjects a zadejte tento adresář: cd ReactProjects.

  3. Instalace Reactu pomocí vite:

    npm create vite@latest my-react-app -- --template react
    
  4. Po instalaci změňte adresáře do nové aplikace (my-react-app nebo cokoli, co jste se rozhodli volat): cd my-react-app, nainstalujte závislosti: npm install a spusťte místní vývojový server: npm run dev

    Tento příkaz spustí Node.js server a spustí nové okno prohlížeče zobrazující vaši aplikaci. K zastavení spuštění aplikace React na příkazovém řádku můžete použít Ctrl+c.

Poznámka:

Vite zahrnuje frontendovou sestavu pomocí Babel, esbuild a Rollup, ale nezpracovává backendovou logiku ani databáze. Pokud se snažíte vytvořit serverově vykreslený web s Reactem, který používá back-end Node.js, doporučujeme instalaci Next.jsmísto této instalace Vite, která je určená pro jednostránkové aplikace (SPA). Můžete také zvážit instalaci Gatsby, pokud chcete vytvořit statický web orientovaný na obsah.

  1. Až budete připraveni nasadit webovou aplikaci do produkčního prostředí, spuštěním npm run build vytvoříte sestavení aplikace ve složce Dist. Další informace najdete v Nasazení statického webu.

Další zdroje informací