示例:在d盘,新建文件夹es6,文件夹里新建一个文件es6.js。

(1)先全局安装babel-cli,输入命令npm install babel-cli -g

(2)输入d:( 进入d盘),再输入cd es6(进入es6文件夹)

(3)输入npm init;(引导创建一个package.json文件,包括名称、版本、作者等这些信息)

(4)输入npm install --save-dev babel-cli(安装命令行转码babel-cli工具)

(5)es6文件里新建配置文件.babelrc

在windows系统中,不允许直接右键建立没有文件名的文件,可以通过cmd命令行创建,在当前文件夹打开cmd(shift键+鼠标右键,会有弹框,选择在此处打开命令窗口),并输入命令 type null>.babelrc 创建配置文件.babelrc

       复制代码 { "presets": [], "plugins": [] }到.babelrc 里

(6)输入npm install --save-dev babel-preset-es2015(安装es2015依赖项)

  将“es2015”加入到.babelrc,如{ "presets": [“es2015”], "plugins": [] }

(7)输入babel -h检测是否安装成功;

(8)如果安装成功,就可以将es6编译成es5

例:babel es6.js -o- es5.js

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

es6 babel转码器安装配置及常见命令的更多相关文章

  1. Babel 转码器 § es6转换es5

    Babel 转码器 § es6转换es5 实时转码 /  Repl  -babel-node / babel-register(自动转码引入babel-register模块) 配置文件.babelrc ...

  2. ES6入门一:ES6简介及Babel转码器

    ES6简介 Babel转码器 Nodejs中使用ES6 WebPack中使用ES6及Babel转码插件 一.ES6简介与转码  1.1一个常见的问题,ECMAScript和JavaScript到底是什 ...

  3. ES6标准简介之Babel转码器解说

    ES6是ECMAScript 6的简称,是JavaScript语言的下一代标准,现在基于jquery库的前端开发js所使用的标准是ES5(ECMAScript 5).ES6已于2015年6月正式发布. ...

  4. ES6转ES5(Babel转码器)

    ES6转ES5(Babel转码器) 前提:必须在VScode中已经安装了Node.js 官网:https://nodejs.org/en/ 一.安装命令行转码工具 npm install --glob ...

  5. (Linux环境Kafka集群安装配置及常用命令

    Linux环境Kafka集群安装配置及常用命令 Kafka 消息队列内部实现原理 Kafka架构 一.下载Kafka安装包 二.Kafka安装包的解压 三.设置环境变量 四.配置kafka文件 4.1 ...

  6. 使用babel转码器,让浏览器支持es6语法

    ECMAScript 6.0(以下简称 ES6)是 JavaScript 语言的下一代标准,可是很多浏览器并不支持es6语法,所以我们需要一个转码工具, 把es6的语法转换成浏览器支持的javascr ...

  7. 在项目中ES6语法转ES5语法 babel转码器

    es6 babel 安装以及使用   1,安装好node(需要使用npm包管理工具) 2,在本地项目路径下npm init,格式化成功后会在项目下生成一个配置文件package.json 3,本地安装 ...

  8. babel的使用以及安装配置

    简介 babel是一个广泛使用的转码器,可以将ES6代码转化为ES5代码,从而在现有环境执行,这意味着,你可以现在就用ES6编写程序,而不用担心现有环境是否支持. 安装及配置 npm install  ...

  9. Babel转码器

    Babel是一个广泛使用的ES6转码器,可以将ES6代码转为ES5代码,从而在现有环境执行.这意味着,你可以用ES6的方法 编写程序,又不用担心现在环境是否支持.

随机推荐

  1. WildFly配置gzip压缩

    使用jboss-cli.sh 执行下面的脚本 /subsystem=undertow/configuration=filter/gzip=gzipFilter:add() /subsystem=und ...

  2. windwos API 第七篇 分离路径,组合路径 _splitpath _makepath

    函数原型: //Break a path name into components. void _splitpath( const char *path, char *drive, char *dir ...

  3. WIN32_FIND_DATA 详细结构(附循环读取文件代码)

    //去除路径最后多余的斜杠和反斜杠 std::string TrimPath(std::string path) { //string test3("内容"); 使用引用字符数组作 ...

  4. Sublime text3 代码格式化插件vue

    同事用的windows的sublime轻量级容易上手.我们现在强制eslint规范.我们就需要安装这个格式化代码的插件"html-css-js-prettify" 使用 Subli ...

  5. 分享非常漂亮的WPF界面框架源码及插件化实现原理

      在上文<分享一个非常漂亮的WPF界面框架>中我简单的介绍了一个界面框架,有朋友已经指出了,这个界面框架是基于ModernUI来实现的,在该文我将分享所有的源码,并详细描述如何基于Mod ...

  6. 深入浅出 Java Concurrency (14): 锁机制 part 9 读写锁 (ReentrantReadWriteLock) (2)[转]

    这一节主要是谈谈读写锁的实现. 上一节中提到,ReadWriteLock看起来有两个锁:readLock/writeLock.如果真的是两个锁的话,它们之间又是如何相互影响的呢? 事实上在Reentr ...

  7. [code]图像亮度调整enhancement

    //draft 2013.9 //F=X2/u; ////远处细节被淹没. 亮的地方增亮明显,暗的地方更暗. 不可取. // CvScalar rgb; // rgb=cvAvg(src); //fo ...

  8. Linux时间介绍

    Linux时钟分为系统时钟(System Clock)和硬件(Real Time Clock,简称RTC)时钟.系统时钟是指当前Linux Kernel中的时钟,而硬件时钟则是主板上由电池供电的时钟, ...

  9. hdu 1754 I Hate It (线段树求区间最值)

    HDU1754 I Hate It Time Limit:3000MS     Memory Limit:32768KB     64bit IO Format:%I64d & %I64u D ...

  10. IoT: 物联网安全测试经验总结

    前言 今年早些时候,我参与了许多关于物联网解决方案的安全测试.主要目标是找出体系结构和解决方案中的漏洞.在这篇文章中,我将讨论一些与物联网解决方案的问题和挑战. 什么是物联网? 在你学习有关IPv6的 ...