Question

如果我放置像

这样的生成器函数

function* someWords() {
  yield "hello";
  yield "world";
}

for (var word of someWords()) {
  alert(word);
}

在app.js中，代码会产生未被捕获的引用错误。

如果我在app.html.eex中的脚本标记内运行相同的代码，它运行正常。

Answer 1

app.html.eex中的代码不会通过babel传递。如果您使用支持生成器的浏览器，那么它们将起作用。

由于您的app.js代码是使用babel编译的，因此您可能需要使用https://babeljs.io/docs/usage/polyfill/才能让生成器工作。

app.js

import "phoenix_html"
import "babel-polyfill"

function* someWords() {
  yield "hello";
  yield "world";
}

for (var word of someWords()) {
  alert(word);
}

brunch_config.js

exports.config = {
  files: {
    javascripts: {
      joinTo: "js/app.js"
    },
    stylesheets: {
      joinTo: "css/app.css"
    },
    templates: {
      joinTo: "js/app.js"
    }
  },

  conventions: {
    assets: /^(web\/static\/assets)/
  },

  paths: {
    watched: [
      "web/static",
      "test/static"
    ],

    public: "priv/static"
  },

  plugins: {
    babel: {
      // Do not use ES6 compiler in vendor code
      ignore: [/web\/static\/vendor/]
    }
  },

  modules: {
    autoRequire: {
      "js/app.js": ["web/static/js/app"]
    }
  },

  npm: {
    enabled: true,
    whitelist: ["phoenix", "phoenix_html", "babel-polyfill"]
  }
};

package.json

{
  "repository": {},
  "dependencies": {
    "babel-brunch": "^6.0.0",
    "babel-polyfill": "^6.3.14",
    "brunch": "^2.1.3",
    "clean-css-brunch": ">= 1.0 < 1.8",
    "css-brunch": ">= 1.0 < 1.8",
    "javascript-brunch": ">= 1.0 < 1.8",
    "phoenix": "file:deps/phoenix",
    "phoenix_html": "file:deps/phoenix_html",
    "uglify-js-brunch": ">= 1.0 < 1.8"
  }
}

ES6 Generator函数导致错误：未捕获ReferenceError：未定义regeneratorRuntime

1 个答案: