Browserify:导出模块，并通过脚本标签访问

Browserify: export module and acess via script tag

本文关键字：脚本 标签 访问 模块 Browserify      更新时间：2023-09-26

我试图导出一个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变量不在窗口作用域中。我不知道我是不是错过了什么。有人知道吗?

当您将Link模块导出为module.exports = Link时，它仅适用于require它的任何组件。要使该模块在windows作用域中可用你必须像这样把它放在windows作用域中

window.Link = React.createClass({
....
})
相关文章：