babel的使用及安装配置教程
作者:Z皓 发布时间:2024-04-19 10:26:11
简介
babel是一个广泛使用的转码器,可以将ES6代码转化为ES5代码,从而在现有环境执行,这意味着,你可以现在就用ES6编写程序,而不用担心现有环境是否支持。
安装及配置
npm install babel-cli --save-dev
或者 cnpm install babel-cli --save-dev
使用淘宝镜像安装会更快。
步骤:进入项目 ==>cnpm install babel-cli --save-dev
为什么不安装在全局
如果安装在全局,那意味着项目要运行,全局环境必须有bable,也就是说项目产生了对环境的依赖。另一方面,这样做也无法支持不同项目使用不同版本的babel。
设定转码规则
根目录下安装:cnpm install babel-preset-es2015 --save-dev
安装完成之后,再创建配置文件 .babelrc这个文件,得放在项目根目录下,它的基本格式是:
{
"presets":[],
"plugins":[]
}
presets字段设置的就是转码规则,plugins是设置的babel的插件。然后配置文件:
{
"presets":["es2015"]
}
到这里,关于babel的基本配置就完成了。
实例演示:
在项目根目录下创建demo.js
let a = 5;
const b = 10;
let input = [1,2,3];
input.map(item => item+1);
因为我们现在是将babel安装到了当前目录下,所以不能直接在终端中babel转换命令,得使用npm来运行,所以先在packge.json中编写
{
"devDependencies": {
"babel-cli": "^6.26.0",
"babel-preset-es2015": "^6.24.1"
},
"scripts":{
"build":"babel demo.js"
}
}
进入根目录,npm run build
运行,查看结果
也可以输出到指定的目录
{
"devDependencies": {
"babel-cli": "^6.26.0",
"babel-preset-es2015": "^6.24.1"
},
"scripts":{
"build":"babel demo.js --out-file bunder.js"
}
}
进入根目录,npm run build
运行,查看结果
这次会在根目录下找到被编译过的bunder.js文件
文件夹截图
总结
以上所述是小编给大家介绍的babel的使用及安装配置教程网站的支持!
来源:https://www.cnblogs.com/fengxiongZz/p/7994207.html
猜你喜欢
- 1、pd.cut()用于将数据值按照值本身进行分段并排序到 bins 中。参数包含:x, bins, right, include_lowe
- golang的defer优雅又简洁, 是golang的亮点之一。defer在声明时不会立即执行,而是在函数return后,再按照先进后出的原
- 浏览器缓存浏览器缓存是浏览器在本地磁盘对用户最近请求过的文档进行存储,当访问者再次访问同一页面时,浏览器就可以直接从本地磁盘加载文档。所以根
- 变量插入字符串的方法Python中的format()函数是一种将变量插入字符串的方法,能够使字符串更易于阅读和理解。它支持许多不同的用法,以
- 本文实例讲述了Python设计模式之享元模式原理与用法。分享给大家供大家参考,具体如下:享元模式(Flyweight Pattern):运用
- 前言现在我能一整天都严肃地盯着屏幕,看起来就像在很认真地工作,利用摸鱼,打开小说,可实行完美摸鱼,实时保存进度用PYQT5 Mock一个摸鱼
- 本文介绍了使用Python来扫描指定目录下的文件,或者匹配指定后缀和前缀的函数。步骤如下:如果要扫描指定目录下的文件,包括子目录,需要调用s
- 封装Python将多个值用逗号隔开,进行赋值。会将这些值封装成一个tuple返回#示例a = 1,2type(a)结果:<class
- python3.6.4安装opencv3.4.2使用pip安装OpenCV直接安装最新版:pip3 install opencv_pytho
- 翻译:ShiningRay @ Nirvana Studio作者:Douglas Crockford来源:http://www.crockf
- 在上一篇文章中,我们讲了如何在linux上用python写一个守护进程。主要原理是利用linux的fork函数来创建一个进程,然后退出父进程
- jsp登陆验证,网页登陆验证带验证码校验,登录功能之添加验证码part_1:专门用于生成一个验证码图片的类:VerificationCode
- 本文实例展示了Python生成日历的实现方法。该实例可实现一个月的日历生成5x7的列表,列表里的没个日期为datetime类型,采用pyth
- 阅读Chapter 1 清单Chapter 2 标题总览:不但所有网页都需要有标题,而且如果标记正确的话,他们能为网页设计和易用性
- 在使用pytorch训练模型,经常需要加载大量图片数据,因此pytorch提供了好用的数据加载工具Dataloader。为了实现小批量循环读
- 写了个小程序:功能1.测试远程ssh连接是否成功,2.批量执行远程ssh命令效果如下:代码如下:#-*- coding:utf-8 -*-i
- 由Oralce8.1开始,Oracle增加了一个新的特性就是Stored Outlines,或者称为Plan Stability(计划稳定性
- 前言上一次简单了解了协程的工作原理 前文链接最后提到了几个使用协程时会遇到的问题,其中一个就是主线程不会等待子线程结束,在这里记录两种比较简
- 本文实例为大家分享了python K均值聚类的具体代码,供大家参考,具体内容如下#-*- coding:utf-8 -*- #!/usr/b
- 目录1.数组重塑1.1 一维数组重塑1.2 多维数组重塑2.数组转置1.数组重塑所谓数组重塑就是更改数组的形状。比如将原来3行4列的数组重塑