Question

我安装了npm（v4.4.4）和babel（v6.24.0）以及babel预设2015。在将ES6 JS转换为ES5时，所有运行正常......除了几个奇怪之外。也许有人可以看出这个新手做错了什么。

1）我从npm运行babel（见下文）运行正常。我在package.JSON中添加了一些脚本条目以使其工作。但是，UNWANTED奇怪... npm将命令插入到输出JS文件中。（见下文）是否有npm选项说明，不要将命令放在输出文件中。

然而......如果我将input.JS复制到babel.cmd文件夹并在那里运行，我会得到一个干净的输出.JS。所以看起来npm是将命令行插入到output.js文件中。如何防止将npm命令写入output.js。（显然我不希望我的JS文件必须与.bin文件共享一个文件夹）

2）当我输入＆gt;在我的项目文件夹的命令行上，我得到：巴贝尔：不是命令。

我期待这一点。毕竟，我还没有将node_modules / .bin添加到我的PATH env var中。然而，我观看的关于npm和babel的每一个YouTube视频都有效。怎么样？似乎没有人编辑PATH env var。我错过了什么吗？

由于米尔顿。

INPUT JS FILE（input.js）

class House {
constructor(v) {
        this.name = v;
}
}

OUTPUT JS（TRANSPILED）FILE（output.js）注意下面的第2行......

> milton@1.0.0 babel C:\Projects1\01InstallReact4Dev
> babel.cmd "--presets" "es2015" "input.js"

"use strict";

function _classCallCheck(instance, Constructor) 
{ if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
var House = function House(v) {
  _classCallCheck(this, House);
  this.name = v;
};

的package.json

"scripts": {
"babel": "babel.cmd",
"babelv": "babel.cmd -V",
"babelh": "babel.cmd -help"
}

COMMAND

> npm run babel -- --presets es2015 input.js > output.js

再次感谢。米尔顿。

Answer 1

您正在将stdout的输出重定向到文件import Bar from './Bar.jsx'; export default class Foo extends Component { render() { return ( <Bar /> ); } }，这包括显示的所有内容。您可以使用output.js或--out-file选项，而不是使用babel的stdout输出。这会将输出写入指定的文件，而不是将其打印到stdout（参见Compile Files）。

你的命令是：

-o

当我输入＆gt;在我的项目文件夹的命令行上，我得到：babel：不是命令。

你的shell PATH中没有npm run babel -- --presets es2015 input.js --out-file output.js。您可以添加它或直接使用node_modules/.bin/运行它。但是如果你在npm脚本中执行它，则没有必要这样做，因为npm会自动查看./node_modules/.bin/babel，而不会在你的PATH中。在这种情况下，您可以定义以下脚本：

node_modules/.bin/

然后你可以简单地运行：

"scripts": {
  "build": "babel --presets es2015 input.js --out-file output.js"
}

如果您想要转换多个文件，则应使用npm run build而不是--out-dir，否则它们将被连接到一个文件中。另请参阅Compile Directories

npm babel ES2015：在转换/输出JS文件中获取命令行

1 个答案: