Karma、PhantomJS 和 es6 Promises

Question

我正在編寫一個使用新 es6 承諾的 JavaScript 庫。 我可以在 Firefox 中測試這個庫，因為 promise 已經定義好了。 但是，當我嘗試使用 Karma 和 PhantomJS 測試我的代碼時，出現錯誤Can't find variable: Promise. . 我猜這是因為 PhantomJS 瀏覽器還不支持 es6 承諾。

如何配置 Karma 以引入 polyfill 以實現 Promise？

Answer 1

你可以通過簡單地安裝Babel Polyfill 來引入 Babel polyfill ：

npm install --save-dev babel-polyfill

然后在karma.conf.js的files部分中的源文件和測試文件之前包含karma.conf.js files ：

files: [
  'node_modules/babel-polyfill/dist/polyfill.js',
  'index.js',   //could be /src/**/*.js
  'index.spec.js' //could be /test/**/*.spec.js
],

除非你知道你的所有目標瀏覽器都支持 Promises，否則你可能也想將這個 polyfill 應用到你發布的構建中。

如果你真的喜歡冒險，你可以使用 Browserify 拉取文件，讓你的測試更加模塊化，然后使用 Babelify 將 ES6 轉換為 ES5。 我已經用這些創建了一個示例項目和一個涉及 Promise（在 PhantomJS2 上運行）的工作測試以供參考。

Answer 2

對於 Babel 6，我們需要安裝babel-polyfill來支持 promise。

npm install --save-dev babel-polyfill

並在files部分的karma.conf.js添加一行

files: [
  'node_modules/babel-polyfill/dist/polyfill.js',
  ....
]

它在https://github.com/babel/karma-babel-preprocessor#polyfill 中有詳細記錄

Answer 3

正如作者正確指出的那樣，它無法識別 es6 承諾。 為了加載它，es6-promise 模塊可以在 webpack.ProvidePlugin 的幫助下加載，並在 webpack 的 plugins 數組中配置它。

plugins: [
        new webpack.ProvidePlugin({
            'Promise': 'es6-promise'
        })
    ]

這似乎對我有用！

Answer 4

這個線程應該可以幫助你。 根據它，您似乎應該嘗試將 PhantomJS2 與 ES6 一起使用。 你也可以看看這個項目，它比你的主題更接近。

我希望它可以幫助你

Answer 5

您可以將karma-babel-preprocessor用於使用 ES6 功能的文件。 安裝它

npm install --save-dev karma-babel-preprocessor

然后在karma.conf添加指定應該預處理哪些文件：

preprocessors: {
      "src/**/*.js": ["babel"],
      "test/**/*.js": ["babel"]
    },