ReactJS在较老的浏览器中使用Fetch

Question

我将实现React JS，使用Webpack和Babel。但是，我在使Fetch与IE 11一起工作时遇到了问题。

我在我的.babelrc文件中有以下内容：

{
  "presets" : ["env", "stage-0", "react"]
}

在我的webpack.config.js文件中添加以下内容：

var webpack = require('webpack');
var path = require('path');

var DIST_DIR = path.resolve(__dirname, 'dist');
var SRC_DIR = path.resolve(__dirname, 'src');

var config = {
  entry: {
    bundle: [
      'babel-polyfill',
      SRC_DIR + '/app/index.js',
    ]
  },
  output: {
    path: DIST_DIR + '/public/js',
    filename: 'bundle.js'
  },
  module: {
    loaders: [
      {
        test: /\.jsx?$/,
        include: SRC_DIR,
        loader: 'babel-loader'
      }
    ]
  }
};

module.exports = config;

根据我的理解，实现babel-preset-env、stage-0和babel-polyfill应该可以将Fetch API转译为旧版浏览器可以理解的代码。是否还有其他需要注意的问题？

- kojow7

---

只是想添加这个内容，以备将来参考，以防人们惊讶于IE 11不支持fetch：https://caniuse.com/#search=fetch - Michael Sorensen

Answer 1

fetch不是EcmaScript的一部分，而是Web平台的一部分。Babel只是一个编译器，用于编写最新的JavaScript代码。如果你想在旧版浏览器中使用fetch，你需要像这个一样的polyfill。

Fetch API: 了解更多

- Jonathan Dion

Answer 2

fetch 必须由您使用的浏览器提供，并且不包含在 babel-polyfill 中。如果您的浏览器不支持 fetch，则可以回退到使用 XMLHttpRequest 或使用诸如 isomorphic-fetch 的 polyfill。

- Pedro Castilho