Javascript 需求与流量的集成

我有一个结合了

React JS

和

Require JS

的应用程序。现在在同一个应用程序中，我试图通过将它与

Flux

集成来扩展同一个应用程序。根据我阅读的教程，我知道我必须使用

Dispatcher.js

和

invariant.js

。使用

requirejs

我已经加载了这两个文件，并且我正在尝试创建

Dispatcher

的对象，但是在不同的浏览器中会出现不同的错误

define(["react", "dispatcher","invariant"],
   function(React, Dispatcher,invariant) {
    var demo1 = React.createClass({
        componentWillMount: function() {
            var AppDispatcher = new Dispatcher();
            console.log("Inside compnentDidMount");

        },
        render :function() {
            return (
                <div id="demoHeader">
                    <h1>Header of the application</h1>
                </div>
            );
        }
    }),

    PageLayout = React.createClass({
        render: function() {
            return (
                <div>
                    <HeaderContainer />
                </div>
            );
        }
    })
    return PageLayout;
});

Dispatcher.js的代码是：

/**
*版权所有（c）2014-2015，Facebook，Inc。
*版权所有。
*
*此源代码根据中的BSD样式许可证进行许可
*此源目录树的根目录中的许可证文件。额外补助金
*可以在同一目录的专利文件中找到专利权的名称。
*
*@providesModule调度器
*@打字检查
*@munge
*/
“严格使用”；
var invariant=需要（'./不变量'）；
var_前缀='ID_'；
/**
*Dispatcher用于将有效负载广播到已注册的回调。这是
*在两个方面不同于一般发布子系统：
*
*1）回调未订阅特定事件。每个有效载荷都是
*发送到每个已注册回调。
*2）回调可以全部或部分推迟，直到其他回调完成
*他被处决了。
*
*例如，考虑这个假设飞行目的地形式，
*选择国家/地区时选择默认城市：
*
*var flightDispatcher=new Dispatcher（）；
*
*//跟踪选择的国家/地区
*var CountryStore={country:null}；
*
*//跟踪选择的城市
*var CityStore={city:null}；
*
*//跟踪所选城市的基本航班价格
*var FlightPriceStore={price:null}
*
*当用户更改所选城市时，我们将发送有效负载：
*
*飞行调度({
*actionType:“城市更新”，
*精选城市：“巴黎”
*   });
*
*此有效负载由“CityStore”消化：
*
*flightDispatcher.register（功能（有效负载）{
*如果（payload.actionType===‘城市更新’）{
*CityStore.city=payload.selectedCity；
*     }
*   });
*
*当用户选择一个国家时，我们发送有效负载：
*
*飞行调度({
*actionType:“国家/地区更新”，
*选定国家：'澳大利亚'
*   });
*
*此有效负载由两个存储区消化：
*
*CountryStore.dispatchToken=flightDispatcher.register（函数（有效负载）{
*如果（payload.actionType===‘国家/地区更新’）{
*CountryStore.country=payload.selectedCountry；
*     }
*   });
*
*注册更新'CountryStore'的回调时，我们保存一个引用
*返回到返回的令牌。将此令牌与'waitFor（）`'一起使用，我们可以保证
*该'CountryStore'在更新'CityStore'的回调之前更新`
*需要查询其数据。
*
*CityStore.dispatchToken=flightDispatcher.register（函数（有效负载）{
*如果（payload.actionType===‘国家/地区更新’）{
*//`CountryStore.country`可能不会更新。
*flightDispatcher.waitFor（[CountryStore.DispatcheToken]）；
*//`CountryStore.country`现在保证更新。
*
*//选择新国家/地区的默认城市
*CityStore.city=getDefaultCityForCountry（CountryStore.country）；
*     }
*   });
*
*“waitFor（）”的用法可以链接，例如：
*
*FlightPriceStore.dispatchToken=
*flightDispatcher.register（功能（有效负载）{
*开关（有效负载.动作类型）{
*案例“国家更新”：
*“城市更新”案例：
*flightDispatcher.waitFor（[CityStore.dispatchToken]）；
*价格商店=
*getFlightPriceStore（CountryStore.country、CityStore.city）；
*中断；
*     }
*   });
*
*“国家/地区更新”有效负载将保证调用存储”
*已注册回调的顺序为：`CountryStore`、`CityStore`，然后
*“FlightPriceStore”。
*/
类调度器{
构造函数（）{
这个。_lastID=1；
这个。_回调={}；
这个。_isPending={}；
这个._isHandled={}；
这一点。_isDispatching=false；
此参数为_pendingPayload=null；
}
/**
*注册一个回调，以便在每个已调度的有效负载中调用。返回
*可与'waitFor（）'一起使用的标记。
*
*@param{function}回调
*@return{string}
*/
寄存器（回调）{
变量id=_前缀+此。_lastID++；
此._回调[id]=回调；
返回id；
}
/**
*删除基于其标记的回调。
*
*@param{string}id
*/
注销（id）{
不变的(
此._回调[id]，
'Dispatcher.unregister（…）：'%s'未映射到已注册的回调。'，
身份证件
);
删除此项。_回调[id]；
}
/**
*在继续执行之前，等待调用指定的回调
*当前回调的。此方法只能由中的回调使用
*对已调度有效负载的响应。
*
*@param{array}ids
*/
等待（ID）{
不变的(
这是我的派送，
“Dispatcher.waitFor（…）：在分派时必须调用。”
);
对于（变量ii=0；iiFirefox: 
    SyntaxError: class is a reserved identifier (Dispatcher.js line: 107)
    ReferenceError: module is not defined (Invariant.js line: 53)

Chrome: 
    Uncaught ReferenceError: module is not defined (Invariant.js line: 53)
    Uncaught ReferenceError: module is not defined (Dispatcher.js line: 247)