在 Play 框架中导入 React 组件答案

【问题标题】：Importing React component in Play framework在 Play 框架中导入 React 组件
【发布时间】：2017-05-30 10:47:05
【问题描述】：

我正在尝试使用 React 在 Play 框架中呈现 UI。我在多个文件中有我的反应组件，并试图将组件从一个文件导入到另一个文件，但我总是在编译时收到以下错误 “非法进口申报”和非法出口申报

Component1.jsx

 import {Component2} from './Component2'
 class Component1 extends React.Component{
    render(){
       <div><h1>Hello</h1>
         <Component2 />
         </div>
    }
 }

ReactDOM.render(<Component1 />, document.getElementById('headerLine'))

Component2.jsx

export class Component2 extends React.Component{
   render(){
   <div><h1>World</h1></div>
   }
}

正在使用的播放框架版本是2.4.2。
反应版本 0.14.3。这里可能存在什么问题？我需要使用 webpack 或 browserify 之类的打包工具吗？如果是，我该如何使用 play 框架？

【问题讨论】：

关于上面的代码，不确定是不是这个原因，但是渲染方法应该这样定义：render() { .... }。我认为 render(
...
) 是一个无效的语法（在这里查看第一个示例facebook.github.io/react/docs/react-component.html）。另一件事是渲染方法必须返回一个元素，而不是像第一个渲染方法那样返回 2。所以，Component2 应该在
元素中。
我也遇到了同样的问题，但是看到你解决了，我想你是用 sbt-webpack 还是写自己的模块？
我参考了以下链接：[link](github.com/nouhoum/play-react-webpack) 让它工作。它不使用 sbt-webpack，而是使用 Play hook，如下面的答案所述
嗨，我尝试了链接，当我运行 sbt run 时，我得到 java.io.IOException: 无法运行程序“webpack”（在目录“/Volumes/Data/play-react-webpack”中）： error=2, java.lang.ProcessBuilder.start(ProcessBuilder.java:1048) 处没有这样的文件或目录原因：java.io.IOException: error=2, java.lang.UNIXProcess.forkAndExec 处没有这样的文件或目录（本机方法）在 java.lang.UNIXProcess.(UNIXProcess.java:247) 在 java.lang.ProcessImpl.start(ProcessImpl.java:134) 在 java.lang.ProcessBuilder.start(ProcessBuilder.java:1029 )