Question

我试图通过命令行使用browserify捆绑我的依赖项。该命令完成没有错误 - 从我所知道的，但加载页面会产生一个＆＃39; Unexpected token＆lt;＆＃39;错误。

这是我使用的命令：

browserify -t [ babelify --presets [ es2015 react ] ] main.js -o bundle.js

main.js

'use strict';
var React = require('react');
var ReactDom = require('react-dom');
var $ = require('jQuery');

JSX：

'use strict';

var React = require('react');
var ReactDom = require('react-dom');
var $ = require('jQuery');

class SideNav extends React.Component{
constructor(props) {
    super(props);
    this.state = {items: new Array()};

}
componentDidMount() {
    $.ajax({
        url:"/json/sidenav.json",
        dataType: "json",
        cache: false,
        success: function(data) {
            this.setState({items: data});
        }.bind(this)
    });
}
render() {
     var items = [];
     this.state.items.forEach((item) => {
         items.push(<NavItem title={item.title} link={item.link} active={item.active} />);
     });
    return (
        <ul className="nav nav-sidebar">
        {items}
        </ul>
    );
  }

}
class NavItem extends React.Component{
    render() {
        var clazz = this.props.active ? 'active' : '';
        var link = this.props.active ? 
                <a href="#">{this.props.title} <span className="sr-only">(current)</span></a> :
                <a href={this.props.link}>{this.props.title}</a>
        return (
            <li className={clazz}>{link}</li>
        );
    }
}

ReactDOM.render(
    <SideNav/>, 
    document.getElementById('sidenav')
);

Answer 1

非常感谢ArneHugo！他意识到我在我的.hmtl中包含了JSX，这意味着它没有被翻译过来。将它移动到main.js然后修复错字修复问题。

React Browserify Babel - 意外的令牌错误

1 个答案: