ES6学习--搭建环境
ECMAScript 6(以下简称ES6)是JavaScript语言的下一代标准,已经在2015年6月正式发布了。它的目标,是使得JavaScript语言可以用来编写复杂的大型应用程序,成为企业级开发语言。
学习ES6之前,我们可以先来看一下各大浏览器的最新版本对ES6的支持,点击这里
我们可以使用以下几种环境去学习ES6
使用最新版本的Chrome或者Chromium
来说一下在Ubuntu下,如何升级到最新的Chromium,需要执行如下命令即可。
sudo add-apt-repository ppa:chromium-daily
sudo apt-get update
sudo apt-get install chromium-browser
然后需要开启对ES6的支持,访问chrome://flags/#enable-javascript-harmony页面,开启这个特性。
然后你就可以在Chromium的console中使用ES6了。
使用Node.js
建议更新到Node的最新版本,或者最新的稳定版本,这样Node对ES6的支持可能会多一些。
我使用的是n,命令入下:
// 全局安装n
sudo npm install -g n
// 安装制定版本
n 5.6.0
// 安装最新的版本
n latest
// 安装稳定版本
n stable
// 删除某个版本
n rm 5.6.0
// 以指定的版本来执行脚本
n use 5.6.0 some.js
我安装了稳定版本,当前是5.6.0
可以使用如下命令查看当前版本的Node对ES6的支持
node --v8-options | grep harmony
使用的时候只需要带上--harmony参数
node --harmony
node --harmony test.js
使用Babel
Babel是一个广泛使用的ES6转码器,可以将ES6代码转为ES5代码,从而在现有环境执行。这意味着,你可以用ES6的方式编写程序,又不用担心现有环境是否支持。
如何安装Babel我就简单举一个例子。以一个test项目为例。
先创建test文件夹,然后在该文件夹下执行npm init,初始化package.json文件,然后修改为如下的内容:
{
"name": "test",
"version": "1.0.0",
"description": "A babel test project",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"build": "babel src -d lib"
},
"author": "HarrySun",
"license": "MIT",
"devDependencies": {
"babel-cli": "^6.6.4",
"babel-preset-es2015": "^6.6.0"
}
}
其中scripts中的build命令,是指将src下的文件夹里的es6的js文件转化成es5的js文件。
然后执行一下npm install,安装babel-cli和babel-preset-es2015包。
最后创建一下.babelrc配置文件,命令如下:
echo '{ "presets": ["es2015"] }' > .babelrc
这个项目的例子,请点击这里
给一个官网地址,大家可以根据不同的环境就自己的需求选择。Babel Setup
ES6学习--搭建环境的更多相关文章
- ES6学习之环境配置
环境配置 一.建立工程目录 新建dist文件夹(用于存放转化的es5文件).新建src文件夹(用于存放es6文件),在该文件夹下建立index.js文件 二.编写index.html 在根目录下新建i ...
- maven学习-搭建环境
1.Maven是基于项目对象模型(POM),可以通过一小段描述信息来管理项目的构建,报告和文档的软件项目管理工具. 2.下载: maven.apache.org 3.bin目录包含mvn的运行脚本: ...
- ES6的开发环境搭建
在搭建es6开发环境之前,先简单介绍一下es6. ECMAScript 6.0(以下简称 ES6)是 JavaScript 语言的下一代标准,已经在2015年6月正式发布了.它的目标,是使得 Java ...
- 一.ES6的开发环境搭建
前言: 现在的Chrome浏览器已经支持ES6了,但是有些低版本的浏览器还是不支持ES6的语法,这就需要我们把ES6的语法自动的转变成ES5的语法.Webpack是有自动编译转换能力的,除了Webpa ...
- AspectJ基础学习之二搭建环境(转载)
AspectJ基础学习之二搭建环境(转载) 一.下载Aspectj以及AJDT 上一章已经列出了他的官方网站,自己上去download吧.AJDT是一个eclipse插件,开发aspectj必装,他可 ...
- springMVC学习篇 - 搭建环境及关键点
springMVC是spring家族中一个重要的组件,和struts一样作为一套前台框架被广泛的应用于各种项目. 之前在很多项目组都用到springMVC,只感觉很强大,但是对这套框架的知识了解比较少 ...
- 深度学习开发环境搭建教程(Mac篇)
本文将指导你如何在自己的Mac上部署Theano + Keras的深度学习开发环境. 如果你的Mac不自带NVIDIA的独立显卡(例如15寸以下或者17年新款的Macbook.具体可以在"关 ...
- ubuntu16.04系统深度学习开发环境、常用软件环境(如vscode、wine QQ、 360wifi驱动(第三代暂无))搭建相关资料
事后补充比较全面的(找对资料真的省一半功夫):https://www.jianshu.com/p/5b708817f5d8?from=groupmessage Ubuntu16.04 + 1080Ti ...
- pyqt4学习之一:搭建环境和入门
还在继续写Python小工具,想起之前用Tkinter被坑得半死,决定换个框架写UI,又想顺便了解一下qt,就学习一下pyqt4 搭建环境 win:现在安装包 http://www.riverbank ...
随机推荐
- sublime text 插件(前端自用)
一.软件安装 ST中文论坛:http://sublimetext.iaixue.com/ 或者 http://sublimetext.iaixue.com/dl/#sublime_text_3103 ...
- 紫書_例5-10 UVa207
細節較多,自己寫的第一份半殘品,未能AC,后參考了劉老師的代碼,寫出了第二份的代碼,經過多次修改后總算AC,然而後果也很嚴重,導致代碼和劉老師極其相似,這也是我不喜歡看了參考代碼后再自己寫的緣故. 祇 ...
- [LintCode] Container With Most Water 装最多水的容器
Given n non-negative integers a1, a2, ..., an, where each represents a point at coordinate (i, ai). ...
- eclipse版本发展历史
Eclipse百科 https://zh.wikipedia.org/wiki/Eclipse # 中文维基百科 http://baike.baidu.com/subview/23576 ...
- backbone入门示例
最近因为有个项目需要用backbone+mui 所以最近入坑backbone. Backbonejs有几个重要的概念,先介绍一下:Model,Collection,View,Router.其中Mod ...
- dos清除缓存
ipconfig /flushdns ,DNS缓存就被清除了. ipconfig /displaydns查看DNS缓存
- 解决word2013图片不能替换
有时我们下好文档时,想要替换里面的图片,右键时却发现没有替换图片这个选项 这是应为此时我们的文档处于兼容模式,我们可以把它另存为.docx格式,这是再右键便可发现,多了一个替换图片选项.
- VS 默认开发环境如何更改
话不多说,直接上图
- 自定义cell右侧 多按钮
#import "ViewController.h" @interface ViewController () <UITableViewDataSource, UITable ...
- 性能分析工具-PerfView
Roslyn的PM(程序经理) Bill Chiles,Roslyn使用纯托管代码开发,但性能超过之前使用C++编写的原生实现,这有什么秘诀呢?他最近写了一篇文章叫做<Essential Per ...