babel转换es6_ideamaven依赖配置

babel转换es6_ideamaven依赖配置用Babel-cli将ES6转ES5一、为什么要转ES5   虽然ES6非常好用,但并不是所有浏览器所有客户端都适应ES6的,降成ES5是为了更强的使用性。二、安装转换工具babel-cli1.第一步初始化文件夹(如果已经有package.json文件说明已经初始化过了,可以跳过)右键在文件夹在终端中打开,输入命令npminit-y或者cnpminit-y2.在终端继续输入命令cnpminstall–globalbabel-cli安装ba

大家好,又见面了,我是你们的朋友全栈君。如果您正在找激活码,请点击查看最新教程,关注关注公众号 “全栈程序员社区” 获取激活教程,可能之前旧版本教程已经失效.最新Idea2022.1教程亲测有效,一键激活。

Jetbrains全系列IDE使用 1年只要46元 售后保障 童叟无欺

用Babel-cli将ES6转ES5

一、为什么要转ES5

      虽然ES6非常好用,但并不是所有浏览器所有客户端都适应ES6的,降成ES5是为了更强的使用性。我一直不关注这个东西,直到有人和我说,你做的东西很好,但是对不起,我82年的浏览器显示不出来

二、安装转换工具 babel-cli

1.第一步初始化文件夹(如果已经有package.json文件说明已经初始化过了,可以跳过)
右键在文件夹在终端中打开,输入命令npm init -y或者cnpm init -y
在这里插入图片描述
2.在终端继续输入命令cnpm install --global babel-cli安装 babel-cli
在这里插入图片描述

3.在终端继续输入命令cnpm install --save-dev babel-preset-latest --save-dev安装预设(转码标准)
在这里插入图片描述

4.在文件夹下创建.babelrc配置文件,并在里面写上以下内容

{ 
   
    "presets":"latest"
}

在这里插入图片描述

三、开始转换

1.单文件转换
假如我要将名为ES6.js的es6文件转化成名为ES5.js的ES5文件,在终端输入以下命令

babel .\01-ES6.js --out-file 01-es5.js               

你会发现文件夹目录下新增了一个文件
在这里插入图片描述

里面的内容已经变成ES5能使用的语法了
在这里插入图片描述
let变成了var
const变成了var
箭头函数也变成了普通函数

2.批量转换:

src文件夹里的全部文件转换后,新建一个dist文件夹存储转换后的文件
操作
输入命令 babel src --out-dir dist
简写 babel src -d dist

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/192892.html原文链接:https://javaforall.net

(0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • 本地apache 可以正常访问,lnmp服务器访问404错误

    本地apache 可以正常访问,lnmp服务器访问404错误

    2021年10月9日
    59
  • 对java中bean的理解

    对java中bean的理解简单笼统的说就是一个类,一个可复用的类。javaBean在MVC设计模型中是model,又称模型层,在一般的程序中,我们称它为数据层,就是用来设置数据的属性和一些行为,然后我会提供获取属性和设置属性的get/set方法JavaBean是一种JAVA语言写成的可重用组件。为写成JavaBean,类必须是具体的和公共的,并且具有无参数的构造器。JavaBean通过提供符合一致性设计模式的公共方法将

    2022年7月8日
    22
  • navicat激活码无法生成【2021免费激活】[通俗易懂]

    (navicat激活码无法生成)本文适用于JetBrains家族所有ide,包括IntelliJidea,phpstorm,webstorm,pycharm,datagrip等。https://javaforall.net/100143.htmlIntelliJ2021最新激活注册码,破解教程可免费永久激活,亲测有效,上面是详细链接哦~1…

    2022年3月27日
    129
  • 浅析Promise用法[通俗易懂]

    浅析Promise用法[通俗易懂]浅析Promise用法要理解Promise要知道没有Promise的回调地狱如何插入一段漂亮的代码片Promise语法与then的用法所谓Promise,简单说就是一个容器,里面保存着某个未来才会结束的事件(通常是一个异步操作)的结果。从语法上说,Promise是一个对象,从它可以获取异步操作的消息。Promise提供统一的API,各种异步操作都可以用同样的方法进行处理。Promis…

    2022年6月19日
    28
  • c语言delay函数的作用,delay用法(delay函数使用)「建议收藏」

    c语言delay函数的作用,delay用法(delay函数使用)「建议收藏」是delaytodo还是delaydoing还是delaydo?还是什么啊~~问下delayvt.延期,延缓;推迟Wedecidedtodelayourholidayuntilnextmonth.我们决定将休假延至下个月。所以应该是delaydoing函数名:delay功能:将程序的执行暂停一段时间(毫秒)用法:voiddelay(uns…

    2022年6月2日
    144
  • ioctl之FIONREAD

    ioctl之FIONREAD在学习ioctl时常常跟read,write混淆。其实ioctl是用来设置硬件控制寄存器,或者读取硬件状态寄存器的数值之类的。而read,write是把数据丢入缓冲区,硬件的驱动从缓冲区读取数据一个个发送或者把接收的数据送入缓冲区。 ioctl(keyFd,FIONREAD,&b)得到缓冲区里有多少字节要被读取,然后将字节数放入b里面。接下来就可以

    2022年7月23日
    18

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号