ES6学习--搭建环境

时间：2021-10-29 18:34:25

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的支持可能会多一些。

升级Node可以使用nvm或者n等版本管理工具。

我使用的是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

相关文章