Отверстие на стороне сервера с React.js

Question

Мне не удается отобразить мою семантику на стороне сервера Reactjs. Он работает без семантики, поэтому проблем с моим кодом на стороне сервера не возникает. сбой сервера и дает начальные строки ошибки:

/Users/isik/Dev/portfolio/reactjs-server-side-rendering/node_modules/semantic-ui-dropdown/index.js:3443 
})(require("jquery"), window, document); 
        ^

ReferenceError: window is not defined 

У меня есть JQuery insatlled с НПМ. А также, наконец, попытался установить jsdom версию jsdom@3.1.2. Никто не работал.

Я использую Recipes-Server-side rendering в semantic-ui странице.

код я использую для моей стороны серверного компонента заключается в следующем:

var React = require('react'); 
var jquery = require('jquery'); 
var dropdown = require('semantic-ui-dropdown'); 

// Can use JSX too 
var Component = React.createClass({ 
    componentDidMount: function() { 
     $('.ui.dropdown').dropdown(); 
    }, 
    componentDidUpdate: function() { 
     $('.ui.dropdown').dropdown('refresh'); 
    }, 
    render: function(){ 
     return(
       <div className="ui selection dropdown"> 
        <input type="hidden" name="gender"/> 
        <i className="dropdown icon"></i> 
        <div className="default text">Gender</div> 
        <div className="menu"> 
         <div className="item" data-value="1">Male</div> 
         <div className="item" data-value="0">Female</div> 
        </div> 
       </div> 
     ); 
    } 
}); 

module.exports.Component = Component; 

Это общая известная проблема с серверной стороны рендеринга с семантическим-интерфейсом или я делаю это не так?

Answer 1

Попробуйте это:

componentDidMount: function() { 
    var dropdown = require('semantic-ui-dropdown'); 
    $('.ui.dropdown').dropdown(); 
}, 

Я думаю, что вызов require('semantic-ui-dropdown') требует, чтобы существующий window инициализирован в DOM

И удалить фактические require('semantic-ui-dropdown') из верхней части файла