angularjs - 如何结合 Play Framework 和angular2？

Question

我的问题是关于在项目中如何将前台和后台组织在一起。 据我所知，有两种方法可以做到这一点

1. 使用 web-jars 依赖项和 sbt 插件将前端和后端分组到一个项目中。所以 sbt 将运行所有必要的操作，如 uglify、concat、compilation(typescript 到 javascript)...
2. 前后端分离，分别部署。在这种情况下，后端必须添加 header Access-Control-Allow-Origin。这样前台和后台就可以部署在2个不同的主机上。要使用的工具将是 npm 和 gulp/grunt
3. 1 和 2 的混合。前端和后端仍然使用相同的存储库，但前端是由 npm、bower 和 gulp/grunt 等外部工具构建和生成的

目前，选项 2 和选项 3 的文档不多。而且 typescript 插件还没有准备好。

scala play + angular2开发哪种方式更好？

Answer 1

我最近一直在使用几个 Angular 和 Angular 2 应用程序并处理类似的问题。对于所有场景，我们的后端和前端应用程序在代码方面都是分开的，并且仅通过 REST 接口(interface)进行通信。尽管如此，我们同时提供了前端和后端部分，并且为两者使用一个托管服务器(可以是 Play Framework 或 Tomcat)感觉很自然。

选项#1 一开始，我们选择了这个。 Webjars 看起来像一个奇迹，一些 sbt 或 maven 插件可以帮助您完成前端项目的缩小、编译、linting 等。 这对某些人来说可能很顺利。不幸的是，我发现这个工作流程不自然。某些插件丢失或配置困难。 Webjars 并不总是最新的，其中一些是自动可用的，有些不是......等等。在一个简单的项目中它可能有效，但对我来说，这还不够。

选项#2 我们尝试过单独的服务器进行开发，但我们很快就放弃了。对于大多数操作，您仍然需要同时使用前端和后端服务器。所以你必须同时开始。这意味着您有 2 倍多的命令或工作流程可以记住并教给其他人。 CORS 不是大问题，但您可能会考虑在生产环境中禁用它，这意味着项目需要额外的工作。通过这种方式单独开发后端或前端会更快，但在我看来，如果您要同时提供两者 - 您的开发过程应该可以帮助您。

选项 #3 那就是我们正在使用的那个。使用 sbt 是可能且方便的。 SbtWeb 插件允许您将 playRunHooks 设置为您希望在项目中运行的任何操作。这个想法是运行一个 JavaScript 构建工具，它将完成所有必要的前端工作，fe:

playRunHooks += {
  Process(Seq("npm", "install"), file(portal)).lines.foreach(println)
  RunSubProcess(portal, "npm", "run", "watch")
}

RunSubProcess可以查到here .

长话短说，您让 Play Server 为您的静态内容提供服务，但忽略它的变化。这由 npm、gulp、webpack、grunt 处理 - 无论您选择什么。有很多 JavaScript 构建工具、插件和模板可以帮助您。您不需要任何 sbt 插件，只需让 JavaScript 世界完成它的工作。一开始可能很难设置，但很快就会收到返回。

作为示例项目，您可能需要查看 Activator 模板 Play Framework with Angular 2 and Webpack 2它的项目托管在 GitHub 上:play-ng2-webpack2 .它帮了我一些忙。

现在也可以使用 Tomcat，使用 xsbt-web-plugin和开发模式。哲学是相似的。

希望你找到自己的方式:)。