CommonJS 要求与 ES6 导入差异答案

【问题标题】：CommonJS require vs. ES6 import discrepancyCommonJS 要求与 ES6 导入差异
【发布时间】：2019-12-18 04:18:30
【问题描述】：

所以，我是 React 的新手。抱歉，如果我遗漏了一些明显的东西，我正在努力解决我的 ES6 导入的一个奇怪问题。

我正在使用 @typeform/embed 模块 (0.12.1)，它奇怪地链接到 npm 上的 GitHub 存储库，但该存储库不存在。所以我无法调查潜在的相关问题。

无论如何，每当我执行以下操作时：

import typeformEmbed from '@typeform/embed'

我的文本编辑器显示typeformEmbed的类型是一个字符串，当我去调用它的一个函数时，它总是undefined。给我'ole 不能在未定义的 TypeError 上调用属性 X。它几乎看起来好像在尝试导入 README?

但是，然后我打开了我的 Node REPL 并且可以写：

const typeformEmbed = require('@typeform/embed')

它就像一个魅力。

我缺少的两者之间是否存在一些差异？

编辑：我知道这个问题的文字量很大，如果我遗漏了重要信息，请告诉我。我应该提一下，我使用create-react-app 构建了这个项目。

【问题讨论】：

标签： reactjs commonjs typeform

【解决方案1】：

import * as typeformEmbed from '@typeform/embed';


const popUpHandler = () => {     

typeformEmbed.makePopup(
  'https://admin.typeform.com/to/PlBzgL',
  {
     mode: 'drawer_left',
     autoOpen: true,
     autoClose: 3,
     hideScrollbars: true,
     onSubmit: function () {
       console.log('Typeform successfully submitted')
  }
 }
)}

应该适合你

【讨论】：

为什么？在他们的自述文件中，他们只是直接导入它，我猜假设入口点文件使用默认的导出语法？ npmjs.com/package/@typeform/embed#usage
他们示例中的导入不起作用！ import * as typeformEmbed 基本上是说'从库中导入所有内容并将其别名为 typeformEmbed，以便您可以通过别名调用函数'
有意思，我猜这是require默认的行为？
但无论如何，都会给他们一个注释，说明他们需要修补文档。感谢您的帮助。
const typeformEmbed = require('@typeform/embed');和我为 ES6 展示的一样。