将 ReactJS 与 npm 一起使用并给出以下错误(意外标记)
Using ReactJS with npm and its giving following error(Unexpected token)
任何信息都会很有帮助,最初我 运行 npm install babel-loader 命令也是如此。
我有
ERROR in ./app-client.js Module build failed: SyntaxError:
/Users/dawatramani/ReactNodejs/app-client.js:
意外令牌 (4:13)
2 | var APP= require('./components/APP');
3 |
> 4 | React.render(<APP />,document.getElementById('react-container'));
| ^
5 |
at Parser.pp.raise
(/Users/dawatramani/ReactNodejs/node_modules/babel-core/node_modules/babylon/lib/parser/location.js:22:13)
at Parser.pp.unexpected (/Users/dawatramani/ReactNodejs/node_modules/babel-core/node_modules/babylon/lib/parser/util.js:89:8)
at Parser.pp.parseExprAtom (/Users/dawatramani/ReactNodejs/node_modules/babel-core/node_modules/babylon/lib/parser/expression.js:522:12)
at Parser.pp.parseExprSubscripts (/Users/dawatramani/ReactNodejs/node_modules/babel-core/node_modules/babylon/lib/parser/expression.js:277:19)
at Parser.pp.parseMaybeUnary (/Users/dawatramani/ReactNodejs/node_modules/babel-core/node_modules/babylon/lib/parser/expression.js:257:19)
at Parser.pp.parseExprOps (/Users/dawatramani/ReactNodejs/node_modules/babel-core/node_modules/babylon/lib/parser/expression.js:188:19)
at Parser.pp.parseMaybeConditional (/Users/dawatramani/ReactNodejs/node_modules/babel-core/node_modules/babylon/lib/parser/expression.js:165:19)
at Parser.pp.parseMaybeAssign (/Users/dawatramani/ReactNodejs/node_modules/babel-core/node_modules/babylon/lib/parser/expression.js:128:19)
at Parser.pp.parseExprListItem (/Users/dawatramani/ReactNodejs/node_modules/babel-core/node_modules/babylon/lib/parser/expression.js:1046:16)
at Parser.pp.parseCallExpressionArguments (/Users/dawatramani/ReactNodejs/node_modules/babel-core/node_modules/babylon/lib/parser/expression.js:353:20)
at Parser.pp.parseSubscripts (/Users/dawatramani/ReactNodejs/node_modules/babel-core/node_modules/babylon/lib/parser/expression.js:316:31)
at Parser.pp.parseExprSubscripts (/Users/dawatramani/ReactNodejs/node_modules/babel-core/node_modules/babylon/lib/parser/expression.js:287:15)
at Parser.pp.parseMaybeUnary (/Users/dawatramani/ReactNodejs/node_modules/babel-core/node_modules/babylon/lib/parser/expression.js:257:19)
at Parser.pp.parseExprOps (/Users/dawatramani/ReactNodejs/node_modules/babel-core/node_modules/babylon/lib/parser/expression.js:188:19)
at Parser.pp.parseMaybeConditional (/Users/dawatramani/ReactNodejs/node_modules/babel-core/node_modules/babylon/lib/parser/expression.js:165:19)
at Parser.pp.parseMaybeAssign (/Users/dawatramani/ReactNodejs/node_modules/babel-core/node_modules/babylon/lib/parser/expression.js:128:19)
at Parser.pp.parseExpression (/Users/dawatramani/ReactNodejs/node_modules/babel-core/node_modules/babylon/lib/parser/expression.js:92:19)
at Parser.pp.parseStatement (/Users/dawatramani/ReactNodejs/node_modules/babel-core/node_modules/babylon/lib/parser/statement.js:163:19)
at Parser.pp.parseBlockBody (/Users/dawatramani/ReactNodejs/node_modules/babel-core/node_modules/babylon/lib/parser/statement.js:529:21)
at Parser.pp.parseTopLevel (/Users/dawatramani/ReactNodejs/node_modules/babel-core/node_modules/babylon/lib/parser/statement.js:36:8)
at Parser.parse (/Users/dawatramani/ReactNodejs/node_modules/babel-core/node_modules/babylon/lib/parser/index.js:129:19)
at parse (/Users/dawatramani/ReactNodejs/node_modules/babel-core/node_modules/babylon/lib/index.js:47:47)
at File.parse (/Users/dawatramani/ReactNodejs/node_modules/babel-core/lib/transformation/file/index.js:517:34)
at File.parseCode (/Users/dawatramani/ReactNodejs/node_modules/babel-core/lib/transformation/file/index.js:603:20)
at /Users/dawatramani/ReactNodejs/node_modules/babel-core/lib/transformation/pipeline.js:49:12
at File.wrap (/Users/dawatramani/ReactNodejs/node_modules/babel-core/lib/transformation/file/index.js:563:16)
at Pipeline.transform (/Users/dawatramani/ReactNodejs/node_modules/babel-core/lib/transformation/pipeline.js:47:17)
at transpile (/Users/dawatramani/ReactNodejs/node_modules/babel-loader/index.js:14:22)
at Object.module.exports (/Users/dawatramani/ReactNodejs/node_modules/babel-loader/index.js:88:12)
你好像忘了在 render 方法中粘贴一个 Component :)
React.render(,document.getElementById('react-container'));
那么对于 reactJS
的当前版本,您不应该使用 React.render()
,而应该使用 ReactDOM.render()
和 import ReactDOM from "react-dom"
。我想这会解决你的问题。
ReactDOM.render(<ComponentName />,document.getElementById('react-container'));
这是 0.14 引入的最新变化。 React 现在分为核心库和 DOM 适配器。渲染现在通过 ReactDOM.render.
完成
任何信息都会很有帮助,最初我 运行 npm install babel-loader 命令也是如此。
我有
ERROR in ./app-client.js Module build failed: SyntaxError: /Users/dawatramani/ReactNodejs/app-client.js:
意外令牌 (4:13)
2 | var APP= require('./components/APP');
3 |
> 4 | React.render(<APP />,document.getElementById('react-container'));
| ^
5 |
at Parser.pp.raise (/Users/dawatramani/ReactNodejs/node_modules/babel-core/node_modules/babylon/lib/parser/location.js:22:13) at Parser.pp.unexpected (/Users/dawatramani/ReactNodejs/node_modules/babel-core/node_modules/babylon/lib/parser/util.js:89:8) at Parser.pp.parseExprAtom (/Users/dawatramani/ReactNodejs/node_modules/babel-core/node_modules/babylon/lib/parser/expression.js:522:12) at Parser.pp.parseExprSubscripts (/Users/dawatramani/ReactNodejs/node_modules/babel-core/node_modules/babylon/lib/parser/expression.js:277:19) at Parser.pp.parseMaybeUnary (/Users/dawatramani/ReactNodejs/node_modules/babel-core/node_modules/babylon/lib/parser/expression.js:257:19) at Parser.pp.parseExprOps (/Users/dawatramani/ReactNodejs/node_modules/babel-core/node_modules/babylon/lib/parser/expression.js:188:19) at Parser.pp.parseMaybeConditional (/Users/dawatramani/ReactNodejs/node_modules/babel-core/node_modules/babylon/lib/parser/expression.js:165:19) at Parser.pp.parseMaybeAssign (/Users/dawatramani/ReactNodejs/node_modules/babel-core/node_modules/babylon/lib/parser/expression.js:128:19) at Parser.pp.parseExprListItem (/Users/dawatramani/ReactNodejs/node_modules/babel-core/node_modules/babylon/lib/parser/expression.js:1046:16) at Parser.pp.parseCallExpressionArguments (/Users/dawatramani/ReactNodejs/node_modules/babel-core/node_modules/babylon/lib/parser/expression.js:353:20) at Parser.pp.parseSubscripts (/Users/dawatramani/ReactNodejs/node_modules/babel-core/node_modules/babylon/lib/parser/expression.js:316:31) at Parser.pp.parseExprSubscripts (/Users/dawatramani/ReactNodejs/node_modules/babel-core/node_modules/babylon/lib/parser/expression.js:287:15) at Parser.pp.parseMaybeUnary (/Users/dawatramani/ReactNodejs/node_modules/babel-core/node_modules/babylon/lib/parser/expression.js:257:19) at Parser.pp.parseExprOps (/Users/dawatramani/ReactNodejs/node_modules/babel-core/node_modules/babylon/lib/parser/expression.js:188:19) at Parser.pp.parseMaybeConditional (/Users/dawatramani/ReactNodejs/node_modules/babel-core/node_modules/babylon/lib/parser/expression.js:165:19) at Parser.pp.parseMaybeAssign (/Users/dawatramani/ReactNodejs/node_modules/babel-core/node_modules/babylon/lib/parser/expression.js:128:19) at Parser.pp.parseExpression (/Users/dawatramani/ReactNodejs/node_modules/babel-core/node_modules/babylon/lib/parser/expression.js:92:19) at Parser.pp.parseStatement (/Users/dawatramani/ReactNodejs/node_modules/babel-core/node_modules/babylon/lib/parser/statement.js:163:19) at Parser.pp.parseBlockBody (/Users/dawatramani/ReactNodejs/node_modules/babel-core/node_modules/babylon/lib/parser/statement.js:529:21) at Parser.pp.parseTopLevel (/Users/dawatramani/ReactNodejs/node_modules/babel-core/node_modules/babylon/lib/parser/statement.js:36:8) at Parser.parse (/Users/dawatramani/ReactNodejs/node_modules/babel-core/node_modules/babylon/lib/parser/index.js:129:19) at parse (/Users/dawatramani/ReactNodejs/node_modules/babel-core/node_modules/babylon/lib/index.js:47:47) at File.parse (/Users/dawatramani/ReactNodejs/node_modules/babel-core/lib/transformation/file/index.js:517:34) at File.parseCode (/Users/dawatramani/ReactNodejs/node_modules/babel-core/lib/transformation/file/index.js:603:20) at /Users/dawatramani/ReactNodejs/node_modules/babel-core/lib/transformation/pipeline.js:49:12 at File.wrap (/Users/dawatramani/ReactNodejs/node_modules/babel-core/lib/transformation/file/index.js:563:16) at Pipeline.transform (/Users/dawatramani/ReactNodejs/node_modules/babel-core/lib/transformation/pipeline.js:47:17) at transpile (/Users/dawatramani/ReactNodejs/node_modules/babel-loader/index.js:14:22) at Object.module.exports (/Users/dawatramani/ReactNodejs/node_modules/babel-loader/index.js:88:12)
你好像忘了在 render 方法中粘贴一个 Component :)
React.render(,document.getElementById('react-container'));
那么对于 reactJS
的当前版本,您不应该使用 React.render()
,而应该使用 ReactDOM.render()
和 import ReactDOM from "react-dom"
。我想这会解决你的问题。
ReactDOM.render(<ComponentName />,document.getElementById('react-container'));
这是 0.14 引入的最新变化。 React 现在分为核心库和 DOM 适配器。渲染现在通过 ReactDOM.render.
完成