问题描述
我正在使用Webpack和Babel来构建和翻译我的ES6代码.但是,在尝试支持较旧的浏览器时,我缺少重要的Polyfills.例如iOS8.
I'm using Webpack and Babel to build and transpile my ES6 code. However I am missing important Polyfills when trying to support older browsers. e.g iOS8.
这是我的Webpack.config
Here's my Webpack.config
const versions = {
v1: './src/js/v1.js',
v2: './src/js/v2.js',
v3: './src/js/v3.js',
};
module.exports = {
entry: versions,
output: {
path: __dirname + '/dist',
filename: '[name].min.js'
},
externals: {
'jquery': 'jQuery'
},
module: {
loaders: [
{
test: /\.js$/,
exclude: /node_modules/,
loader: 'babel-loader',
}, {
test: /\.hbs$/,
loader: 'handlebars-loader',
}
]
}
}
和我的.babelrc
文件:
{
"presets": [
["env", {
"targets": {
"browsers": ["last 3 versions", "iOS >= 8"]
}
}]
]
}
首先,为什么不添加此Polyfill?其次,我该如何添加呢?我尝试将其添加到我的.babelrc
"plugins": ["whatwg-fetch"]
中,但是没有运气.
Firstly, why isn't this Polyfill being added? And secondly how do I add it? I attempted adding this to my .babelrc
"plugins": ["whatwg-fetch"]
with no luck.
我相信我可以将其添加到Webpack配置的条目中,但这在我的实例中不起作用,因为我要尝试分别构建多个脚本.
I believe I can add it to the entry of my Webpack config, but that won't work in my instance as I have multiple scripts I am trying to build separately.
在此先感谢您的帮助.我的头顶枯竭尤其是感激!
Thanks in advance for any help. My depleting head of hair especially is thankful!
推荐答案
您可以在webpack.config.js
文件中添加fetch
的分辨率.
You can add the resolution of fetch
inside your webpack.config.js
file.
new webpack.ProvidePlugin({
'fetch': 'imports-loader?this=>global!exports-loader?global.fetch!whatwg-fetch'
})
在您的plugins
部分中.之后,在代码内部,只需使用fetch
.您无需导入任何内容.当然,您需要imports-loader
和exports-loader
.
Inside your plugins
section.After that, inside your code, just use fetch
. You won't need to import it whatsoever. Of course, you need imports-loader
and exports-loader
.
这篇关于使用babel-preset-env时,Babel不进行Polyfilling Fetch的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!