Question

我正在尝试将javascript模块（在这种情况下，使用React实现）导出到文件并通过脚本标记访问它。

到目前为止我做了什么。我的剧本：

var Link = React.createClass({

    propTypes: {
        data: React.PropTypes.object,
        classname: React.PropTypes.string,
        target: React.PropTypes.string
    },

    render: function() {
        return <a href={this.props.data.url} title={ this.props.data.name } className={ this.props.classname }>{ this.props.data.name }</a>;
    }

});

module.exports = Link;

使用grunt，我有一个任务要将其转换为ES5（使用grunt-react）并浏览它：

browserify: {
   options: {
     transform: [ require('grunt-react').browserify ]
   },
   client: {
     src: ['src/components/Link.js'],
     dest: 'dist/components/Link.js'
   }
}

生成了Link.js文件，但Link变量不在窗口范围内。我不知道我是否遗漏了什么。任何人都有任何想法？

Answer 1

当您将Link模块导出为module.exports = Link时，它仅适用于require个window.Link = React.createClass({ .... })的任何组件。要在Windows范围内使该模块可用，您必须将其放在Windows范围内，如此

{{1}}

Browserify：通过脚本标记导出模块和访问

1 个答案: