Question

我想从我的代码中调用一个npm模块，它是es6模块。有没有一种方法可以实现而无需转译或捆绑我的代码？我不想转码的原因是为了简单起见，因此调试时可以在浏览器中立即看到代码更改。

Answer 1

您可以使用script type="module"在浏览器中使用本机ESM模块。它仅适用于for browsers that support it。

index.html

<html>
  <head></head>
  <body>
      <script type="module" src="my-script.js"></script>
  </body>
</html>

my-script.js

import {stuff} from './module1.js';
import Stuff from './module2.js';

console.log(Stuff);
console.log(stuff);

module1.js

export const stuff = {b: 1};

module2.js

export default {a: 1};

然后设置一个快速的Web服务器以查看页面的工作情况：

python -m SimpleHTTPServer 7654

也就是说，如果您的问题是每次更改时都要刷新代码并以ES6开发人员模式对其进行调试，那么我建议使用sourceMaps作为解决方案。使用sourceMaps，您可以在调试ES6中的开发版本时，在生产环境中看到已编译（或随意“编译”）的代码。 Webpack（或替代品）目前已经非常优化，可以在每次保存时进行部分编译very quickly重新加载浏览器。

使用es6样式导入导入npm模块而不进行编译？

1 个答案: