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 ...
随机推荐
- niginx 负载均衡
下面是Nginx安装 直接yum install nginx不行,要先处理下源,下面是安装完整流程,十分简单: 1.CentOS 6,先执行:rpm -ivh http://nginx.org/pac ...
- HOW TO RUN A SPRINT PLANNING MEETING (THE WAY I LIKE IT)
This is a sample agenda for a sprint planning meeting. Depending on your context you will have to ch ...
- jquery中focus()失效怎么解决
又学到一个新的知识! 今天在写表单验证的时候遇到一个关于获取焦点的focus()问题. 场景说明:在验证密码输入格式不对之后,弹出alert()提示框,提示密码不对,请重新输入.同时清空密码框并获得焦 ...
- 自定义 TableViewCell 的分割线
刚开始自定义 tableViewCell 的时候,用的是直接在 cell 上加一张 imageView 的方法,如果在点击 cell 的时候有页面的跳转,这样做没什么问题,但是,如果在点击 cell ...
- 【Beta】Daily Scrum Meeting第一次
1.任务进度 学号 已完成 接下去要做 502 更换网络框架为okHttp 搭建好PHP单元测试环境,写出PHP测试的demo 509 PHP的login返回值:插入数据改为单行插入:系负责人更新单行 ...
- Search a 2D Matrix
Write an efficient algorithm that searches for a value in an m x n matrix. This matrix has the follo ...
- asp.net 基礎部分一
过程: 客户端像服务器发送一个请求,iis服务器接收到请求的数据,并且将数据交给c#程序进行处理,并且对数据库进行操作,并且将处理到的结果响应给浏览器客户端 过程2:第一次浏览器请求,后端应该发一个表 ...
- 一鼓作气 博客--第六篇 note6
1.无论公司付给你多少,你的青春都是廉价的!! 2.通往财富自由之路 --得到APP 3.time 3.1 time.time() t = time.time() print(t) #--->1 ...
- 测试函数用Return 返回值和用函数名返回值的区别
'*************************************************************************'**模 块 名:工程1 - Form1'**说 ...
- sql字符串分组
create function f_myWord(@s varchar(50)) returns varchar(50) as begin declare @i int set @i=1 while ...