如何在本地 tomcat 服务器上部署 angular2 应用程序？

Question

我一直在用 lite 服务器开发一个 angular2 应用程序。现在我想在 tomcat 服务器上部署这个应用程序以连接 java 后端。我一直在使用角度 cli。我已经使用命令“ng build -prod”来生成 dist 文件夹。根据 udemy 关于 angular2 的教程，这个文件夹的内容就是部署 angular2 项目所需的全部内容。我把这个文件夹的内容放在java项目的WebContent文件夹中，然后点击eclipse IDE中的绿色按钮开始提供文件。在其他项目中我可以通过这种方式成功部署 html 和 javscript 文件。但是对于这个 angular2 项目，“正在加载...”出现并且应用程序永远不会启动。控制台显示这些错误。

获取 http://localhost:8080/vendor/es6-shim/es6-shim.js [HTTP/1.1 404 Not Found 3ms] 得到 http://localhost:8080/vendor/reflect-metadata/Reflect.js [HTTP/1.1 404 Not Found 4ms] 得到 http://localhost:8080/vendor/systemjs/dist/system.src.js [HTTP/1.1 404 Not Found 4ms] 得到 http://localhost:8080/vendor/zone.js/dist/zone.js [HTTP/1.1 404 Not Found 4ms] 得到 http://localhost:8080/vendor/reflect-metadata/Reflect.js [HTTP/1.1 404 Not Found 1ms] 得到 http://localhost:8080/vendor/systemjs/dist/system.src.js [HTTP/1.1 404 Not Found 2ms] 得到 http://localhost:8080/vendor/zone.js/dist/zone.js [HTTP/1.1 404 Not Found 2ms] ReferenceError: 系统未定义

这些错误对我来说似乎很奇怪，因为我在这些位置看到文件。

当我在 angular2 cli 项目文件夹中运行 ng serve 时，应用程序运行良好。

如何在不运行轻型服务器的情况下将 dist 文件夹部署在 tomcat 服务器中，或者是否可能需要同时运行轻型服务器？最好的方法是什么？

Answer 1

使用 ng build --environment=prod 生成 dist 文件夹并将 dist 文件夹内容复制到 tomcat /opt/tomcat/webapps/ROOT/ 文件夹中。

当我们在浏览器中点击http://localhost:8080/ 时，会自动加载 index.html 文件。

谢谢

Answer 2

我正在运行一个小脚本来构建项目，然后将其复制到 tomcat。我告诉 Angular 它将在 tomcat 中运行的基本目录是什么。

#!/bin/sh
ng build --base-href /angular/ --prod
mkdir -p /home/xxx/apache-tomcat-8.0.37/webapps/angular
cp -R /home/xxx/angular-clitest/dist/* /home/xxx/apache-tomcat-8.0.37/webapps/angular/

运行后，启动 tomcat，您可以通过以下方式访问它：http://localhost:8080/angular