Babel生成的代码导致错误，exports未定义。

Question

当运行这段由Babel生成的代码时，我会遇到一个错误exports is undefined

Object.defineProperty(exports, '__esModule', {

有什么想法吗？

- SuperUberDuper

Answer 1

你很可能没有在支持CommonJS模块的环境中执行代码。你可以使用打包工具，例如Browserify或webpack将你的模块打包成可在不同环境中运行的形式。

或者你可以选择不同的模块转换器。

---

使用webpack：

运行npm install -g webpack; npm install -D babel-loader。然后使用这个webpack配置：

// webpack.config.js
module.exports = {
    entry: "./path/to/entry/module.js",
    output: {
        path: __dirname,
        filename: "bundle.js"
    },
    module: {
      loaders: [
        { test: /\.js$/, exclude: /node_modules/, loader: "babel-loader"}
      ]
    }
};

运行webpack命令将使用Babel转换入口文件中可达的所有*.js文件，并将它们捆绑在一起成为bundle.js。

- Felix Kling

---

哦，我以为我可以直接在浏览器中运行 Babel 的输出。 - SuperUberDuper

我建议阅读webpack文档 :) 在这种情况下，也可以参考https://babeljs.io/docs/using-babel/#webpack。 - Felix Kling

我只想创建一个脚本，将其捆绑到某个人将使用的 CDN 上。他们没有 Webpack。 - SuperUberDuper

我明白。Webpack将所有模块捆绑在一起并生成单个文件。 - Felix Kling

好的，我会从 http://webpack.github.io/docs/tutorials/getting-started/ 开始。 - Felix Kling

Answer 2

我读到一篇关于ES6的import和export只能在具有“静态可分析文件”的浏览器中使用的文章，并且由于这个原因，Babel在浏览器中删除了对import和export的支持。这可能与异步或安全性有关。

如果你想跳过服务器端打包来进行开发，你可以在底部放置window.MyModule = MyModule，然后在下一个文件的顶部引入var MyModule = window.MyModule。

- neaumusic