在Play框架中导入React组件

Question

我正在尝试使用React在Play框架中呈现UI。我在多个文件中有我的react组件，我正在尝试将组件从一个文件导入到另一个文件但是我总是在编译时遇到以下错误 ＆＃34; 非法进口声明＆＃34; 和非法出口声明

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框架？

Answer 1

是的，您需要捆绑您的javascript，而浏览器不会添加对ES6 modules

的支持

要在Play框架中执行此操作，您有两个选项，一个是使用sbt-web，这是处理游戏框架中资产的标准方法（我非常不喜欢）或者您可以简单像往常一样使用webpack，并在构建中添加 hook 来捆绑您的应用程序。以下是关于如何在启动服务器之前调用另一个进程的documentation。