Error: Couldn't find preset “es2015” relative

Question

I get the following error when trying to use gulp-babel:

Error: Couldn't find preset "es2015" relative to directory "/Users/username"

I have the es2015 preset installed globally and locally so can't see why this would be an issue.

Below is my gulp set up and package.json.

var babel = require('gulp-babel');
var es2015 = require('babel-preset-es2015');

gulp.task('babel', function() {
    return gulp.src('./app/main.js')
    .pipe(babel({
        presets: [es2015]
    }))
    .pipe(gulp.dest('dist'));
});

Package.json

  "devDependencies": {
    "babel-preset-es2015": "^6.3.13",
    "babel-preset-es2015-node5": "^1.1.1",
    "browser-sync": "^2.11.0",
    "gulp": "^3.9.0",
    "gulp-babel": "^6.1.1",
    "gulp-stylus": "^2.2.0"
  }

I am using node v5.1.0 and babel v6.4.0

Here is the terminal ouput

terminal output

Answer 1

I encountered the same issue and it was because I had a .babelrc file in the root of my directory.

To fix this add babelrc: false inside the babel options:

var babel = require('gulp-babel');

gulp.task('babel', function() {
    return gulp.src('./app/main.js')
    .pipe(babel({
        babelrc: false,
        presets: ['babel-preset-es2015']
    }))
    .pipe(gulp.dest('dist'));
});

Answer 2

The situation where I encounter this problem is that I have moved the files from xxx to xxx/server. And then under xxx/server I will see the Error: Couldn't find preset "es2015" relative to directory "/Users/username/xxx" error. The real reason is that I have forgotten to move that .babelrc file under xxx. And after I move that .babelrc to xxx/server, the error goes away.

Answer 3

I just had a really weird one. I installed all the babel tools with one big long npm install command, and everything installed without errors... except it was throwing the error documented in this thread, at runtime.

I noticed the version was 0.0.0 in the package.json file, so I ran npm install --save-dev babel-preset-es2015 again and it worked and placed a SECOND key into my package.json file:

   "devDependencies": {
     "babel-cli": "^6.24.1",
     "babel-core": "^6.24.1",
     "babel-polyfill": "^6.23.0",
     "babel-preset-es2015": "^6.24.1",
     "babel-preset-es2015": "0.0.0",
     "babel-preset-stage-2": "^6.24.1",
     "eslint": "^3.19.0"
   }

I just removed the botched entry and it cleared up this relative to directory error.

Answer 4

To fix this issue You should remove .babelrc (hidden) file from "/Users/username" directory.

Answer 5

I had the same issue, and this second suggestion helped me noticing my problem and maybe it's yours too.

I npm install gulp-babel-es2015 then didn't include it in the gulpfile at all.

Then babel({presets: ['es2015']}) option is just a string as shown in the examples here https://www.npmjs.com/package/gulp-babel .

Here is my gulpfile.

var gulp = require('gulp'),
    babel = require('gulp-babel');

gulp.task('babelify', () => {
    gulp.src('js/*.js')
        .pipe(babel({
            presets: ['es2015']
        }))
    .pipe(gulp.dest('alljs'));
});

gulp.task('default', ['babelify']);

Also, as from this issue here, https://github.com/laravel/elixir/issues/354

Suggestions are you should update node to version 5.x.x and npm to 3.x.x.

Answer 6

Babel 7 update

From the docs you should now use @babel/preset-env instead of any other preset mention

The "env" preset has been out for more than a year now, and completely replaces some of the presets we've had/suggested earlier.

• babel-preset-es2015
• babel-preset-es2016
• babel-preset-es2017
• babel-preset-latest
• A combination of the above ^

yarn add @babel/preset-env

or

npm install @babel/preset-env