Aracılığıyla paylaş


Linux için Windows Alt Sisteminde React'i yükleme

Bu kılavuz, Vite ön uç araçlarını kullanarak WSL'de (Linux için Windows Alt Sistemi) React geliştirme ortamı ayarlama işleminde yol gösterir.

Bir Linux sunucusuna dağıtım yapmayı, Docker kapsayıcılarını kullanmayı veya Bash tabanlı araçlarla çalışmayı planlıyorsanız WSL önerilir. React'i kullanmaya yeni başladıysanız ve hızlı bir şekilde başlamak istiyorsanız React'i doğrudan Windows'a yüklemeyi göz önünde bulundurun.

React'in arka planı ve web uygulamaları, mobil uygulamalar (React Native) ve yerel masaüstü uygulamaları (Masaüstü için React Native) gibi farklı senaryolar için React'e genel bakış bölümüne bakın.

Önkoşullar

  • WSL 2: WSL'yi Linux dağıtımıyla yükleyin (Ubuntu önerilir) ve WSL 2 modunda çalıştığını onaylayın: wsl -l -v. Windows 10 sürüm 2004 veya üzeri ya da Windows 11 gerektirir.
  • WSL 2'deNode.js: nvm kullanarak Node.js WSL dağıtımınızın içine yükleyin. WSL içinde Node.js Windows tarafından yüklenen sürümünü kullanmayın.

Önemli

Proje dosyalarınızı bağlı Windows sürücüsünde () değil, ~/projectsWSL dosya sisteminde (/mnt/c/ör. ) depolayın. Dosya sistemi sınırında çalışmak yükleme ve derleme sürelerini önemli ölçüde yavaşlatır.

React uygulamanızı oluşturma

  1. WSL terminalinizi açın (örneğin, Ubuntu).

  2. Yeni bir proje klasörü oluşturun ve bunu girin:

    mkdir ~/ReactProjects
    cd ~/ReactProjects
    
  3. Vite kullanarak yeni bir React uygulaması oluşturun:

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

    Vite, my-react-app klasöründe yeni bir React projesi oluşturacak.

  4. Yeni uygulama klasörüne gidin ve bağımlılıkları yükleyin:

    cd my-react-app
    npm install
    
  5. Yerel geliştirme sunucusunu başlatın:

    npm run dev
    

    Uygulamanız adresinde http://localhost:5173kullanılabilir olacaktır. Sunucuyu durdurmak için Ctrl+C tuşlarını kullanın.

  6. Dağıtıma hazır olduğunuzda bir üretim paketi oluşturun:

    npm run build
    

    dist klasörüne çıktı yerleştirilir. Barındırma seçenekleri için bkz. Statik Site Dağıtma .

Uyarı

Vite, tek sayfalı uygulamalar (SPA) için idealdir. Sunucu tarafı işlemeye veya Node.js arka ucuna ihtiyacınız varsa bunun yerine Next.js düşünün. Statik site oluşturma için bkz. Gatsby.

Ek kaynaklar