导入CommonJS不能在ES6中正确解构

Question

在模块依赖项的根目录中，有一个名为form.js的文件：

module.exports = require("./dist/bundle.js").form;

在我的项目中，我有：

import { someComponent } from 'my-dependency/form';

然而someComponent将是undefined 。

如果我这样做：

import form from 'my-dependency/form';
console.log(form.someComponent);

它将在控制台中输出如下所示的内容：

ƒ Rr(e){var t=e.component,n=void 0===t?"input":t,r=e.rend[....]

但是，如果我这样做，它将起作用：

import form from 'my-dependency/form';
const { someComponent } = form;

我在这里做错了什么，我怎么能实现我想要的？

在我的src/form.js文件中，我具有：

import someComponent from "./someComponent";
export default {
  someComponent
};

在src/index.js里面，我有：

import * as form from "./form";
export default {
  form
};

可能是根本原因，但不确定如何解决？

看起来是由CommonJS导出并使用ES6语法导入引起的问题。

这是一个有类似问题的人，但来自4年前： https ： //github.com/google/traceur-compiler/issues/1483

我已经尝试过像这样显式设置代码，但这似乎没有实现我想要的（创建带有默认属性的模块）：

Object.defineProperty(module.exports, "__esModule", {
  value: true
});

看起来在线阅读人们会import * as whatever from '..'但也不应破坏工作吗？...

Answer 1

有两种方式：

export const someComponent

然后：

import { someComponent } from 'my-dependency/form'

要么：

export default {
  someComponent
}

然后：

import someComponent from 'my-dependency/form'