如何使用Facebook React管理组件依赖顺序？

Question

假设我有两个React组件,A和B,其中B依赖于(利用)A.假设A在a.js中,B在b.js中.

React有没有办法安全地解决从B到A的依赖？从而保证无论我实际包含a.js和b.js的顺序如何,事情仍然会正确解决？

我相信Google Closure编译器在开发和生产模式下都有效地伪造了一个依赖系统.这使得不同代码包含在源中的顺序无关紧要; React有这样的东西吗？

Answer 1

注意:下面的答案非常过时.

我很久以前就停止使用RequireJS了,因为它在开发过程中变得相当慢,因为它没有在开发中的单个文件中捆绑JS.

这些天我主要使用Webpack.
您还可以考虑其他捆绑包,例如Browserify和Rollup.

我用ES模块作为模块系统,transpiled由巴别成CommonJS的.最终我计划完全转向ES模块,因为拥有一流支持的更多捆绑商,如Rollup和Webpack 2,成为主流.

老答案

据我所知,React本身并没有提供任何依赖管理系统; 如果您需要,您必须使用适合您工作流程的现有工具.

就个人而言,我很高兴使用RequireJS和AMD糖语法,所以我的模块看起来像这样:

/** @jsx React.DOM */
/* jshint trailing:false, quotmark:false, newcap:false */
define(function (require) {

  'use strict';

  var React = require('react'),
      _ = require('underscore'),
      JoinWidget = require('common/views/join_widget');

  var LoginWidget = React.createClass({
    // ...
  });
});

与任何其他类一样,每个React视图都有自己的文件.

这在开发环境中很好,但我不想在生产中动态加载脚本,所以我使用grunt-requirejs任务和杏仁以正确的顺序连接文件,因此它们总是在一个文件中同步加载.