es6是否可以导入commonjs模块?

时间:2019-03-14 16:48:44

标签: javascript typescript es6-modules

我有一个commonjs模块,它是由Typescript 3.3.3生成的。

是否可以将其与es6 import语句一起使用?这是我尝试过的。

生成的模块在文件末尾导出CountUp,如下所示:

exports.CountUp = CountUp;

这里是entire generated file

在我的main.js中:

import { CountUp } from './js/countUp.js';

在index.html中:

  <script src="./js/countUp.js"></script>
  <script src="./main.js" type="module"></script>

但是我明白了

  

countUp.js:13未捕获的ReferenceError:未定义导出       在countUp.js:13

2 个答案:

答案 0 :(得分:2)

简短回答:否


使用es6时,您需要使用export而不是exports进行导出。 exports是commonjs功能,主要在节点内部使用,而不是在Web浏览器中使用。

如果您想使用commonjs,则需要使用requirejs之类的第三方库,但这使用require()而不是import和{{1} },而不是exports。然后,您将能够使用带有typescript的导入/导出来编写代码,但是将使用export进行编译,而require将处理其余的代码。

因此,要在浏览器中正确使用它,您将需要这样做:

test.js

requirejs

index.js

export function Test() {
  console.log('hello')
}

然后,当您将文件加载到html中时,将执行功能测试。

import { Test } from './test.js'
Test()

答案 1 :(得分:-1)

实际上,您可以使用module.exports和import。它适用于webpack,vs代码也适用