使用原始文件部署 Angular-App答案

【问题标题】：Deploy Angular-App with original files使用原始文件部署 Angular-App
【发布时间】：2018-02-20 18:45:23
【问题描述】：

我有一个使用 Angular-CLI 构建的 Angular 应用程序。我想将此项目部署到 Spring-Microservice。当我部署使用 cli-command ng build --prod 生成的构建时，应用程序工作正常。

但是：我想将包括我的打字稿文件在内的原始文件部署到微服务，这样我就可以看到我的控制台日志来自哪里（哪个文件中的哪一行，就像我在本地使用“ng”运行应用程序时一样服务”）。

几个月前，我有一个 Angular 项目，我从 Angular Quickstart 开始。我用 NPM 运行了这个项目（命令：npm install 和 npm start）。该项目将 typescript 文件转换为 javascript，因此，该项目是可部署的并且运行良好。

但是我的 CLI 项目不这样做，所以它是不可部署的。

如何按照描述部署我的应用程序？

【问题讨论】：

【解决方案1】：

当您使用 Angular CLI 创建的生产标志和缩小的 Javascript 文件的源映射（您可以从它们的扩展名 .map.js 中识别它们）构建一个 Angular 项目时。

最简单的方法是部署所有生成的文件。当您打开浏览器的开发人员工具进行调试时，浏览器会识别它们，并生成未压缩的 Javascript 文件。您可以在来源面板上找到它们。（例如 Chrome）

所以你不需要原来的 Typescript 文件

我不确定，如果您在记录某些内容时可以在控制台上看到原始代码所在的确切文件和行，来自缩小的 Javascript 文件。

【讨论】：

【解决方案2】：

在本次演示中，我使用 CLI 生成了一个 Angular 项目，使用 Spring Boot 生成了一个 REST 服务器，并展示了如何在 Spring 服务器https://youtu.be/k8r76d8QzXs?t=870 下部署这个 Angular 应用程序。

为了能够使用 prod 包调试您的 Typescript 代码，请使用添加 --sourcemaps 选项：

ng build -prod --sourcemaps true

【讨论】：