2015-05-24 11 views
6

क्या ब्राउज़र या वेबपैक का उपयोग किये बिना, ReactRouter के साथ प्रतिक्रिया का उपयोग करना संभव है। मैं http://rackt.github.io/react-router से प्रलेखन का पालन कर रहा हूं, उन्हें प्रतिक्रिया और प्रतिक्रिया-राउटर (require('react-router');) की आवश्यकता होती है। अगर मैं ब्रोवरफली का उपयोग करता हूं तो मेरा जेनरेट किया गया बंडल लगभग 1 एमबी फाइलसाइज होता है, जो बहुत कुछ लगता है।वेबपैक के बिना प्रतिक्रिया + (राउटर) या ब्राउज़र

तो क्या सीडीएन से संकलित जेएस सहित https://cdnjs.cloudflare.com/ajax/libs/react-router/0.13.3/ReactRouter.js, मेरे द्वारा सभी आवश्यकताओं को बंडल करने के बजाय प्रतिक्रियाशील प्राप्त करना संभव है? अगर मैं इसे सीडीएन के साथ काम करने की कोशिश करता हूं, तो मुझे एक त्रुटि मिलती है कि रूट परिभाषित नहीं किया गया है। लेकिन ऐसा लगता है कि यह सीडीएन फ़ाइल में निर्यात किया जाता है।

मैं अपने जेएसएक्स/ईएस 6 प्रतिक्रिया घटकों को संकलित करना चाहता हूं, रेक्ट राउटर और सीडीएन से जेएस-फाइलों को प्रतिक्रिया दें और केवल मेरे घटकों को एक नई जेएस फ़ाइल में बंडल करें।

क्या यह संभव है या परियोजना को स्थापित करने के लिए सही तरीका है और वेबपैक सही है? (मैंने कई गिथब रिपो को देखा)। मैं कुछ संदेह हो गया इस छद्म एचटीएमएल तरह http://rackt.github.io/react-router/

पर कोई अधिष्ठापन गाइड है क्योंकि:

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

उत्तर

2

आप CDN से पहले से बनाए गए संस्करण का उपयोग कर रहे हैं, पुस्तकालय window.ReactRouter पर निर्यात किया जाता है। तो, Route को window.ReactRouter.Route पर परिभाषित किया गया है।

चूंकि रिएक्ट राउटर भी प्रतिक्रिया पर निर्भर करता है, सीडीएन/ब्राउज़र निर्माण का उपयोग करने के लिए Reactwindow.React पर भी उपलब्ध होगा।

उस ने कहा, सीडीएन संस्करण जो आपने लिंक किया है, स्वयं वेबपैक के साथ उत्पन्न हुआ है, इसलिए मुझे उम्मीद नहीं है कि आपको कोई फ़ाइल आकार सुधार मिलेगा। यह देखने के लिए कि क्या यह फ़ाइल आकार घटता है, आप अपने ब्राउज़र को बंडल पर खनन/मृत कोड उन्मूलन में देख सकते हैं।

2

एक अतिरिक्त जानकारी जो मैं साझा करना चाहता हूं वह वेबपैक कॉन्फ़िगरेशन में बाहरी (https://webpack.github.io/docs/library-and-externals.html) का उपयोग करने की संभावना है। मैं निम्नलिखित के रूप में उपयोग:

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

इस एक छोटे बंडल में परिणाम और आप उपयोग कर सकते हैं एक CDN से प्रतिक्रिया के रूप में मेरे सवाल में पूछा। यह गिल्प के साथ बिल्डटाइम भी कम करता है।

संबंधित मुद्दे