Babel6.x的安装过程
1、首先安装babel-cli(用于在终端使用babel)
npm install -g babel-cli
2、然后安装babel-preset-es2015插件
npm install --save babel-preset-es2015
注:Babel5版本默认包含各种转换插件,然而Babel6.x相关转换插件需要自己下载,如transform-es2015-arrow-functions、transform-es2015-classes等,而ES2015 preset包含了所有插件。如果不安装任何插件,那么在命令行进行转换是没有任何效果的!
其中--save参数自动更新package.json文件,写进依赖项
3、在命令行输入:
babel es6.js --presets es2015
输出:
"use strict";
[1, 2, 3].map(function (x) {
return x * x;
});
注:后面的参数--presets es2015表示使用该插件进行编译,如果不写上转换是没有效果的。
4、插件配置
每一次都写上该参数那是很麻烦的,可以在当前目录下新建配置文件 .babelrc。
但是在windows系统中,不允许直接右键建立没有文件名的文件,可以通过cmd命令行创建:在当前文件夹打开cmd并键入命令
type nul>.babelrc
即可在当前目录下建立文件.babelrc,接着在文件中写入:
{
"presets": ['es2015']
}
那么就可以直接在命令行中使用babel es6.js进行转换而无需添加表明所用插件的参数
除了建立.babelrc文件之外,也可在package.json中进行配置,添加以下属性即可:
"babel": {
"presets": ["es2015"]
}
附Babel常用命令:
1、转换es6.js文件并在当前命名行程序窗口中输出
babel es6.js
2、将es6.js转换后输出到es5.js文件中(使用 -o 或 --out-file )
babel es6.js -o es5.js babel es6.js --out-file es5.js
3、实时监控es6.js一有变化就重新编译(使用 -w 或 --watch )
babel es6.js -w --out-file es5.js
babel es6.js --watch --out-file es5.js
4、编译整个src文件夹并输出到lib文件夹中(使用 -d 或 --out-dir )
babel src -d lib
babel src --out-dir lib
5、编译整个src文件夹并输出到一个文件中
babel src --out-file es5.js
6、直接输入babel-node命令,可以在命令行中直接运行ES6代码
babel-node
Babel6.x的安装过程的更多相关文章
- webstorm下载&&安装过程&&打开项目
一.webstorm下载 WebStorm 是jetbrains公司旗下一款JavaScript 开发工具.被广大中国JS开发者誉为"Web前端开发神器"."最强大的HT ...
- vagrant 1.8.6 安装过程及总结遇到的坑
下面先总结遇到的问题,这些问题如果你也遇到,可能需要搜索很多次才能找到原因. 如果想看安装过程,可以先直接跳到后面第二部分部分. 1 问题汇总: 1.1 vagrant版本过高问题. vagrant ...
- 安装过程错误[INS-30131]
问题:Oracle Database 安装过程错误[INS-30131] 原因:安装用户没有对临时文件夹的读写权限 解决方案: 1.以管理员身份运行cmd.exe 2.输入命令(需启动Se ...
- TortoiseGIT的安装过程详解
TortoiseGIT简介 TortoiseGIT 是Git版本控制系统的一个免费开源客户端,它是git版本控制的 Windows 扩展.可以使你避免使用枯燥而且不方便的命令行.它完全嵌入 Windo ...
- RabbitMQ 集群安装过程详解
一.安装Erlang 1.rabbitMQ是基于erlang的,所以首先必须配置erlang环境. 从erlang官网下载 otp 18.3.下载链接:http://erlang.org/downlo ...
- JAVA安装过程中出现的“javac不是内部或外部指令”的解决方法
近来重新安装了JAVA,安装过程中出现问题,网上找到解决办法,汇总发布. 解决流程: 1.确定自己的环境变量设置没问题,没有出现遗漏 : . 等情况 (具体环境变量设置百度) 2.环境变量设置后 ,d ...
- LNMP安装过程
LNMP一键安装包是什么? LNMP一键安装包是一个用Linux Shell编写的可以为CentOS/RadHat/Fedora.Debian/Ubuntu/Raspbian/Deepin VPS或独 ...
- hbase 1.1.7在centor6.5安装过程
1.自己安装的最新版一直没成功,换成了1.1.7稳定版的.中间遇到的问题记录下 1) jdk 用的1.7版本的,安装过程省略. 2)下载hbase zip包:https://mirrors.tuna ...
- 2016最新cocoapods安装流程,安装过程中遇到的问题及解决方法
现在的cocoapods与之前比较.有很多不一样的地方.自己试了一试,终于搞定.现在大概纪录一下. 1.首先查看ruby是否是最新版的. ruby是通过rvm安装的所以需要先安装rvm后查看ruby是 ...
随机推荐
- Python爬虫系列-Urllib库详解
Urllib库详解 Python内置的Http请求库: * urllib.request 请求模块 * urllib.error 异常处理模块 * urllib.parse url解析模块 * url ...
- 【Redis】DENIED Redis is running in protected mode
.修改redis服务器的配置文件 vi redis.conf 注释以下绑定的主机地址 # bind 127.0.0.1 .修改redis服务器的参数配置 修改redis的守护进程为no ,不启用 &g ...
- 《linux设备驱动开发详解》笔记——10中断与时钟
10.1 中断与定时器 中断一般有如下类型: 内部中断和外部中断:内部中断来自CPU,例如软件中断指令.溢出.除0错误等:外部中断有外部设备触发 可屏蔽中断和不可屏蔽中断 向量中断和非向量中断,ARM ...
- 【Jenskins】安装与配置
Jenskins教程:http://www.yiibai.com/jenkins/ 一.Jenskins的安装 1.jenskins下载和启动 Jenskins下载地址:https://jenkins ...
- webpack 环境搭建+实现热更新
让我们一起构建一个小的app 为了便于你更好的了解Webpack带来的好处,我们将会构建一个非常小的app并将资源文件打包.在这个教程中我推荐基于Node4或Node5和NPM3来进行开发,这样就避免 ...
- 解读Loadrunner网页细分图(Web Page Diagnostics)
[转载的地址]https://www.cnblogs.com/littlecat15/p/9456376.html 一.启用网页细分图 首先在Controller场景设计运行之前,需要在菜单栏中设置D ...
- 零基础学 HTML5+CSS3 全彩版 明日科技 编著
第1章 基础知识 1.1 HTML概述 1.1.1 什么是HTML 1.1.2 HTML的发展历程 1.2 HTML文件的基本结构 1.2.1 HTML的基本结构 1.2.2 HTML的基本标记 1. ...
- 1章 perl入门
1.标量数据 单变量 数字和字符串两种情况 2.所有数字的内部格式都相同.浮点型 perl中没有应对整数值得运算 . 3.浮点数直接量 数字e表示10的次方标示符 例子:-6.5e ...
- 一个TensorFlow例子
一个TensorFlow的例子 import tensorflow as tf x = tf.constant(1.0, name='input') w = tf.Variable(0.8, name ...
- CF878D D. Magic Breeding bitset
D. Magic Breeding time limit per test 4 seconds memory limit per test 1024 megabytes input standard ...