让nodeJS支持ES6的词法----babel的安装和使用方法


Posted in NodeJs onJuly 31, 2017

要使用Babel, 我们需要nodeJS的环境和npm, 主要安装了nodeJS, npm就默认安装了 , 现在安装nodeJS很简单了, 直接下载安装就好了;

安装es-checker

在使用Babel之前 , 我们要先检测一下当前node对es6的支持情况, 我们使用先es-checker, 命令行下执行:

运行下面代码

npm -g install es-checker

es-checker安装完毕以后, 命令行执行:es-checker , 如下图, 我的node环境版本是v4.4.3, 支持64%哦 :

让nodeJS支持ES6的词法----babel的安装和使用方法

babel的安装

所以我们来安装babel吧, 有了babel, 能够使用更多高级词法!

首先新建一个工作目录, 然后创建一个package.json的文件, 内部内容为:

运行下面代码

{
 "name": "my-project",
 "version": "1.0.0",
 "devDependencies": {
 }
}

然后再打开cmd(命令行), 在工作目录下执行命令安装babel-cli:

运行下面代码

npm --save-dev install babel-cli

再安装一个全局的babel-cli:

运行下面代码

npm -g install babel-cli

接着在工作目录创建一个名字为.babelrc的文件, 文件内容入如下( 要注意window系统下创建这种文件系统会提示你:“必须键入文件名” , 你可以找别的方式去创建, 我是在开发工具的工程目录中把这个文件创建出来的):

运行下面代码

{
  "presets": [
   "es2015"
  ],
  "plugins": []
 }

安装babel-preset-es2015

还是工作目录, 然后再安装babel-preset-es2015:

运行下面代码

npm install --save-dev babel-preset-es2015

到目前为止babel算是安装完毕了:

测试es6代码

创建一个test.js的文件, 8键入内容:

运行下面代码

let [a,b,c] = [1,2,3];
console.log(a,b,c);

在当前目录下执行:

运行下面代码

babel-node test

结果应该是这样的:

让nodeJS支持ES6的词法----babel的安装和使用方法

如果直接用执行node test, 我这边会报异常: SyntaxError: Unexpected token

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

NodeJs 相关文章推荐
nodejs读取memcache示例分享
Jan 02 NodeJs
用nodejs实现PHP的print_r函数代码
Mar 14 NodeJs
使用nodejs开发cli项目实例
Jun 03 NodeJs
Nodejs下DNS缓存问题浅析
Nov 16 NodeJs
Nodejs+Socket.io实现通讯实例代码
Feb 13 NodeJs
Nodejs基于LRU算法实现的缓存处理操作示例
Mar 17 NodeJs
nodejs制作爬虫实现批量下载图片
May 19 NodeJs
详解nodejs实现本地上传图片并预览功能(express4.0+)
Jun 28 NodeJs
windows系统下更新nodejs版本的方案
Nov 24 NodeJs
nodejs之koa2请求示例(GET,POST)
Aug 07 NodeJs
nodejs中用npm初始化来创建package.json的实例讲解
Oct 10 NodeJs
nodejs dgram模块广播+组播的实现示例
Nov 04 NodeJs
浅谈nodejs中的类定义和继承的套路
Jul 26 #NodeJs
nodejs之get/post请求的几种方式小结
Jul 26 #NodeJs
nodejs前端自动化构建环境的搭建
Jul 26 #NodeJs
nodejs body-parser 解析post数据实例
Jul 26 #NodeJs
深入解析nodejs HTTP服务
Jul 25 #NodeJs
NodeJS使用七牛云存储上传文件的方法
Jul 24 #NodeJs
nodejs 搭建简易服务器的图文教程(推荐)
Jul 18 #NodeJs
You might like
PHP中的正规表达式(一)
2006/10/09 PHP
第五章 php数组操作
2011/12/30 PHP
PHP中使用memcache存储session的三种配置方法
2014/04/05 PHP
Yii核心组件AssetManager原理分析
2014/12/02 PHP
PHP如何通过AJAX方式实现登录功能
2015/11/23 PHP
4种Windows系统下Laravel框架的开发环境安装及部署方法详解
2020/04/06 PHP
基于jquery的复制网页内容到WORD的实现代码
2011/02/16 Javascript
最棒的Angular2表格控件
2016/08/10 Javascript
Bootstrap中点击按钮后变灰并显示加载中实例代码
2016/09/23 Javascript
js实现登录验证码
2016/12/22 Javascript
vue 挂载路由到头部导航的方法
2017/11/13 Javascript
JavaScript动态创建二维数组的方法示例
2019/02/01 Javascript
深入理解es6块级作用域的使用
2019/03/28 Javascript
微信JSSDK实现打开摄像头拍照再将相片保存到服务器
2019/11/15 Javascript
TypeScript之调用栈的实现
2019/12/31 Javascript
JS 数组基本用法入门示例解析
2020/01/16 Javascript
JavaScript canvas动画实现时钟效果
2020/02/10 Javascript
vue实现输入框自动跳转功能
2020/05/20 Javascript
python3实现TCP协议的简单服务器和客户端案例(分享)
2017/06/14 Python
Python3 中文文件读写方法
2018/01/23 Python
Python之用户输入的实例
2018/06/22 Python
python3模拟实现xshell远程执行liunx命令的方法
2019/07/12 Python
Django框架之登录后自定义跳转页面的实现方法
2019/07/18 Python
Python 3.8 新功能全解
2019/07/25 Python
浅谈Python中(&,|)和(and,or)之间的区别
2019/08/07 Python
对tensorflow中cifar-10文档的Read操作详解
2020/02/10 Python
Python 将 QQ 好友头像生成祝福语的实现代码
2020/05/03 Python
学点简单的Django之第一个Django程序的实现
2021/02/24 Python
KOHLER科勒美国官网:国际著名卫浴橱柜领先品牌
2020/06/27 全球购物
2014年五四青年节活动策划书
2014/04/22 职场文书
付款承诺函范文
2015/01/21 职场文书
横店影视城导游词
2015/02/06 职场文书
学校禁毒宣传活动总结
2015/05/08 职场文书
2016幼儿园中班开学寄语
2015/12/03 职场文书
假如给我三天光明:舟逆水而行,人遇挫而达 
2019/10/29 职场文书
python实现手机推送 代码也就10行左右
2022/04/12 Python