Javascript 导入React，{Component}而不仅仅是React有什么好处？

写作的主要好处是什么

import React, { Component } from 'react';
class Link extends Component {
   ...
}

而不是

import React from 'react';
class Link extends React.Component {
   ...
}

当涉及到15.4.x的反应时

在我的观点中和在我的情况下（如果我错了请纠正我），这一点都不重要，因为：

我正在使用

webpack2

制作捆绑包

我使用代码拆分将我的应用程序代码与供应商代码拆分

我使用

webpack.optimize.commonchunkplugin

plugin和

minChunks:Infinity

设置来确保所有供应商代码只包含一次

通过了解ES6导入的工作原理，我了解到通过使用

{Component}

的命名导入，我声明我只想在代码中使用

组件

组件，它看起来。。清洁工 但由于整个

React

包仍在应用程序中使用，我可以使用

React.Component

的扩展创建类，而不仅仅是

Component

，结果webpack仍将生成相同数量的代码，我的包大小在这两种情况下都相同

---

我说的对吗？

没有区别，

React。Component

与

Component

是同一个对象，第二种方法在我看来更有说服力，因为它确实说明了您使用的是

React

库中的

Component

对象

第一个似乎是指一个成员， 但是，它来自javascript的

前模块时代

，在那里，所有内容都必须附加到导出的全局名称空间（只是为了避免全局名称空间污染）

---

可能在引擎盖下面的东西：

//这只能作为一个示例。
类反应{…}
类组件{…}
反应。成分=成分；
//ES6
导出{Component}
出口违约反应；
//ES5
window.React=反应；

注意：正如有人所说，您还需要导入

React

，因为

JSX

需要将它放在作用域中，但是，如果您想避免它，您可以全局公开

React

（

window.React=React

）

此导入语句：

import React, { Component } from 'react';

他真的在做两件事。它以

React

的名称导入

默认值

导出（这只是一种惯例，您可以随意调用）。它还导入命名的导出，

组件

导入默认的

React

的原因实际上是为了使JSX工作。当传输JSX代码时，它会用

替换

React.DOM.div（）

，因此

React

必须存在，否则事情就会破裂

分别导入这两个东西意味着JSX可以工作，但是您可以在代码中编写

组件

，而不是

React.Component

当您从“react”导入

任何
内容时，整个文件都将以任何一种方式包含进来-任何减少捆绑包大小的尝试（例如，消除死代码、树抖动）都是一个额外的单独步骤，这不取决于您的导入语句，而是取决于您使用的代码部分


在这个库的情况下，发生了一件正常的事情：默认导出的子
组件
引用了与命名导出
组件
相同的东西

但是，请记住，这并不能保证情况会如此！如果React库代码包含以下内容：

export default {
    Component: "foo"
};

export const Component = "bar";

然后
React.Component==“foo”
和
Component==“bar”
这是一个偏好问题（例如，我更喜欢
Component
而不是
React.Component
符号）