babel-core

只转换语法(如箭头函数)

babel-polyfill

由core-js和regenerator runtime组成。

1 core-js用来支持新的全局变量(例如 Promise、Symbol等) 、新的原生方法(如 String.padStart等)。

2 regenerator runtime由facebook提供,用ES 5实现了生成器函数(GeneratorFunction)、迭代器(AsyncIterator)。

生成器函数(function *)、async/await函数会被编译成regenerator runtime实现的生成器函数、迭代器来运行。

Presets(预设)

1 babel-preset-env:指定目标环境(浏览器类型、浏览器版本)

2 babel-preset-stage-x:对现在尚未被批准发布的部分进行转换。

  

 TC39委员会将提案分为以下阶段:

  • Stage 0 - 稻草人: 只是个想法可能会有相关的 Babel 插件。
  • Stage 1 - 提议: 值得深入。
  • Stage 2 - 草稿: 初始规范。
  • Stage 3 - 候选: 完整的规范和初始浏览器实现。
  • Stage 4 - 结束: 将被添加到下一个年度版本中。

3 babel-preset-react用来编译JSX语法

4 babel-preset-vue用来编译Vue

Plugins(插件)

控制babel的编译行为。

babel-plugin-transform-runtime可以设置编译后的脚本文件引用公共函数等,而不是每个脚本文件都持有一个副本,导致代码冗余。

Babel 6 概述的更多相关文章

  1. JavaScript面向对象轻松入门之概述(demo by ES5、ES6、TypeScript)

    写在前面的话 这是一个JavaScript面向对象系列的文章,本篇文章主要讲概述,介绍面向对象,后面计划还会有5篇文章,讲抽象.封装.继承.多态,最后再来一个综合. 说实话,写JavaScript面向 ...

  2. 前端笔记之ES678&Webpack&Babel(下)AMD|CMD规范&模块&webpack&Promise对象&Generator函数

    一.AMD和CMD规范(了解) 1.1传统的前端开发多个js文件的关系 yuan.js中定义了一个函数 function mianji(r){ return 3.14 * r * r } main.j ...

  3. JavaScript是如何工作的:深入类和继承内部原理 + Babel和TypeScript 之间转换

    这是专门探索 JavaScript 及其所构建的组件的系列文章的第 15 篇. 如果你错过了前面的章节,可以在这里找到它们: JavaScript 是如何工作的:引擎,运行时和调用堆栈的概述! Jav ...

  4. Babel插件:@babel/plugin-transform-runtime

    一 概述 每个Babel编译后的脚本文件,都以导入的方式使用Babel的帮助函数,而不是每个文件都复制一份帮助函数的代码. 1 优点 (1)提高代码重用性,缩小编译后的代码体积. (2)防止污染全局作 ...

  5. JavaScript是如何工作的:深入类和继承内部原理 + Babel和TypeScript之间转换

    现在构建任何类型的软件项目最流行的方法这是使用类.在这篇文章中,探讨用 JavaScript 实现类的不同方法,以及如何构建类的结构.首先从深入研究原型工作原理,并分析在流行库中模拟基于类的继承的方法 ...

  6. ES6的新特性(1)——ES6 的概述

    ES6 的概述 首先,感谢马伦老师的ES6新特性的教程. ECMAScript 和 JavaScript 的关系是 ECMAScript 和 JavaScript 的关系是,前者是后者的规格,后者是前 ...

  7. 004-React入门概述

    一.概述 参考地址:https://reactjs.org/docs/try-react.html 1.1.本地快速体验 <!DOCTYPE html> <html> < ...

  8. JavaScript 基础:Babel 转译 class 过程窥探

    零.前言 虽然在 JavaScript 中对象无处不在,但这门语言并不使用经典的基于类的继承方式,而是依赖原型,至少在 ES6 之前是这样的.当时,假设我们要定义一个可以设置 id 与坐标的类,我们会 ...

  9. How Javascript works (Javascript工作原理) (十五) 类和继承及 Babel 和 TypeScript 代码转换探秘

    个人总结:读完这篇文章需要15分钟,文章主要讲解了Babel和TypeScript的工作原理,(例如对es6 类的转换,是将原始es6代码转换为es5代码,这些代码中包含着类似于 _classCall ...

随机推荐

  1. glide 长方形图片显示圆角问题

    目前业务是RecyclerView嵌套RecyclerView,子RecyclerView里面显示图片,图片显示方式又分为 多图和单图显示方式(这个是已经调试好的效果) 测试显示结果只有单张图片不显示 ...

  2. three.js:使用createMultiMaterialObject创建的多材质对象无法使用光线跟踪Raycaster选中

    创建多材质对象: var loader = new THREE.DDSLoader(); var map = loader.load('../assets/textures/Mountains_arg ...

  3. jumpservice配置:快速入门

    快速入门 说明 到 Jumpserver 会话管理-终端管理 查看 Coco Guacamole 等应用是否在线 一.系统设置 1.1 基本设置 # 修改 url 的"localhost&q ...

  4. MVC JsonResult 结果返回

    使用MVC之后, 默认的ActionResult 有很多子类譬如 JsonResult之类, 可以很方便. 基本用法如下:         public ActionResult GetVacatio ...

  5. oracle导出表的建表语句拼接SQL

    前段时间有个需求需要导出数据库的500张表结构,使用PLSQLDEV工具也可以导出建表语句,但是需要手动一个表一个表选,非常费劲.就写了个拼接sql. select 'select dbms_meta ...

  6. 使用pgrouting进行最短路径搜索

       PgRouting是基于开源空间数据库PostGIS用于网络分析的扩展模块,最初它被称作pgDijkstra,因为它只是利用Dijkstra算法实现最短路径搜索,之后慢慢添加了其他的路径分析算法 ...

  7. Resharper快捷键汇总

    编辑Ctrl + Space 代码完成 Ctrl + Shift + Space代码完成Ctrl + Alt + Space代码完成Ctrl + P 显示参数信息Alt + Insert 生成构造函数 ...

  8. vue富文本编辑器

    基于webpack和vue 一.npm 安装 vue-quill-editor 二.在main.js中引入 import VueQuillEditor from 'vue-quill-editor'/ ...

  9. 关于ueditor插入不了动态地图

    1. 打开编辑器根目录下面的ueditor.all.js文件,找到: table.setAttribute("data-sort", cmd == "enablesort ...

  10. Linux下的常见压缩解压缩命令

    Linux常见压缩解压缩命令 常见压缩文件扩展名 .Z compress 程序压缩的文件: .zip zip 程序压缩的文件: .gz gzip 程序压缩的文件: .bz2 bzip2 程序压缩的文件 ...