Rails JSX 文件不工作答案

【问题标题】：Rails JSX file not workingRails JSX 文件不工作
【发布时间】：2015-10-28 11:52:43
【问题描述】：

我是 ruby-on-rails 的新手，谁能告诉我应该将 JSX 文件放在哪里，以便将内容呈现到 DOM 中？

我有 2 个单独的视图，一个用于“家庭”，另一个用于“详细信息”。在 rails 的“views”目录中，不同的视图有一个单独的文件夹，但它们都位于同一个 javascript 目录中。

如果我调用文件 home.js.jsx 和 details.js.jsx...rails 不会做任何反应。

如果我称它们为 home-templates.js.jsx 和 details-templates.js.jsx，rails 只会渲染 jsx 以获得详细信息。

然后我将我的代码放在“html.html.erb”底部的<script type='text/jsx'> 标记内，但仍然无法正常工作。

我哪里错了？

【问题讨论】：

如果您运行react-rails, (rails g react:install) 提供的安装脚本，您会注意到它会在 assets/javascripts 下为您的 react 组件创建一个组件文件夹。这是出于组织目的，但资产/javascripts 中的任何地方都应该没问题。

【解决方案1】：

JSX 文件不能被浏览器本地解释。您必须先将它们编译为纯 JavaScript。

一种流行的选择是将Grunt 与Babel 一起使用。还有React-Rails gem，它可以更好地集成到 Rails 资产管道中

【讨论】：