React-dom.js import语句导致Uncaught ReferenceError：未定义define。

Question

我正在编写测试组件，以便使用Typescript集成到我的项目中，并在Visual Studio中做出反应。我可以使用一些帮助来跟踪以下代码出现问题的原因：

define(["require", "exports", 'react', 'react-dom'], function (require, exports, React, ReactDo m）

在Scripts / typings / react-dom / react-dom.d.ts引用路径行上，标记错误说明： “未捕获的ReferenceError：未定义的定义”
报告错误的行是第8行，如下所示的javascript版本的第1行：

typescript组件如下所示：

///<reference path='../../Scripts/typings/react/react.d.ts' />
///<reference path='../../Scripts/typings/react-dom/react-dom.d.ts' />

import React = require('react');
import ReactDom = require('react-dom');


interface P {
name?: string;
}

interface S {
complete?: boolean;
}


class Goal extends React.Component<P, S> {
state: S = {
    complete: false
}

private _toggleCompletion = () => {
    this.setState({ complete: !this.state.complete });
}

render() {
    var status = 'Status: ' + (this.state.complete ? 'complete' : 'incomplete');
    return React.DOM.div({
        children: [
            React.DOM.div({}, this.props.name + ' - ' + status),
            React.DOM.button({
                onClick: this._toggleCompletion
            }, 'Toggle completion')
        ]
    });
}
}

ReactDom.render(React.createElement(Goal, { name: 'Learn React and TypeScript' }),
    document.getElementById('react'));  

此文件的已编译Javscript版本如下：

 /// <reference path='../../Scripts/typings/react/react.d.ts' />
    /// <reference path='../../Scripts/typings/react-dom/react-dom.d.ts' />
    var __extends = (this && this.__extends) || function (d, b) {
    for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p];
    function __() { this.constructor = d; }
    d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
};
define(["require", "exports", 'react', 'react-dom'], function (require, exports, React, ReactDom) {
    var Goal = (function (_super) {
        __extends(Goal, _super);
        function Goal() {
            var _this = this;
            _super.apply(this, arguments);
            this.state = {
                complete: false
            };
            this._toggleCompletion = function () {
                _this.setState({ complete: !_this.state.complete });
            };
        }
        Goal.prototype.render = function () {
            var status = 'Status: ' + (this.state.complete ? 'complete' : 'incomplete');
            return React.DOM.div({
                children: [
                    React.DOM.div({}, this.props.name + ' - ' + status),
                    React.DOM.button({
                        onClick: this._toggleCompletion
                    }, 'Toggle completion')
                ]
            });
        };
        return Goal;
    })(React.Component);
    ReactDom.render(React.createElement(Goal, { name: 'Learn React and TypeScript' }), document.getElementById('react'));
});