反应 jsx 和 babel 的意外标记
Unexpected token with react jsx and babel
我正在尝试开始使用 React。我安装了 npm、browserify、babel 及其预设。 Babel 无法转换 JSX 代码。任何人都可以帮助我了解正在发生的事情。我是否为 babel 使用了正确的预设?我的 demo.js
"use strict";
var React = require('react');
var ReactDOM = require('react-dom');
var Test = React.createClass({
render: function(){
var {a, b, ...other} = this.props;
return(
<div>Hi</div>
);
}
});
这是我 运行 创建包的命令。
sudo browserify -t [ babelify --presets [ es2015 react ] ] src/demo.js -o ./bundle/app.js
以下是我得到的错误
SyntaxError: /Users/shashank/git_views/srh_labs/webui/src/demo.js: Unexpected token (8:13)
6 | var Test = React.createClass({
7 | render: function(){
> 8 | var {a, b, ...other} = this.props;
| ^
9 | return(
10 | <div>Hi</div>
11 | );
at Parser.pp.raise (/Users/shashank/git_views/srh_labs/webui/node_modules/babylon/lib/parser/location.js:24:13)
at Parser.pp.unexpected (/Users/shashank/git_views/srh_labs/webui/node_modules/babylon/lib/parser/util.js:91:8)
at Parser.pp.parseIdentifier (/Users/shashank/git_views/srh_labs/webui/node_modules/babylon/lib/parser/expression.js:999:10)
at Parser.pp.parsePropertyName (/Users/shashank/git_views/srh_labs/webui/node_modules/babylon/lib/parser/expression.js:821:135)
at Parser.pp.parseObj (/Users/shashank/git_views/srh_labs/webui/node_modules/babylon/lib/parser/expression.js:737:12)
at Parser.pp.parseBindingAtom (/Users/shashank/git_views/srh_labs/webui/node_modules/babylon/lib/parser/lval.js:163:19)
at Parser.pp.parseVarHead (/Users/shashank/git_views/srh_labs/webui/node_modules/babylon/lib/parser/statement.js:591:18)
at Parser.<anonymous> (/Users/shashank/git_views/srh_labs/webui/node_modules/babylon/lib/plugins/flow.js:953:13)
at Parser.parseVarHead (/Users/shashank/git_views/srh_labs/webui/node_modules/babylon/lib/plugins/flow.js:953:13)
at Parser.pp.parseVar (/Users/shashank/git_views/srh_labs/webui/node_modules/babylon/lib/parser/statement.js:574:10)
$ sudo browserify -t [ babelify --presets [ es2015 react ] ] src/demo.js -o ../server/rest/src/main/webapp/uiserver/bundle/app.js
对象 rest/spread 运算符(在第 8 行中使用)不是 es2015
包的一部分。你必须安装 transform-object-rest-spread 插件来转换它。
尝试创建一个 .babelrc 文件并将其放入:
{
"presets": ["react"]
}
我正在尝试开始使用 React。我安装了 npm、browserify、babel 及其预设。 Babel 无法转换 JSX 代码。任何人都可以帮助我了解正在发生的事情。我是否为 babel 使用了正确的预设?我的 demo.js
"use strict";
var React = require('react');
var ReactDOM = require('react-dom');
var Test = React.createClass({
render: function(){
var {a, b, ...other} = this.props;
return(
<div>Hi</div>
);
}
});
这是我 运行 创建包的命令。
sudo browserify -t [ babelify --presets [ es2015 react ] ] src/demo.js -o ./bundle/app.js
以下是我得到的错误
SyntaxError: /Users/shashank/git_views/srh_labs/webui/src/demo.js: Unexpected token (8:13)
6 | var Test = React.createClass({
7 | render: function(){
> 8 | var {a, b, ...other} = this.props;
| ^
9 | return(
10 | <div>Hi</div>
11 | );
at Parser.pp.raise (/Users/shashank/git_views/srh_labs/webui/node_modules/babylon/lib/parser/location.js:24:13)
at Parser.pp.unexpected (/Users/shashank/git_views/srh_labs/webui/node_modules/babylon/lib/parser/util.js:91:8)
at Parser.pp.parseIdentifier (/Users/shashank/git_views/srh_labs/webui/node_modules/babylon/lib/parser/expression.js:999:10)
at Parser.pp.parsePropertyName (/Users/shashank/git_views/srh_labs/webui/node_modules/babylon/lib/parser/expression.js:821:135)
at Parser.pp.parseObj (/Users/shashank/git_views/srh_labs/webui/node_modules/babylon/lib/parser/expression.js:737:12)
at Parser.pp.parseBindingAtom (/Users/shashank/git_views/srh_labs/webui/node_modules/babylon/lib/parser/lval.js:163:19)
at Parser.pp.parseVarHead (/Users/shashank/git_views/srh_labs/webui/node_modules/babylon/lib/parser/statement.js:591:18)
at Parser.<anonymous> (/Users/shashank/git_views/srh_labs/webui/node_modules/babylon/lib/plugins/flow.js:953:13)
at Parser.parseVarHead (/Users/shashank/git_views/srh_labs/webui/node_modules/babylon/lib/plugins/flow.js:953:13)
at Parser.pp.parseVar (/Users/shashank/git_views/srh_labs/webui/node_modules/babylon/lib/parser/statement.js:574:10)
$ sudo browserify -t [ babelify --presets [ es2015 react ] ] src/demo.js -o ../server/rest/src/main/webapp/uiserver/bundle/app.js
对象 rest/spread 运算符(在第 8 行中使用)不是 es2015
包的一部分。你必须安装 transform-object-rest-spread 插件来转换它。
尝试创建一个 .babelrc 文件并将其放入:
{
"presets": ["react"]
}