在写js 的时候,使用了es6 等最新的语法,那么在低版本的浏览器中是不能直接运行的,需要去做兼容性处理。
首先 下载需要的插件 yarn add -D @babel/core @babel/preset-env babel-loader core-js
js兼容性处理 需要 @babel/core babel-loader
- 基本的js 处理 @babel/preset-env 只能处理简单的语法
- 全部js 兼容处理 @babel-polyfill 能够处理 例如 promise
- 按需加载 core-js
{
test: /\.js$/,
exclude: /node_modules/,
use: [
{
// 指定加载器
loader: 'babel-loader',
// 设置预定义的环境
options: {
// 指定环境的插件
presets: [
[
'@babel/preset-env',
// 配置信息
{
// 要兼容的浏览器
targets: {
'chrome': '88',
"ie": '11'
},
// 指定下载的 corejs 版本
"corejs": '3',
// 使用corejs 的方式 usage 表示按需加载
"useBuiltIns": "usage"
}
]
]
}
}
],
},