Javascript 使用更具体的模块导入有什么好处/区别？_Javascript_Angular_Webpack_Angular Cli_Angular Cli V6

Javascript 使用更具体的模块导入有什么好处/区别？

javascript angular webpack

Javascript 使用更具体的模块导入有什么好处/区别？,javascript,angular,webpack,angular-cli,angular-cli-v6,Javascript,Angular,Webpack,Angular Cli,Angular Cli V6,例如，假设我有一个Angular 6应用程序，想要从@Angular/material包导入MatIconModule 我可以做到： import { MatIconModule } from '@angular/material/icon'; 或这对最终的应用程序包或构建过程有任何影响吗该问题并非专门针对@angular/material包，而是关于从任何包中导入模块的一般问题，该包允许对其模块进行此类特定和非特定导入我觉得以前一定有人问过这个问题，但我找不到类似的问题我觉得这个问题

例如，假设我有一个Angular 6应用程序，想要从

@Angular/material

包导入

MatIconModule

我可以做到：

import { MatIconModule } from '@angular/material/icon';

或

这对最终的应用程序包或构建过程有任何影响吗

该问题并非专门针对

@angular/material

包，而是关于从任何包中导入模块的一般问题，该包允许对其模块进行此类特定和非特定导入

我觉得以前一定有人问过这个问题，但我找不到类似的问题

我觉得这个问题并不像一些用户所建议的那样完全是基于意见的。请查看我发布的答案。

这显然是基于您的编码结构，但我建议您使用

从“rxjs”导入{observatable，observator}

铭记

从“rxjs/Observable”导入{Observable}；从'rxjs/Observer'导入{Observer}

我想代码看起来更离散，开发人员也更友好

当这样的代码发生时，场景变得更加清晰

导入{filter，map，catchError，publishReplay，refCount，take}from “rxjs/运营商”

当这种情况发生时会更容易

注意：导入所有操作符会显著扩大构建输出并增加构建持续时间。因此，最好只导入正在使用的运算符。此外，由于RxJS模块的polyfill-ish特性，每个代码库导入一个操作符（或静态可观察方法）就足够了。这些导入应该在一个集中的位置进行。

这显然是基于您的编码结构，但我建议您使用

从“rxjs”导入{observatable，observator}

铭记

从“rxjs/Observable”导入{Observable}；从'rxjs/Observer'导入{Observer}

我想代码看起来更离散，开发人员也更友好

当这样的代码发生时，场景变得更加清晰

导入{filter，map，catchError，publishReplay，refCount，take}from “rxjs/运营商”

当这种情况发生时会更容易

所以我做了一些测试

TLDR:Dev捆绑包可能更大，但生产捆绑包似乎不受影响。（尽管我的测试非常有限）。

在我的测试中，我使用了：

Node:                  10.3.0
Angular CLI:            6.0.8
Angular:                6.1.8
@angular/material:      6.4.7
webpack:                4.8.3

我使用

ng new

创建了一个新的应用程序，并将材质图标模块导入

app.module.ts

2种不同的方式，然后分别运行

ng build

import { MatIconModule } from '@angular/material/icon';

及

生成的

vendor.js

分别为

3.9MB

和

6.3MB

查看生成的代码，您可以看到一个只导入了图标模块，而另一个导入了整个材料组件库，即使导入只指定了

MatIconModule

类

运行

ng build--prod

会产生相同的捆绑包。所以（至少在这个有限的例子中）对于生产构建似乎没有什么区别。我猜摇树在这里是有作用的。然而，可能对于不同的包，情况可能并非如此

在我看来，为了安全起见，最好尽可能更加具体。

下面是这个答案可能提出的一些附加问题。更好的答案可以解决这些问题：

在生产构建中，是否有这样的例子

以这种方式构造的包是否可能在生产构建中无法正确修剪？