Why do I get a `Unknown option: .babelrc.presets` error when trying to transpile my code using babel-cli v6?

Question

I have this in my package.json:

"devDependencies": {
  ...
  "babel-cli": "^6.8.0",
  "babel-core": "^6.8.0",
  "babel-preset-es2015": "^6.6.0",
  "babel-preset-react": "^6.5.0",
  "babel-preset-stage-2": "^6.5.0",
  ...
}

And this in my .babelrc:

{
  "presets": [
    "react",
    "es2015",
    "stage-2"
  ]
}

When running babel --source-maps=true --out-dir=lib src I get this:

$ ./node_modules/.bin/babel --source-maps=true --out-dir=lib src

ReferenceError: [BABEL] src/main.js: Unknown option: /dev/my-project/.babelrc.presets

I have babel-cli 6, so why doesn't it recognize .babelrc.presets?

Answer 1

Answering my own question because I was trying to solve this for a while and I thought it might be helpful for others:

The problem was a known npm v3 bug. Unlike npm v2, npm v3 will flatten the dependency tree, so there was a deep dependency in my project that was including babel v5 and npm was linking the binary to my ./node_modules/.bin directory, overwriting the binary coming from my devDependency ("babel-cli": "^6.8.0").

The fix is to rebuild this package once npm install has finished. You should add this to your package.json:

"scripts": {
  ...
  "postinstall": "npm rebuild babel-cli",
  ...
}