• 使用Babel将ES6代码转为ES5代码,从而在现有环境执行。


    前言

    在线转码 https://babeljs.io/repl/#
    https://es6console.com/

    1.快速入门

    (1)ES6的某些高级语法在浏览器环境甚至是Node.js环境中无法执行。
    (2)Babel是一个广泛使用的转码器,可以将ES6代码转为ES5代码,从而在现有环境执行。
    (3)这意味着,你可以现在就用 ES6 编写程序,而不用担心现有环境是否支持。

    文件目录如下
    在这里插入图片描述

    2.安装使用

    安装命令行转码工具
    Babel提供babel-cli工具,用于命令行转码。它的安装命令如下:

    npm install -g babel-cli
    #查看是否安装成功
    babel --version
    
    • 1
    • 2
    • 3

    在这里插入图片描述

    3、初始化项目

    npm init -y
    
    
    • 1
    • 2

    在这里插入图片描述

    4、创建文件 src/test1.js,写入es6语法代码(需要转换的文件)

    //es6语法
    let name = "this is java!"
    const title = "张三";
    let arr = [1,2,3,4,5,6];
    let newarr = arr.map(a=>a*2);
    console.log(name);
    console.log(title);
    console.log(newarr);
    
    
    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9

    5、创建、配置 .babelrc

    Babel的配置文件是.babelrc,存放在项目的根目录下,该文件用来设置转码规则和插件

    {
        "presets": ["es2015"],
        "plugins": []
    }
    
    
    • 1
    • 2
    • 3
    • 4
    • 5

    6、安装转码器,在项目中安装

    npm install --save-dev babel-preset-es2015
    
    
    • 1
    • 2

    7、开始转码

    执行完之后我们执行babel src -d dist,这个的意思是将src所有的文件都编译成ES2015格式放入dist目录之下。

    babel src -d dist
    
    • 1

    在这里插入图片描述

  • 相关阅读:
    python如何操作mysql数据库
    php+mysql公司日常办公OA系统
    20 - 欲知JVM调优先了解JVM内存模型
    unity3d中单例模式两种简单写法与对比
    @requestmapping注解的作用及用法
    数据库的事务
    elasticsearch代码基本实现
    RabbitMQ
    测试团队技术转型实践方法
    流程控制知识大闯关
  • 原文地址:https://blog.csdn.net/weixin_44797182/article/details/127622359