让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的前后端分离的思考与实践(一)全栈式开发
Sep 26 NodeJs
nodejs开发微博实例
Mar 25 NodeJs
nodejs通过phantomjs实现下载网页
May 04 NodeJs
nodeJs爬虫获取数据简单实现代码
Mar 29 NodeJs
nodejs基础应用
Feb 03 NodeJs
NodeJS基础API搭建服务器详细过程记录
Apr 01 NodeJs
NodeJs的fs读写删除移动监听
Apr 28 NodeJs
nodejs模块学习之connect解析
Jul 05 NodeJs
nodejs基于mssql模块连接sqlserver数据库的简单封装操作示例
Jan 05 NodeJs
nodejs使用async模块同步执行的方法
Mar 02 NodeJs
基于nodejs的微信JS-SDK简单应用实现
May 21 NodeJs
nodejs利用readline提示输入内容实例代码
Jul 15 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/11/25 PHP
destoon实现调用热门关键字的方法
2014/07/15 PHP
php获取url参数方法总结
2014/11/13 PHP
PHP 正则表达式小结
2015/02/12 PHP
使用PHP接受文件并获得其后缀名的方法
2015/08/05 PHP
PHP7 字符串处理机制修改
2021/03/09 PHP
jquery.boxy弹出框(后隔N秒后自动隐藏/自动跳转)
2013/01/15 Javascript
jQuery实现的Div窗口震动特效
2014/06/09 Javascript
简介JavaScript中toUpperCase()方法的使用
2015/06/06 Javascript
jQuery实现向下滑出的二级菜单效果实例
2015/08/22 Javascript
ionic开发中点击input时键盘自动弹出
2016/12/23 Javascript
jquery实现页面加载效果
2017/02/21 Javascript
JavaScript设计模式之原型模式分析【ES5与ES6】
2018/07/26 Javascript
微信小程序学习笔记之函数定义、页面渲染图文详解
2019/03/28 Javascript
简单了解Javscript中兄弟ifream的方法调用
2019/06/17 Javascript
Vue.js中provide/inject实现响应式数据更新的方法示例
2019/10/16 Javascript
nest.js 使用express需要提供多个静态目录的操作方法
2019/10/24 Javascript
Vue使用预渲染代替SSR的方法
2020/07/02 Javascript
javascript递归函数定义和用法示例分析
2020/07/22 Javascript
详解三种方式在React中解决绑定this的作用域问题并传参
2020/08/18 Javascript
[02:09]2018DOTA2亚洲邀请赛TNC赛前采访
2018/04/04 DOTA
Python3.6安装及引入Requests库的实现方法
2018/01/24 Python
使用 Python 实现微信群友统计器的思路详解
2018/09/26 Python
Python清空文件并替换内容的实例
2018/10/22 Python
Python3 log10()函数简单用法
2019/02/19 Python
Python文件打开方式实例详解【a、a+、r+、w+区别】
2019/03/30 Python
Python中遍历列表的方法总结
2019/06/27 Python
python+selenium定时爬取丁香园的新型冠状病毒数据并制作出类似的地图(部署到云服务器)
2020/02/09 Python
Django 自定义404 500等错误页面的实现
2020/03/08 Python
html5实现的便签特效(实战分享)
2013/11/29 HTML / CSS
法学个人求职信范文
2014/01/27 职场文书
小学生纪念九一八事变演讲稿
2014/09/14 职场文书
个人事迹材料范文
2014/12/29 职场文书
居住证明范文
2015/06/17 职场文书
护士工作心得体会
2016/01/25 职场文书
zabbix agent2 监控oracle数据库的方法
2021/05/13 Oracle