为什么我在遵循 React.js 教程时总是收到类似意外令牌的错误答案

【问题标题】：Why I keep get error like unexpected token when follow React.js tutorial为什么我在遵循 React.js 教程时总是收到类似意外令牌的错误
【发布时间】：2016-04-12 12:18:01
【问题描述】：

[UPDATE]：原来我并没有完全按照官方网站所说的那样，这意味着我需要在命令中添加“[ ]”。 p>

全部：

我对 react.js 很陌生，当我关注 official site tutorial 时，我使用的步骤是：

A.构建文件 main.js

B. npm install -g browserify

C. npm install --save react react-dom babelify babel-preset-react

D. browserify -t babelify --presets react main.js -o bundle.js

然后我得到类似的错误：

SyntaxError: c:/Temp/web/lnreact/main.js: Unexpected token (6:2)
  4 |
  5 | ReactDOM.render(
> 6 |   <h1>Hello, world!</h1>,
    |   ^
  7 |   document.getElementById('example')
  8 | );
    at Parser.pp.raise (c:\Temp\web\lnreact\node_modules\babelify\node_modules\babel-core\node_modul
es\babylon\index.js:1413:13)
    at Parser.pp.unexpected (c:\Temp\web\lnreact\node_modules\babelify\node_modules\babel-core\node_
modules\babylon\index.js:2895:8)
    at Parser.pp.parseExprAtom (c:\Temp\web\lnreact\node_modules\babelify\node_modules\babel-core\no
de_modules\babylon\index.js:746:12)
    at Parser.pp.parseExprSubscripts (c:\Temp\web\lnreact\node_modules\babelify\node_modules\babel-c
ore\node_modules\babylon\index.js:501:19)
    at Parser.pp.parseMaybeUnary (c:\Temp\web\lnreact\node_modules\babelify\node_modules\babel-core\
node_modules\babylon\index.js:481:19)
    at Parser.pp.parseExprOps (c:\Temp\web\lnreact\node_modules\babelify\node_modules\babel-core\nod
e_modules\babylon\index.js:412:19)
    at Parser.pp.parseMaybeConditional (c:\Temp\web\lnreact\node_modules\babelify\node_modules\babel
-core\node_modules\babylon\index.js:394:19)
    at Parser.pp.parseMaybeAssign (c:\Temp\web\lnreact\node_modules\babelify\node_modules\babel-core
\node_modules\babylon\index.js:357:19)
    at Parser.pp.parseExprListItem (c:\Temp\web\lnreact\node_modules\babelify\node_modules\babel-cor
e\node_modules\babylon\index.js:1224:16)
    at Parser.pp.parseCallExpressionArguments (c:\Temp\web\lnreact\node_modules\babelify\node_module
s\babel-core\node_modules\babylon\index.js:577:20)

我想知道我哪里做错了？

谢谢

【问题讨论】：

你是否将 React 导入到你的 main.js 中？
@JoshBeam 我从官方网站的“使用 npm 中的 React”下复制 main.js 中的相同代码
我认为是 JSX 错误
是的，这无疑是一个 JSX 错误，但 Babel/React 应该会解决这个问题。 Kuan 你能发布你的 package.json 吗？
@AndrewAxton 谢谢，您能否详细说明问题出在哪里以及如何解决？

标签： reactjs browserify babeljs

【解决方案1】：

您似乎没有运行教程中给出的命令。运行browserify 的正确命令应该是这样的：

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

【讨论】：

非常感谢，我认为这是理所当然的！
不客气！在您运行的命令中，--presets 正在由 browserify 而不是 babelify 转换处理，因此没有任何反应。在这个命令中，我们将预设传递给转换，它可以工作。
感谢您提供如此明确有用的解释，现在我明白了。