javascript - Angular 4 ng serve --prod 与 ng serve

Question

很快，我在 ng serve 上有一个 4.6MB 的应用。

当我这样做时:

ng serve --prod

我得到 1MB 的文件大小。

但是，--prod 以某种方式使我的整个应用程序中断。

我向服务器发送请求的整个服务(基于 promise )不再工作。

奇怪的是 ng serve 工作得很好 AND ng serve --prod 的某些部分也工作得很好，因为只要没有服务器请求。

我没有发布任何代码，因为 ng serve 版本工作正常。

主要问题是:

为什么我会有这种行为？

此外，在某些时候，基于 ng serve --prod 的应用程序突然突然完全正常运行，然后在我重新启动应用程序后，再次出现故障应用程序。

编辑: 更多明确的细节:

我正在使用 Fiddler 来确保所有细节都是正确的:

如你所见，细节还可以。

现在是负责在客户端模拟该请求的代码:

    login(uName: string, pw: string, type: number): Promise<any> {
    return new Promise(resolve => {
        if (type === 1) {
            const options = new RequestOptions({ headers: this.headers });
            const body = JSON.stringify({ username: uName, password: pw });
            this.http.post(this.loginUrl, body, options)
                .toPromise()
                .then(response => {
                    resolve(response);
                })
                .catch(this.handleError);
        } else if (type === 2 || type === 3) {
            this.http.post(this.loginUrl, { username: uName, token: pw })
                .toPromise()
                .then(response => {
                    resolve(response);
                })
                .catch(this.handleError);
        }
    });
}

现在请注意，当我仅使用 ng serve(网络选项卡)时，一切如何完美运行:

如您所见，我已经登录并且确实收到了回复。

现在，

我做的那一刻

ng serve --prod

突然，具有相同详细信息的相同登录请求不再有效:

这是 super 比萨。

我所有负责服务器请求的方法都是一样的。

“Bad Request” 带有一些来自服务器本身的错误代码(我自己的服务器代码，如“email not filled”，这也是 bizzar，因为我确实发送了正确的参数)

Answer 1

当您执行 ng serve --prod 时，angular cli 使用 tree shaking 和 AOT(Ahead Of Time)编译进行生产构建，与正常构建相比生成更少的代码。您还可以在本地运行它在生产模式下的样子

意味着它会摇动所有组件并添加代码中实际使用过的组件，而不是全部。这就是为什么当您执行 ng serve --prod

时您会看到 vendor.js 非常小的原因

缺点是它的编译和缩小代码不易调试

您可以在 cli 文档中详细阅读哪个构建在做什么。