为什么要把React资本化？导入*作为'反应'的反应

Question

我看到的导入模块的大多数示例都使用小写; e.g。

import * as tools from './tools';

我经常看到的规则是，如果它是构造函数，那么使用PascalCase;否则使用camelCase。

但是我总是看到import * as React from 'react'，即使React不是构造函数（不能做new React()）。为什么它总是大写，从JavaScript风格的角度来看，我会选择像'./tools'那样大写库或模块？

我的大多数背景都是在C＃和C ++中，所以我倾向于将库大写（import DateFns from 'date-fns'，import * as Tools from './Tools'）。

Answer 1

因为它是一个名称空间而我猜是因为它是一个框架品牌。作为框架的品牌倾向于更频繁地获得资本化（Vue，Backbone，Ember等）。

当使用Typescript作为你的javascript超集时，将你的命名空间大写很有意义，因为它有类似C＃的味道。

但是即使使用新的ECMAScript版本，也可以利用命名空间。我认为它使事情更具可读性。

Answer 2

我偶然发现了这个老问题。

需要将'react'模块导入为React（准确的拼写和大小写）的主要原因是为了使JSX正常工作。

来自JSX In Depth doc：

  

从根本上说，JSX只是为React.createElement(component, props, ...children)函数提供了语法糖。

...以及更高版本：

  

反应必须在范围内

     

由于JSX编译成对React.createElement的调用，所以React库也必须始终在JSX代码的作用域之内。

---

示例

JSX中的此组件：

const SimpleComponent = () => (<div>simple component</div>);

...被编译为：

var SimpleComponent = function SimpleComponent() {
  return React.createElement("div", null, "simple component");
};

...因此React必须存在于范围中，否则编译后的代码在运行时将引发此错误：

  

ReferenceError：未定义React