为什么要用babel-polyfill
1.为什么要用babel-polyfill
Babel默认只转换新的JavaScript句法(syntax),而不转换新的API,比如 Iterator、Generator、Set、Maps、Proxy、Reflect、Symbol、Promise等全局对象,以及一些定义在全局对象上的方法(比如Object.assign)都不会转码。举个栗子,ES6在Array对象上新增了Array.from方法。Babel就不会转码这个方法。如果想让这个方法运行,必须使用babel-polyfill,为当前环境提供一个垫片。
2.安装
npm install babel-polyfill -S
因为是一个 polyfill (它需要在你的源代码之前运行),我们需要让它成为一个 dependency,而不是一个 devDependency
3.在 Node / Browserify / Webpack 中使用
你需要在你的应用入口顶部通过 require 将 polyfill 引入进来。确保它在任何其他代码/依赖声明之前被调用!
require("babel-polyfill");
如果你在你的应用入口使用 ES6 的 import 语法,你需要在入口顶部通过 import 将 polyfill 引入,以确保它能够最先加载:
import 'babel-polyfill';
在 webpack.config.js 中,将 babel-polyfill 加到你的 entry 数组中:
module.exports = {
entry: ["babel-polyfill", "./app/js"]
};
4.在浏览器中使用
可以在 babel-polyfill npm 发布版中的 dist/polyfill.js 文件中找到它。 它需要在你编译过的 Babel 代码之前被包括进去。你可以将它追加到你编译过的代码中,或者在这些代码之前通过 <script> 引入它。
注意: 不要通过类似 browserify 等手段来 require 它,用 babel-polyfill
5.备注
Babel默认不转码的API非常多,详细清单可以查看 babel-plugin-transform-runtime模块的 definitions.js
参考:https://www.babeljs.cn/docs/usage/polyfill/
为什么要用babel-polyfill的更多相关文章
- emitted value instead of an instance of error the scope attribute for scoped slots webpack babel polyfill
api20180803.vue emitted value instead of an instance of error the scope attribute for scoped slots h ...
- 深入浅出ES6(九):学习Babel和Broccoli,马上就用ES6
作者 Jason Orendorff github主页 https://github.com/jorendorff 现在,我们将向你分步展示如何做到的这一切.上面提及的工具被称为转译器,你可以将它 ...
- 深入浅出 ES6:ES6 与 Babel / Broccoli 的联用
深入浅出 ES6指的是添加在 ECMASript 标准第六版中的 JavaScript 编程语言的新特性,简称为 ES6. 虽然 ES6 刚刚到来,但是人们已经开始谈论 ES7 了,它未来的样子,以及 ...
- 《前端之路》之 Babel 下一代 JavaScript 语法编译器
写本章的内容的出发点主要是 为了对于之前关于 JS 版本的一个总结,在之前的开发中,我们始终对于 ECMAScript 的版本的更新不够重视,以至于在后面的 开发过程中,我们始终会被各种新奇的语法打断 ...
- babel7-按需加载polyfill
babel7 babel7发布了. 在升级到 Babel 7 时需要注意几个重大变化: 移除对 Node.js 6 之前版本的支持: 使用带有作用域的 @babel 命名空间,以防止与官方 Babel ...
- webpack4与babel配合使es6代码可运行于低版本浏览器
使用es6+新语法编写代码,可是不能运行于低版本浏览器,需要将语法转换成es5的.那就借助babel7转换,再加上webpack打包,实现代码的转换. 转换包括两部分:语法和API let.const ...
- 关于babel官网的学习
提起babel,前端er大概都不陌生.但是为什么要有babel呢?解决了什么问题?怎么使用babel呢?注意点在哪?以下就从这几个方面总结一下我关于babel学习的结果吧. 为什么要有babel呢? ...
- babel (三) babel polly-fill
Babel includes a polyfill that includes a custom regenerator runtime and core-js. This will emulate ...
- babel (二) update to v7
一.rootmode In 7.1, we've introduced a rootMode option for further lookup if necessary. 二.Remove prop ...
- babel(一)
一.babel npm babel src/index.js -d lib 二.@babel/core @babel/cli @babel/core 转换语法核心 @babel/cli 执行 ...
随机推荐
- 【题解】At2370 Piling Up
[题解]At2370 Piling Up \[ dp(i,j,0/1) \\ 正在进行i项操作并且此时黑球剩下j个,黑球[0/1]数量曾经到过0 \\ 为什么加第二位,判重.怎么想到的? \] 非常神 ...
- 一起来学linux:例行性任务之at和crontab
对于我们日常生活来说,有很多例行需要进行的工作,比如每天早上起床一杯水,例如家人的生日,每天的起床时间等.这性例行的工作有可能被遗忘,但是如果我们用计算机来进行提醒的话,则方便很多.这里就要介绍到Li ...
- 【Linux】服务器之间的免密登录脚本
在实际运维的过程中,经常需要用到免密登录,下面这个脚本实现服务器之间的免密登录,如下 比如,要实现A服务器与B.C.D服务器的免密登录,只需要将B.C.D服务器的IP地址写在serverlist.tx ...
- 在Linux下搭建我的世界(Minecraft)服务器
最近薅了百度云双12的羊毛,1核2G一年150.突然想起以前大学整个宿舍通宵开黑挖泥土的岁月,所以刚好趁着这台服务器,打算自己搭建一个我的世界服务器,重温一下以前的感觉. 超详细Linux搭建Java ...
- MVC+Ext.net零基础学习记录(一)
由于最近开发一个项目,决定使用MVC+EXT.NET,决定将学习的这个过程记录下来 本人和很多菜鸟一样,之前既没有使用过MVC开发,也没有接触过EXT.NET,所以这将是一个大家共同学习的过程,文章中 ...
- zabbix使用mysql模板监控mysql
出现监控项访问拒绝的信息 解决方法是: 在 mysql的 my.cnf 配置中增加 [mysql] user=zabbix password=zabbix [mysqladmin] user=zabb ...
- (1)Java多线程编程核心——Java多线程技能
1.为什么要使用多线程?多线程的优点? 提高CPU的利用率 2.什么是多线程? 3.Java实现多线程编程的两种方式? a.继承Thread类 public class MyThread01 exte ...
- 截取带HTML标签的文本并保留文本样式
一个截取HTML文本的工具,可以按照文字字数或文字字节长度进行截取,保留HTML样式并在最后自动补齐截取后的标签.按工作要求编写,时间紧迫,代码未优化,欢迎讨论和指正.1. [文件] SubHtml ...
- LightOJ 1070 Algebraic Problem:矩阵快速幂 + 数学推导
题目链接:http://lightoj.com/volume_showproblem.php?problem=1070 题意: 给你a+b和ab的值,给定一个n,让你求a^n + b^n的值(MOD ...
- 《java编程思想》:异常丢失
finally子句的不恰当使用,会造成异常的丢失,此处列举两种典型的错误使用示例.编程中要避免这种情况 示例一: try{ throw new ExceptionA(); }finally{ thro ...