What's wrong with my babel?

Question

I have installed babel with npm install -g babel-cli and tested it with babel-node --version . The output is 6.2.0.

Then I tested it like below.

C:\Users\xuhang\Documents\work\CDT\cdt3.0\babel>babel-node
> console.log([1,2,3].map(x => x * x))
repl:1
console.log([1, 2, 3].map(x => x * x));
                            ^^
SyntaxError: Unexpected token =>
    at Object.exports.runInThisContext (vm.js:73:16)
    at _eval (C:\Users\xuhang\AppData\Roaming\npm\node_modules\babel-cli\lib\_b
abel-node.js:102:26)
    at REPLServer.replEval (C:\Users\xuhang\AppData\Roaming\npm\node_modules\ba
bel-cli\lib\_babel-node.js:187:14)
    at bound (domain.js:254:14)
    at REPLServer.runBound [as eval] (domain.js:267:12)
    at REPLServer.<anonymous> (repl.js:279:12)
    at REPLServer.emit (events.js:107:17)
    at REPLServer.Interface._onLine (readline.js:214:10)
    at REPLServer.Interface._line (readline.js:553:8)
    at REPLServer.Interface._ttyWrite (readline.js:830:14)
>

Could you tell me what's wrong with console.log([1,2,3].map(x => x * x)) ?

Another simliar issue is below. It's so hard for me to learn babel, the initial test all failed.

What's inside the directory source is the example.js within the official sample provided by React below.

https://facebook.github.io/react/docs/tutorial.html

C:\Users\xuhang\Documents\work\CDT\cdt3.0\babel>babel source/ --watch --out-dir
 build/
SyntaxError: source/example.js: Unexpected token (17:6)
  15 |     var rawMarkup = marked(this.props.children.toString(), {sanitize: tru
e});
  16 |     return (
> 17 |       <div className="comment">
     |       ^
  18 |         <h2 className="commentAuthor">
  19 |           {this.props.author}
  20 |         </h2>

Answer 1

You've forgotten to create a .babelrc file. Pre 6.x version of Babel contained a few presets for Babel to transpile code out of the box, in 6.x it does not so you need to install the presets you want and in your case you need two: babel-preset-es2015 and babel-preset-react .

After you've installed them both npm install babel-preset-es2015 babel-preset-react add them to your .babelrc file

{
    "presets": ["es2015", "react"]
}