Babel 6 概述
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 概述的更多相关文章
- JavaScript面向对象轻松入门之概述(demo by ES5、ES6、TypeScript)
写在前面的话 这是一个JavaScript面向对象系列的文章,本篇文章主要讲概述,介绍面向对象,后面计划还会有5篇文章,讲抽象.封装.继承.多态,最后再来一个综合. 说实话,写JavaScript面向 ...
- 前端笔记之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 ...
- JavaScript是如何工作的:深入类和继承内部原理 + Babel和TypeScript 之间转换
这是专门探索 JavaScript 及其所构建的组件的系列文章的第 15 篇. 如果你错过了前面的章节,可以在这里找到它们: JavaScript 是如何工作的:引擎,运行时和调用堆栈的概述! Jav ...
- Babel插件:@babel/plugin-transform-runtime
一 概述 每个Babel编译后的脚本文件,都以导入的方式使用Babel的帮助函数,而不是每个文件都复制一份帮助函数的代码. 1 优点 (1)提高代码重用性,缩小编译后的代码体积. (2)防止污染全局作 ...
- JavaScript是如何工作的:深入类和继承内部原理 + Babel和TypeScript之间转换
现在构建任何类型的软件项目最流行的方法这是使用类.在这篇文章中,探讨用 JavaScript 实现类的不同方法,以及如何构建类的结构.首先从深入研究原型工作原理,并分析在流行库中模拟基于类的继承的方法 ...
- ES6的新特性(1)——ES6 的概述
ES6 的概述 首先,感谢马伦老师的ES6新特性的教程. ECMAScript 和 JavaScript 的关系是 ECMAScript 和 JavaScript 的关系是,前者是后者的规格,后者是前 ...
- 004-React入门概述
一.概述 参考地址:https://reactjs.org/docs/try-react.html 1.1.本地快速体验 <!DOCTYPE html> <html> < ...
- JavaScript 基础:Babel 转译 class 过程窥探
零.前言 虽然在 JavaScript 中对象无处不在,但这门语言并不使用经典的基于类的继承方式,而是依赖原型,至少在 ES6 之前是这样的.当时,假设我们要定义一个可以设置 id 与坐标的类,我们会 ...
- How Javascript works (Javascript工作原理) (十五) 类和继承及 Babel 和 TypeScript 代码转换探秘
个人总结:读完这篇文章需要15分钟,文章主要讲解了Babel和TypeScript的工作原理,(例如对es6 类的转换,是将原始es6代码转换为es5代码,这些代码中包含着类似于 _classCall ...
随机推荐
- Selenium常用方法
Selenium是一个自动化测试工具,利用它可以驱动浏览器执行特定的动作,如点击.下拉等操作,同时还可以获取浏览器当前呈现的页面的源代码,做到可见即可爬.对于一些JavaScript动态渲染的页面来说 ...
- Pyrit help
Pyrit 0.5.1 (C) 2008-2011 Lukas Lueg - 2015 John Morahttps://github.com/JPaulMora/PyritThis code is ...
- 服务注册中心,Eureka比Zookeeper好在哪里?
著名的CAP理论指出,一个分布式系统不可能同时满足C(一致性).A(可用性).和P(分区容错性).由于分区容错性P在分布式系统中必须要保证的,因此我们只能在A和C之间进行权衡. 因此: Zookeep ...
- 70.纯 CSS 创作一只徘徊的果冻怪兽
原文地址:https://segmentfault.com/a/1190000015484852 感想:monster中边框角.上下动画.旋转动画.左右动画,眼睛中transform:scaleY(n ...
- windowNoTitle 无效
在开发Dialog 时候如采用 Dialog Activity 方式可能会出现取消标题栏失效 以下针对两种情况说明 1.如果 extends AppCompatActivity 需要在setConte ...
- MVC人员管理系统
基本都要使用C控制器中的两个action来完成操作,一个用于从主界面跳转到新页面.同时将所需操作的数据传到新界面,另一个则对应新界面的按钮,用于完成操作.将数据传回主界面以及跳转回主界面.根据不同情况 ...
- 深入理解Java虚拟机读书笔记1----Java内存区域与HotSpot虚拟机对象
一 Java内存区域与HotSpot虚拟机对象 1 Java技术体系.JDK.JRE? Java技术体系包括: · Java程序设计语言: · 各种硬件平台上的 ...
- TIMESTAMP(6)类型的时间差
TIMESTAMP 数据类型 它包括了所有DATE数据类型的年月日时分秒的信息,而且包括了小数秒的信息. 以分钟为单位查询时间差 select ROUND(TO_NUMBER(to_date(to_c ...
- UICollectionView didSelectItemAtIndexPath实现方法
didSelectItemAtIndexPath是通过UIResponder的四个touch方法实现的(touchBegan, touchMove, touchEnd, touchCancel),因此 ...
- sql 判断两条数据库查询语句结果是否有重复
select 身份证号 from (select 身份证号 from 表1 where 考试名称= 'aaa'union allselect 身份证号 from 表2 where 考试名称= 'bbb ...