什么是 tslint 黑名单，为什么 angular-cli 默认 rxjs 在 tslint.json 列表中？

Question

默认情况下，在 angular-cli 项目中，tslint 设置包含一些乱七八糟的东西。最近一位新开发人员找到我，我在 Atom 中配置了他们的 tslint 实例。

我被问及以下行：

import { Observable, BehaviorSubject } from 'rxjs';

TSLinter 说 rxjs 被列入黑名单。我去了 tslint.json 文件，果然，它被列出了。

这个黑名单是什么？它能保护应用免受某些东西的侵害吗？

为什么默认添加了rxjs？

在什么情况下我应该添加其他东西？

我想指出，我知道如何 'fix' 这个问题 ::

import { Observable } from 'rxjs/observable';
import { BehaviorSubject } from 'rxjs/BehaviorSubject';

问题还是在于黑名单在TSLint上下文中的含义

Answer 1

这是因为您（至少在浏览器应用程序中）永远不应包含 'rxjs' 并且始终使用更具体的内容，例如 'rxjs/Observable' 或 'rxjs/BehaviorSubject'.

当您包含 'rxjs' 时，您实际上是在包含此文件：https://github.com/ReactiveX/rxjs/blob/master/index.js，其中包含整个捆绑的 RxJS 库（所有运算符、调度程序等）。所以你包含了很多你甚至不使用的东西，你的应用程序变得比必要的更大（我认为用 webpack2 摇树没有帮助，一旦包含代码，它将成为最终包的一部分，但我可能错了）。

我认为直接从 'rxjs' 导入到 node 应用程序（例如后端应用程序）中是可以的，因为它还包含您不会使用的代码并不重要使用这种方式更容易使用。

Answer 2

这个link解释的更清楚一点：

https://fullstack-developer.academy/resolving-import-is-blacklisted-tslint-error-for-rxjs-and-angular/

本质上，当你导入 like

import { Observable, BehaviorSubject } from 'rxjs';

或

import { Observable, BehaviorSubject } from 'rxjs/Rx';

它引入了 Rx.js，它将导入 rxjs 库中的所有内容（Observable、BehaviorSubject、ReplaySubject、Subscriber、Subscription 等...），这比您实际需要的要多得多。除非你真的需要在你导入的文件中使用其中的大部分，否则你最好将每个依赖项单独导入一行，如

import { Observable } from 'rxjs/Observable';
import { Subscription} from 'rxjs/Subscription';

这会导致引入更少的依赖项，并希望编译后的文件大小更小。

Answer 3

原因是 tslint.json 的变化，因为他们不想要 rxjs 的整个模块加载到 Angular 应用程序，因为它使依赖加载更重。而是只加载您的应用程序必需的子模块。

要解决它，改变

import { Observable, BehaviorSubject } from 'rxjs';

至：

import { Observable } from 'rxjs/Observable';
import 'rxjs/add/operator/map';
import 'rxjs/add/operator/catch';

什么是 tslint 黑名单，为什么 angular-cli 默认 rxjs 在 tslint.json 列表中？

What is the tslint blacklist and why does angular-cli default rxjs on the list in tslint.json?

rxjs

tslint

angular-cli