如何设置节点环境以运行涉及语法的 ES6 代码，如`import ... from ...`？答案

【问题标题】：How to setup node environment to run ES6 codes involving syntax like `import ... from ...`?如何设置节点环境以运行涉及语法的 ES6 代码，如`import ... from ...`？
【发布时间】：2016-07-06 14:03:17
【问题描述】：

我想基于 source code here 运行以下代码，其中包含一些 ES6 语法，例如 import ... from ...：

import rgb from "./rgb";
import array from "./array";
import date from "./date";
import number from "./number";
import object from "./object";
import string from "./string";
import constant from "./constant";

var interpolateValue = function(a, b) {
// set var t and c
  var t = typeof b, c;

// if b is null or t is type boolean, 
  return b == null || t === "boolean" ? constant(b)
      : (t === "number" ? number
      : t === "string" ? ((c = color(b)) ? (b = c, rgb) : string)
      : b instanceof color ? rgb
      : b instanceof Date ? date
      : Array.isArray(b) ? array
      : isNaN(b) ? object
         // (a,b) is 2 function args
      : number)(a, b);
}

console.log(interpolateValue("foo", "bar")(0.5));

我尝试在以d3.js 作为依赖项的节点项目中运行此代码。但是，我在控制台中收到以下指向 import 的错误：

SyntaxError: Unexpected reserved word
    at exports.runInThisContext (vm.js:53:16)
    at Module._compile (module.js:373:25)
    at Object.Module._extensions..js (module.js:416:10)
    at Module.load (module.js:343:32)
    at Function.Module._load (module.js:300:12)
    at Function.Module.runMain (module.js:441:10)
    at startup (node.js:139:18)
    at node.js:968:3

我的问题：

如何逐步设置节点环境以运行具有 ES6 语法的代码？

在第一个答案的帮助下，我设法设置环境运行成功（详情可以在第二个解决方案中找到），但是编译速度似乎很慢。有谁知道为什么？

谢谢！

【问题讨论】：

你弄明白了吗？
好的，谢谢。但我又加了第二个问题，但我不确定把它们放在一起是否合适。

标签： javascript node.js d3.js babeljs

【解决方案1】：

是的，你需要 babel。您是否在此处查看过文档： https://babeljs.io/docs/setup/#installation

$ npm install --save-dev babel-core

然后：

require("babel-core").transform("code", options);

然后确保你已经设置了你的 .babelrc 文件：

{
  "presets": ["es2015"]
}

希望有帮助！

【讨论】：

@Kenny 这里很重要的一点是，对于现代 nodejs 版本，您不需要完整的 es2015 预设，这是一种矫枉过正。
@zerkms 这是一个很好的观点。你在真正不需要的地方增加了额外的开销！
感谢@zerkms，稍后我会尝试看看这种过度杀伤是否会导致性能下降。
@zerkms，我尝试卸载babel-preset-es2015，但出现错误error: Couldn't find preset "es2015" relative to directory "/Users/Na...。当您说“您不需要完整的 es2015 预设”时，您的意思是我可以卸载 babel-preset-es2015 还是您的意思是别的？
@Kenny 我的意思是 - 你根本不需要安装它。不确定您是如何“安装”它的，但通常您需要做的只是将其从 package.json 中删除并删除整个 node_modules。

【解决方案2】：

正如@abigwonderful 指出的那样，babel 站点提供了设置环境以将 ES6 代码转换为 ES5 的方法。以下是我现在觉得很舒服的解决方案。

创建一个目录并在其终端运行npm init；
在此目录的终端中移动 npm install --save-dev PackageName 以获取以下软件包：browserify、babel-cli、babelify、babel-preset-es2015；
运行npm install --save d3;
运行echo '{ "presets": ["es2015"] }' > .babelrc;
现在，env 已经全部设置好了。当您的scritp.js 准备就绪时，在终端中运行./node_modules/.bin/babel-node script.js

看起来很慢，因为brackets 警告说项目中有超过 30,000 个文件，它的一些功能将被禁用。也许出于类似的原因，上面的这种方法有效，但对我来说似乎很慢。有谁知道为什么以及如何解决它？

谢谢！

【讨论】：