1

我正在尝试让react-router启动并运行，但不知何故 React 没有在 react-router 中定义，因此失败并出现错误

Uncaught TypeError: Cannot read property 'createClass' of undefined

我稍后也会收到此错误：

Uncaught Error: Load timeout for modules: jsx!testapp_unnormalized2,jsx!testapp

知道我在这里做错了什么吗？我只是想让路由器工作而不连接所有文件。

这是应用程序的外观：

索引.html

<!-- ... -->

    <script data-main="../resources/js/init" src="../resources/bower_components/requirejs/require.js"></script>

</body>

<!-- ... -->

初始化.js

require.config({

  paths: {
    react: "/resources/bower_components/react/react-with-addons",
    JSXTransformer: "/resources/bower_components/jsx-requirejs-plugin/js/JSXTransformer",
    jsx: "/resources/bower_components/jsx-requirejs-plugin/js/jsx",
    jquery : "/resources/bower_components/jquery/dist/jquery",
    'react-router' : "/resources/bower_components/react-router/dist/react-router",
    'react-router-shim': 'react-router-shim'
  },

  shim : {

    'react-router': {
      deps:    ['react'],
      exports: 'Router'
    }
  },
});

require(['jsx!testapp'], function(App){
  var app = new App();
  app.init();
});

反应路由器 shim.js

define(['react'], function(React) {
  "use strict";

  window.React = React;
});

testapp.js

define(function(require){
  var React = require('react');
  var Router = require('react-router');

  var Route = Router.Route;
  var NotFoundRoute = Router.NotFoundRoute;
  var DefaultRoute = Router.DefaultRoute;
  var Link = Router.Link;
  var RouteHandler = Router.RouteHandler;

  var routes = (
    <Route handler={Home} path="/">
      <DefaultRoute handler={Home} />
    </Route>
  );

  var Home = React.createClass({
    render: function() {
      return(
        <p>This is the mathias page</p>
      );
    }
  });

  var App;

  App.init = function () {
    Router.run(routes, Router.HistoryLocation, function (Handler) {
      React.render(<Handler/>, document.getElementById('content'));
    });
  };

  return App;

});
4

1 回答 1

1

react-router 不支持 AMD，因此默认不会加载 React 依赖项。相反，您应该首先加载 React 并将其设置为全局 ( window.React = React)，或者使用 RequireJS shim 配置将 React 作为全局加载。

有关 react-router 和 AMD 的更多讨论，请参阅react-router#171。

于 2014-12-05T19:02:02.267 回答