Question

我的项目在当前目录结构中正常工作。当我尝试重构我的项目时，浏览器失败并抛出一个错误，指出意外的令牌，即使代码没有区别。

具体来说，我想将我的app.js（包含我所有的反应组件）移出公共目录到根目录

原始目录结构：

├── README.md
├── data
│   ├── prod-dump.js
├── package.json
├── public
│   ├── css
│   │   └── main.css
│   ├── index.html
│   └── scripts
│       ├── app.js
│       ├── bundle.js
└── server.js

必需的目录结构：

├── README.md
├── data
│   ├── prod-dump.js
├── package.json
├── public
│   ├── css
│   │   └── main.css
│   ├── index.html
│   └── scripts
│       ├── bundle.js
├── app.js
└── server.js

我的app.js中的最初几行代码如下：

var React = require('react');
var ReactDOM = require('react-dom');
var Grid = require('react-bootstrap').Grid;
var Row = require('react-bootstrap').Row;
var Col = require('react-bootstrap').Col;
var Table = require('react-bootstrap').Table;
var Button = require('react-bootstrap').Button;
var Collapse = require('react-bootstrap').Collapse;
var Tabs = require('react-bootstrap').Tabs;
var Tab = require('react-bootstrap').Tab;
var Well = require('react-bootstrap').Well;
var moment = require('moment');
//var DummyData = require('../../data/prod-dump'); <-- changed this line to the next one
var DummyDate = require('./data/prod-dump');



/* Header row for channels page */
var ChannelTableHeaderRow = React.createClass({
    render: function(){
     /* Loop through headers to generate each header jsx */
     var headers = this.props.headers.map(function(header) {
            return ( 
                <th>{header}</th>
            );
     });
    return (
        <tr>
            {headers}
        </tr>
     );
 }

}）;

现在，当我运行browserify命令时，出现以下错误日志：

SyntaxError: /path/app.js: Unexpected token (21:20)
  19 |          var headers = this.props.headers.map(function(header) {
  20 |                 return (
> 21 |                     <th>{header}</th>
     |                     ^
  22 |                 );
  23 |          });
  24 |         return (

我正在运行的命令是：

browserify -t [babelify] ./app.js -o ./public/scripts/bundle.js

Browserify：意外令牌 - 重组项目出错

0 个答案: