webpack babel-polyfill

519 阅读1分钟

babel 是一个转码器,可以将 ES6 转码为 ES5,使代码可以在现有环境中运行。


babel 默认转化新的javascript语法,但是不会转换新的API,eg:Iterator、Generator、Set、Maps、Proxy、Reflect、Symbol、Promise等。也不会转换全局对象上的方法,比如Object.assign、Array.from等,需要让其运行,要使用babel-polyfill.

安装:

npm install babel-polyfill --save

使用:

import 'babel-polyfill'

问题:

使用 babel-polyfill 后,解决了 babel 不会转换新 API 的问题。但是直接在代码中添加了帮助函数,污染了全局环境,并且不同的代码环境中会出现重复的代码,导致编译后的代码体积变大。

解决:

使用babel-runtime,提供编译模块的工具函数

安装

babel-runtime、babel-plugin-transform-runtime


使用:

"plugins": [
        "transform-runtime"
    ]

比较:

babel-runtime 不能代替 babel-polyfill ,因为 babel-runtime 只能转换 static 静态方法