Question

我正在一个网站上，该网站在生产中将与后端进行通信。开发人员在开发过程中使用虚拟数据来测试网站，但是即使在构建产品之后，该虚拟数据也会被发送到客户端。我希望不将这些虚拟数据包含在最终生产版本中以减小捆绑包的大小。

我考虑过使用angular编译器的文件替换功能可以用生产版本替换开发文件。我想避免这样做，因为此功能对于在编译时替换实现而无需硬代码进行替换可能非常有用。想象一下，如果我有三个或四个不同的后端选项可供选择，并想根据环境服务中的设置动态选择。编译后，我只希望有一个选择。

@Injectable({
  providedIn: 'root',
  useFactory: () => {
    const environment = inject(EnvironmentService);
    if (environment.dev) {
      return new DummyDataService();
    }
    return new HttpDataService(inject(HttpClient));
  }
})
export abstract class DataService() {
  public abstract getData(): Observable<string[]>;
}

export class HttpDataService implements DataService {

  constructor(private http: HttpClient) { }

  public getData(): Observable<string[]> {
    return this.http.get<string[]>('/url');
  }
}

export class DummyDataService implements DataService {

  public getData(): Observable<string[]> {
    return of([
      'angular',
      'babel',
      'webpack',
      'gulp'
    ]);
  }
}

当我使用'ng serve --prod'并将我的环境配置为在生产环境中运行时。我希望DummyDataService不会包含在捆绑软件中，但是当我检查发送到浏览器的内容时，DummyDataService会包含在捆绑软件中（名称由编译器压缩，但字符串仍然存在）。

Answer 1

为什么不将虚拟数据保留在前端，为什么不直接托管连接到测试数据库的后端的另一个实例。这样，您可以准确地使用Angular环境变量吗？

对于每个构建，我都有一个不同的环境文件，该文件在编译时被换出并注入到app模块中，以提供不同的端点信息

编辑：编写单元测试以检查功能的有效性

如何不为Angular的生产编译开发人员依赖关系？

1 个答案: