在最新版Node中使用ES6语法-2019-03-27

描述

node中使用ES6语法,很简单,网上的文章写的太复杂,我根据网上的经验折腾了一下午,最后终结了下,几乎装个babel就能用的。
下面是我的使用过程,分享如何使用及遇到的问题。

配置环境

首先的有node环境,这个不介绍,当前我的版本是8.11.4
1.初始化

npm init -y

2.安装babel
安装官网上介绍的操作就行,https://www.babeljs.cn/

npm install --save-dev babel-cli babel-preset-env

创建 .babelrc 文件

{
  "presets": ["env"]
}

这时候已经配置完了,可以执行ES6语法了,但是importexport还是不支持的。

检测对es6的支持情况

安装es-checker来帮助我们查看对es6的支持情况。

npm install --save-dev es-checker

借助npx工具来运行es-checker

npx的介绍可以看这篇文章:
http://www.ruanyifeng.com/blo…

npx es-checker

结果如下:


ECMAScript 6 Feature Detection (v1.4.1)

Variables
  √ let and const
  √ TDZ error for too-early access of let or const declarations
  √ Redefinition of const declarations not allowed
  √ destructuring assignments/declarations for arrays and objects
  √ ... operator

...省略内容

Module
  × Module export command
  × Module import command


=========================================
Passes 39 feature Detections
Your runtime supports 92% of ECMAScript 6
=========================================

可以看到还是有一些不支持的。

测试code

.babelrc

{
  "presets": ["env"]
}

上面的配置其实就行了;但是我在看babel的文档时说设置node环境需要设置targets,于是我的配置如下,但是我试了上面的配置也是可以的,下面的仅供参考。

{
  "presets": [
    [
      "env",
      {
        "targets": {
          "node": "current"
        }
      }
    ]
  ]
}

package.json

{
  "name": "node",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "keywords": [],
  "author": "",
  "license": "ISC",
  "devDependencies": {
    "babel-cli": "^6.26.0",
    "babel-preset-env": "^1.7.0",
    "es-checker": "^1.4.1"
  }
}

Stack.js

const Stack = (function() {
  const items = new WeakMap();
  class Stack {
    constructor() {
      items.set(this, []);
    }
    push(value) {
      let stack = items.get(this);
      stack.push(value);
    }
    pop() {
      let stack = items.get(this);
      return stack.pop();
    }
    isEmpty() {
      let stack = items.get(this);
      return stack.length === 0;
    }
    size() {
      let stack = items.get(this);
      return stack.length;
    }
    print() {
      let stack = items.get(this);
      console.log(stack.toString());
    }
  }
  return Stack;
})();
module.exports.Stack = Stack;

index.js

const { Stack } = require("./Stack.js");
//import { Stack } from "./Stack";
let stack = new Stack();
stack.push("aaa");
stack.print();

在控制台中执行

node index.js

输出

aaa

解决import和export不能用

其实node版本9以上就已经支持了,但是需要把文件名改成*.mjs,并且加上--experimental-modules 选项。

升级node

介绍一个node升级的好工具,名字就叫n,具体可以去npm上查看。

npm install -g n

执行如下命令进行升级

n stable
或
n 10.15.3

结果

     install : node-v11.12.0
       mkdir : /usr/local/n/versions/node/11.12.0
       fetch : https://nodejs.org/dist/v11.12.0/node-v11.12.0-darwin-x64.tar.gz
######################################################################## 100.0%
   installed : v11.12.0

升级成功后,①把文件都改成*.mjs,②并把代码改成importexport的方式,执行

node --experimental-modules arithmetic/index.mjs 

上面两步都不能少。不然就执行不成功。

    原文作者:code_sir
    原文地址: https://segmentfault.com/a/1190000018677932
    本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系博主进行删除。
点赞