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 ...
随机推荐
- 洛谷题解 CF807A 【Is it rated?】
同步题解 题目 好吧,来说说思路: 1.先读入啦~(≧▽≦)/~啦啦啦 2.判断a[i]赛前赛后是否同分数,如果分数不同,则输出,return 0 . 3.如果同分数,则判断a[i]赛前(或赛后)是否 ...
- idhttp采集时遇到乱码问题解决
关键部分代码: FIdhttp.Request.Referer := SQL; stream := TStringStream.Create(''); stream.Position := 0; FI ...
- AJAX完整操作
$("#btn1").click(function () { $.ajax({ url: "ajax/login.ashx", //请求访问的服务端地址 dat ...
- golang初识3 - func
1. 功能块(function block) 格式: func function_name( [parameter list] ) [return_types] { //body } 与delphi的 ...
- Docker安装ElasticSearch及kibana
什么是Kibana? Kibana 是一个设计出来用于和 Elasticsearch 一起使用的开源的分析与可视化平台,可以用 kibana 搜索.查看.交互存放在Elasticsearch 索引里的 ...
- Java高级框架------Spring(二)
五.如何给Bean的属性赋值(注入) 1. 通过构造方法来赋值 2. 设置注入(通过set方法) 2.1 如果属性是基本类型或String等简单 <bean id="peo" ...
- CentOS安装MySQL的完整步骤
1.官方安装文档 http://dev.mysql.com/doc/mysql-yum-repo-quick-guide/en/ 2.下载 Mysql yum包 http://dev.mysql.co ...
- day319 1、正则表达式的定义及使用 2、Date类的用法 3、Calendar类的用法
1.正则表达式的定义及使用2.Date类的用法3.Calendar类的用法 一.正则表达式 ###01正则表达式的概念和作用* A: 正则表达式的概念和作用* a: 正则表达式的概述* 正则表达式也是 ...
- WINAPI方式在windows不同缩放比下取得正确的分辨率
作者: 国家电网河南原阳县供电公司 俏狐:86074731 这个问题我在国内外的很多论坛查资料都没有找到,只有自己研究了,希望可以帮到需要的朋友.本文为原创,转 载请注明出处. #coding:utf ...
- mysql-day1
-- 数据库的操作 -- 链接数据库 mysql -uroot -p mysql -uroot -pmysql -- 退出数据库 exit/quit/ctrl+d -- sql语句最后需要有分号;结尾 ...