ReactJS और Flask Python

के साथ Isomorphic ऐप में 'विंडो' ऑब्जेक्ट प्रबंधित करना मैं ReactJS फ्रंट के साथ फ्लास्क बैकएंड के साथ एक एप्लिकेशन विकसित कर रहा हूं। ReactJS ऐप विकसित किया गया है और वेबपैक के साथ बंडल किया गया है।ReactJS और Flask Python

सब कुछ क्लाइंट साइड प्रतिपादन के साथ ठीक काम करता है जो webpack के साथ बंडल किया जाता है।

अब मैं python-react के साथ सर्वर साइड प्रतिपादन जोड़ने की कोशिश कर रहा हूं।

लेकिन समस्या यह है, मैं मूल टेम्पलेट index.html जो reactjs जड़ घटक नोड <div id='react-node'></div> है में Jinja2 template के माध्यम से मेरी ReactJS एप्लिकेशन के लिए कुछ चर साझा करने के लिए।

मैं नीचे की तरह jinja2 टेम्पलेट के माध्यम से अपने आवेदन करने के लिए अपने routes और config भेजने के लिए, था

//index.html 

<!doctype html> 
<html> 
... 
... 

<script type='text/javascript'> 
    var STATIC_IMAGE_ROOT = "{{ url_for('static', filename='img/') }}"; 
    var ROUTES = { ... }; 
... 
</script> 

</html>

उपरोक्त सभी js चर वैश्विक window वस्तु के लिए सेट किया जा रहा है।

लेकिन जब मैं पायथन में घटक प्रस्तुत करने की कोशिश कर रहा हूं, तो यह window ऑब्जेक्ट ReactRenderingError: react: ReferenceError: window is not defined के लिए अपवाद फेंकता है।

इस समस्या को हल करने का सबसे अच्छा तरीका क्या है?

स्रोत

2015-06-24 Ibrahim

हाय! आप 'React.renderToString' (या' React.renderToStaticMarkup') सर्वर पक्ष का उपयोग करते हैं? – Jean

सर्वर पर प्रतिपादन करते समय कोई विंडो वैश्विक नहीं है। तुम्हें पता है, एक नकली खिड़की बना सकते हैं पहले पता चल सके कि खिड़की मौजूद है:

if (typeof(window) == 'undefined'){ 
    global.window = new Object(); 
}

वैकल्पिक रूप से, आप jsdom, या किसी ऐसे लाइब्रेरी का उपयोग एक नकली डोम बनाने के लिए कर सकते हैं।

स्रोत

2015-06-24 19:45:32 Mark

लॉल आप किस नकली खिड़की का नकल करते हैं? –

ऐप के प्रारंभिक होने के करीब, नोड में जब आप वैश्विक पर कुछ परिभाषित करते हैं तो यह सभी फ़ाइलों के लिए उपलब्ध है। यदि आपका 'npm start' index.js नामक एक स्क्रिप्ट चला रहा है, तो इसे index.js या index.js की फ़ाइलों में से एक में परिभाषित करने का प्रयास करें। – TigerC10

बस webpack config के लिए निम्नलिखित जोड़ें:

// By default, Webpack is set up to target the browser, 
    // not a Node environment. Try setting target in your config: 
    target: 'node',

स्रोत

2016-03-01 14:39:41

ReactJS और Flask Python

उत्तर

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