2015-05-24 18 views
6

Tarayıcınızı veya web paketini kullanmadan ReactRouter ile reaksiyon kullanmak mümkündür. http://rackt.github.io/react-router belgelerini izleyerek tepki ve tepki vericisi gerekiyor (require('react-router');). Tarayıcımı kullanırsam, oluşturulan paketim yaklaşık 1MB dosya boyutudır, bu çok fazla ses verir.Web paketini kullanmadan veya tarayıcıya göz atmayın React + (Router)

Tüm gereksinimleri tek başıma toplamak yerine, derlenmiş JS'yi https://cdnjs.cloudflare.com/ajax/libs/react-router/0.13.3/ReactRouter.js gibi bir CDN'den derlemekle çalışmak mümkün müdür? Bir CDN ile çalışmayı denediğimde, Route'un tanımlanmadığı bir hata alıyorum. Ama cdn dosyasında dışa aktarılmış gibi görünüyor. Benim JSX/ES6 derlemek istiyoruz

bileşenleri ReactRouter içermekte olup CDN JS-dosyaları tepki ve yalnızca yeni bir js dosyası içine benim bileşenleri paket tepki.

Bu, projeyi kurmak için mümkün mü? (Birkaç github reposuna baktım).

<head> 
    CND :include react, react-router 
    my code combinded.js 
</head> 

cevap

2

Eğer CDN dan önceden oluşturulmuş sürümünü kullanıyorsanız, kütüphane window.ReactRouter üzerine ihraç edilmektedir: bu sözde html gibi http://rackt.github.io/react-router/

üzerinde hiçbir kurulum kılavuzu yoktur çünkü bazı şüphelerim var. Yani Route, window.ReactRouter.Route'da tanımlanmıştır.

React Router ayrıca React'a dayandığından beri, CDN/tarayıcı yapısını kullanarak React'un window.React numaralı telefondan edinilmesini gerektirir.

Bu, bağlı olduğunuz CDN sürümünün kendisinin, web paketi ile oluşturulduğunu belirtti, bu yüzden herhangi bir dosya boyutu geliştirmesi alacağınızı beklemiyorum. Dosya boyutunu küçültüp küçümsemediğini görmek için browserify paketinizde minification/dead code eliminasyonuna bakabilirsiniz.

2

Paylaşmak istediğim bir başka bilgi, web paketindeki externals (https://webpack.github.io/docs/library-and-externals.html) kullanma olasılığıdır. aşağıdaki gibi kullanabilirsiniz: Soruma sordu olarak

externals: { 
    "react": "React", 
    "react/addons": "React", 
    "reflux" : "Reflux" 
} 

bu, daha küçük paket ile sonuçlanır ve kullanabileceğiniz bir CDN dan tepki verirler. Bu aynı zamanda gulp ile inşa süresini azaltır.

İlgili konular