React projenizi oluşturmak için hâlâ create-react-app kullanıyor musunuz? Daha iyi performans ve daha hızlı geliştirme hızı için Vite'a geçin.

Yeni bir React projesine başlarken birçok geliştirici, oluştur-tepki-uygulaması proje kurulumu ve konfigürasyonu için go-to komut aracı olarak. Ancak, Vite daha iyi bir alternatiftir. Daha hızlı geliştirme süreleri ve daha iyi performans sunar.

Vite Nedir?

Vite, modern web uygulamalarının geliştirme sürecini iyileştirmek için tasarlanmış bir oluşturma aracı ve geliştirme sunucusudur. Bunu, uygulama modüllerinizi bağımlılıklara ve kaynak koduna bölerek yapar. Bağımlılıklar, sık sık değişmeyen modüllerdir, oysa kaynak kodu genellikle geliştirme sırasında sık sık düzenlenir.

Vite kullanımları inşa etmek, kaynak kodun oluşturma sürecini hızlandırmak için geleneksel JavaScript tabanlı paket oluşturuculardan önemli ölçüde daha hızlı olan Go tabanlı bir paketleyici. Ayrıca, uygulamanızın bağımlılıklarını önceden paketler ve yerel ESM üzerinden kaynak kodunu sunar. tarayıcıların daha verimli ve daha hızlı uygulama için modüllerin yüklenmesini optimize etmesine olanak tanır verim. Uygulamanızı üretime dağıtma zamanı geldiğinde, Vite, uygulamanızı dağıtım için otomatik olarak optimize eden ve uygulamanızın sorunsuz çalışmasını sağlayan yerleşik bir oluşturma komutuna sahiptir.

instagram viewer

Vite Projesi Oluşturma

Bir Vite projesi oluşturmadan önce, Vite'ın Node.js sürüm 14.18+ veya 16+ gerektirdiğini unutmayın. Node'u Windows veya Ubuntu makinenize kurmak için bu makalelere başvurabilirsiniz.

  • Nasıl Node.js'yi Windows'a yükleyin.
  • Öğrenmek Ubuntu'da Npm ve Node.js nasıl kurulur

Terminalde bu komutu çalıştırarak bir Vite projesi oluşturun.

npm vite@latest oluştur

Komut yürütülmeye başladığında, sizden bir proje adı istenecektir. Projenizin adını yazın ve enter'a tıklayın.

Ardından, Vite sizden bir çerçeve seçmenizi isteyecektir. React'i seçin.

Vite ayrıca bir varyant seçmenizi isteyecektir. JavaScript'i seçin.

Vite proje iskelesini tamamladığında, oluşturduğu dizinde gezinin ve bağımlılıkları npm yoluyla kurun.

npm kurulum

Projeyi çalıştırmak için şu komutu kullanın:

npm geliştiriciyi çalıştır

Bu ana sayfa olmalıdır.

Projenizi düzenlemeye başlayabilirsiniz ve değişiklikleriniz tarayıcıya yansıtılacaktır.

Hızlı Geliştirme Hızı için Vite Kullanın

CRA (create-react-app), genellikle bir React uygulaması için proje yapısını ve konfigürasyonunu ayarlamak için varsayılan araçtır. Her şey sizin için ayarlandığı için uygundur, ancak geliştirme sırasında oluşturmak ve yeniden yüklemek yavaş olabilir.

Öte yandan Vite, daha hızlı derleme süreleri sağlamak için tarayıcıda yerel ES modüllerini kullanır. Vite kullanmak istemiyorsanız Next.js gibi yüksek performanslı olacak şekilde tasarlanmış bir React meta çerçevesini tercih edebilirsiniz.