我尝试配置一个使用 Babel 和 Webpack 开发 JavaScript 的环境。
但是我不了解关于 presets
的 Babel 配置。
在 使用指南 中,我们可以看到使用 "@babel/env"
这个 preset。
但是在其他文档中,我找不到这样的配置,取而代之的是 "@babel/preset-env"
,例如这里 https://babeljs.io/docs/en/babel-preset-env
我用我的有限英语能力在文档中反复查找,但是无法找出 "@babel/env"
和 "@babel/preset-env"
之间的区别,或许它们是一样的吗?
另外,目标集似乎不起作用。如果我希望我的 es6 脚本转换为兼容 ie8 的脚本,那么移除目标后也可以在 ie9+ 上正常运行,所以它并不是最重要的。
这是我的项目:sdk-dev-env
// https://babeljs.io/docs/en/configuration
const presets = [
[
'@babel/env',
{
// https://babeljs.io/docs/en/babel-preset-env#targets
// TODO: how to compatibilite with ie 8
targets: {
ie: '8',
edge: '17',
firefox: '60',
chrome: '67',
safari: '11.1'
/**
* you can also set browsers in package.json
* "browserslist": ["last 3 versions"]
* relative links:
* https://github.com/browserslist/browserslist
*/
},
corejs: '3',
// corejs: { version: 3, proposals: true },
/**
* https://babeljs.io/docs/en/usage#polyfill
* https://github.com/zloirock/core-js#babelpreset-env
* "usage" will practically apply the last optimization mentioned above where you only include the polyfills you need
*/
useBuiltIns: 'usage'
}
]
]
const plugins = []
if (process.env['ENV'] === 'prod') {
// plugins.push(...);
}
module.exports = { presets, plugins }
我希望了解它们是否相同,如果不同,有何区别。
以及如何最佳地使用babeljs 7.4和core-js 3。