• babel的plugins和presets解析


    babel可以将当前运行平台(浏览器、node服务器)尚不支持的下一代或几代js语法编译为当前支持的js语法版本,比如可以把es6 es7和es8的js代码编译为es5的代码。

    需要明确的几个概念:

    • es2015 === es6
    • es2016 === es7
    • es2017 === es8

    plugin: babel的插件,在6.x版本之后babel必需要配合插件来进行工作

    preset: babel插件集合的预设,包含某一部分的插件plugin

    {
      "plugins": ["transform-es2015-arrow-functions"],
      "presets": ["es2015"]
    }

    babel-preset-es2015: 可以将es2015即es6的js代码编译为es5

    babel-preset-es2016: 可以将es2016即es7的js代码编译为es6

    babel-preset-es2017: 可以将es2017即es8的js代码编译为es7

    babel-preset-stage-x: 可以将处于某一阶段的js语法编译为正式版本的js代码

    stage-X: 指处于某一阶段的js语言提案。

    • 提案共分为五个阶段:
    • stage-0: 稻草人-只是一个大胆的想法
    • stage-1: 提案-初步尝试
    • stage-2: 初稿-完成初步规范
    • stage-3: 候选-完成规范和浏览器初步实现
    • stage-4: 完成-将被添加到下一年发布

    当前 babel 推荐使用 babel-preset-env 替代 babel-preset-es2015 和 babel-preset-es2016 以及 babel-preset-es2017 ,env的支持范围更广,包含es2015 es2016 es2017的所有语法编译,并且它可以根据项目运行平台的支持情况自行选择编译版本。

    使用方法: '.babelrc' 中 'es2015' 改为 'env',

    .babelrc

    { "presets": ["env", "stage-2"] }

    插件中每个访问者都有排序问题。

    这意味着如果两次转译都访问相同的”程序”节点,则转译将按照 plugin 或 preset 的规则进行排序然后执行。

    • Plugin 会运行在 Preset 之前。
    • Plugin 会从第一个开始顺序执行。ordering is first to last.
    • Preset 的顺序则刚好相反(从最后一个逆序执行)。
  • 相关阅读:
    向eureka注册正确的ip地址
    sleuth + zipkin 链路分析
    Yii2的整体结构概览
    Redis实现消息队列
    Redis使用场景梳理
    redis基础知识
    TCP服务
    数据结构-队列
    看见
    线性表的链式存储结构
  • 原文地址:https://www.cnblogs.com/zhaozhipeng/p/8267741.html
Copyright © 2020-2023  润新知