这是部分 ES6 问题部分 React 问题。我正在尝试在带有 ES6 类和 Babel 的 React 中使用 namespaced components。所以我想真正的问题是如何命名空间 es6 类，以便我可以做这里解释的事情：https://facebook.github.io/react/docs/jsx-in-depth.html#namespaced-components
由于我收到意外的令牌错误：
class Headline extends Component { ... }
class Headline.Primary extends Component { ...
^
【问题讨论】：
标签： javascript reactjs ecmascript-6
ECMAScript-6 class declaration 语法需要一个标准的 BindingIdentifer 作为类名。点不是标识符名称中的有效字符。
在 OP 中的链接中使用的上下文中，“命名空间”是一个对象，并且使用点表示法将属性一一添加到该对象中以进行属性访问。
您可以改为使用 类表达式 来复制它：
'use strict'
var ns = {}
ns.MyClass = class {
constructor() {
console.log('in constructor')
}
}
new ns.MyClass()【讨论】：
something.something = class extends something.baseSomething{}
extends 结合使用时似乎会失败。 :(
这在 ES6 中并没有真正改变，你仍然需要做一个作业：
Headline.Primary = class Primary extends Component { … };
然而，使用像 Headline 这样的类作为命名空间在 ES6 中已被弃用（而且以前一直是一个有问题的做法），您应该改用新的模块系统。将Primary 导出为命名导出，而不是导入Headline 类，而是使用import * as headlines from …。
【讨论】：
class Primary 更改为 class 并使其成为 anonymous 类表达式。 （否则，除了前缀名称之外，该名称Primary（没有名称空间前缀）将在该类内可用。）
class 表达式不会使标识符在其范围内可用，这与命名function 表达式不同。它只是使名称显式（并且在某些情况下，有必要为构造函数提供其.name 属性）
这个link也与这个问题有关。
在模块对象部分中，描述了您可以执行以下操作：
// headline.js file
export {Headline, Primary}
class Headline {}
class Primary {}
// In another module...
import * as Headline from "headline";
let h = new Headline.Headline();
let hp = new Headline.Primary();
这并不完全是您想要做的，而是一种替代方法。
另一种方法几乎就像@Bergi 已经指出的那样，但我只是进一步澄清：
let Headline = class Headline extends Component { }
Headline.Primary = class Primary extends Component { }
export {Headline as default}
// in another module:
import Headline from 'headline';
let headline = new Headline();
let primary = new Headline.Primary();
【讨论】：
* as，对吗？