0

react-railsプロジェクトで宝石を使用しています。

オプションをヘルパー メソッドprerender: trueのオプション ハッシュに渡すたびに、次のエラーが発生します。オプションハッシュから削除すると、私のコンポーネントは正常に動作します。react_componentV8::Error - Unexpected token <prerender: true

Gemfile:

gem 'rails', '4.1.1'
gem 'execjs'
gem 'therubyracer', platforms: :ruby
gem 'react-rails', github: 'reactjs/react-rails'

景色：

= react_component("AssignmentWindowProgressBar", { assignment: @assignment_json }, { prerender: true })

コーヒーファイル:

###* @jsx React.DOM ###

@AssignmentWindowProgressBar = React.createClass
  render: ->
    `<div>Hi world.</div>`

# this is located in this file:
# ./apps/assets/javascripts/components/assignments/AssignmentWindows.js.jsx.coffee

スタックトレース：

V8::Error - Unexpected token < at <eval>:19037:15:
  therubyracer (0.12.1) lib/v8/error.rb:86:in `block in try'
  therubyracer (0.12.1) lib/v8/error.rb:83:in `try'
  therubyracer (0.12.1) lib/v8/context.rb:95:in `block in eval'
  therubyracer (0.12.1) lib/v8/context.rb:248:in `block (2 levels) in lock_scope_and_enter'
  therubyracer (0.12.1) lib/v8/context.rb:245:in `block in lock_scope_and_enter'
  therubyracer (0.12.1) lib/v8/context.rb:244:in `lock_scope_and_enter'
  therubyracer (0.12.1) lib/v8/context.rb:204:in `enter'
  therubyracer (0.12.1) lib/v8/context.rb:94:in `eval'
  execjs (2.2.0) lib/execjs/ruby_racer_runtime.rb:11:in `block in initialize'
  execjs (2.2.0) lib/execjs/ruby_racer_runtime.rb:78:in `block in lock'
  execjs (2.2.0) lib/execjs/ruby_racer_runtime.rb:76:in `lock'
  execjs (2.2.0) lib/execjs/ruby_racer_runtime.rb:9:in `initialize'
  execjs (2.2.0) lib/execjs/runtime.rb:44:in `compile'
  execjs (2.2.0) lib/execjs/module.rb:27:in `compile'
  ... end of execjs errors ...

助けてくれてありがとう！

4

1 に答える 1

0

https://github.com/reactjs/react-rails#jsxから回答をコピー

JSX を JS に変換するには、.js.jsx ファイルを作成するだけです。これらのファイルは、リクエストに応じて変換されるか、assets:precompile タスクの一部としてプリコンパイルされます。

.js.jsx.coffee ファイルを作成することで、CoffeeScript ファイルも使用できます。また、CoffeeScript が理解できない構文を無視するように、JSX をバッククォート内に埋め込む必要があります。次に例を示します。

Component = React.createClass
  render: ->
    `<ExampleComponent videos={this.props.videos} />`

ファイル拡張子に注意してください。

于 2014-12-21T18:49:14.080 に答える