IE不支持ES6语法的解决方案——Babel

安稳与你 提交于 2020-11-15 06:11:58

Babel 是一个 JavaScript 编译器

Babel 是一个工具链,主要用于将 ECMAScript 2015+ (ES6+,IE不支持ES6+语法,所以要支持IE,项目中引入Babel还是很有必要的)版本的代码转换为向后兼容(向后兼容 :兼容以前的;向前兼容:兼容未来的 )的 JavaScript 语法,以便能够运行在当前和旧版本的浏览器或其他环境中。下面列出的是 Babel 能为你做的事情:

  • 语法转换
  • 通过 Polyfill 方式在目标环境中添加缺失的特性 (通过 @babel/polyfill 模块)
  • 源码转换 (codemods)

以下以gulp打包工具为例:

1.安装

npm install --save-dev gulp-babel

 

2.使用

var gulp = require("gulp");
var babel = require("gulp-babel");

gulp.task("default", function () {
  return gulp.src("src/app.js")
    .pipe(babel())
    .pipe(gulp.dest("dist"));
});

 

3.创建.babelrc配置文件

3.1安装preset-env

npm install @babel/preset-env --save-dev

3.2创建.babelrc配置文件

{
  "presets": ["@babel/preset-env"]
}

详情参照官网:https://www.babeljs.cn/docs/usage

打包工具配置指南参考:https://www.babeljs.cn/setup.html#installation

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!