reactjs - ReferenceError: [BABEL] Unknown option.babelrc.presets while parsing file -


i using babel 6 es2015 , react have added presets property in .babelrc while running gulp in project getting following error.

referenceerror: [babel] c:\sunny\ubuntushare\projects\viewpoint_ui\src\javascript\app-nyi.jsx: unknown option: c:\sunny\ubuntushare\projects\viewpoint_ui\.babelrc.presets while parsing file: c:\sunny\ubuntushare\projects\viewpoint_ui\src\javascript\app-nyi.jsx @ logger.error (c:\sunny\ubuntushare\projects\viewpoint_ui\node_modules\babelify\node_modules\babel-core\lib\transformation\file\logger.js:58:11) @ optionmanager.mergeoptions (c:\sunny\ubuntushare\projects\viewpoint_ui\node_modules\babelify\node_modules\babel-core\lib\transformation\file\options\option-manager.js:126:29) @ optionmanager.addconfig (c:\sunny\ubuntushare\projects\viewpoint_ui\node_modules\babelify\node_modules\babel-core\lib\transformation\file\options\option-manager.js:107:10) @ optionmanager.findconfigs (c:\sunny\ubuntushare\projects\viewpoint_ui\node_modules\babelify\node_modules\babel-core\lib\transformation\file\options\option-manager.js:168:35) @ optionmanager.init (c:\sunny\ubuntushare\projects\viewpoint_ui\node_modules\babelify\node_modules\babel-core\lib\transformation\file\options\option-manager.js:229:12) @ file.initoptions (c:\sunny\ubuntushare\projects\viewpoint_ui\node_modules\babelify\node_modules\babel-core\lib\transformation\file\index.js:147:75) @ new file (c:\sunny\ubuntushare\projects\viewpoint_ui\node_modules\babelify\node_modules\babel-core\lib\transformation\file\index.js:137:22) @ pipeline.transform (c:\sunny\ubuntushare\projects\viewpoint_ui\node_modules\babelify\node_modules\babel-core\lib\transformation\pipeline.js:164:16) @ babelify._flush (c:\sunny\ubuntushare\projects\viewpoint_ui\node_modules\babelify\index.js:28:24) @ babelify.<anonymous> (_stream_transform.js:118:12) 

my .babelrc file is

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

if run babel src -d lib command, works. if run gulp build building error appears.

the gulpfile follows

    'use strict';  var _ = require('lodash'); var gulp = require('gulp'); var webserver = require('gulp-webserver'); var browserify = require('browserify'); var babelify = require('babelify'); var uglify = require('gulp-uglify'); var minify = require('gulp-minify-css'); var sass = require('gulp-sass'); var swig = require('gulp-swig'); var rename = require("gulp-rename"); var noderesolve = require('resolve'); var source = require('vinyl-source-stream'); var del = require('del'); var buffer = require('gulp-buffer'); var concat = require('concat-stream'); var file = require('gulp-file'); var eslint = require('gulp-eslint'); var concatcss = require('gulp-concat-css');  var production = (process.env.node_env === 'production'); function getnpmpackageids() {   // read package.json , dependencies' package ids   var packagemanifest = {};   try {     packagemanifest = require('./package.json');   } catch (e) {     // not have package.json manifest   }   return _.keys(packagemanifest.dependencies) || []; }  gulp.task('lint', function () {   return gulp.src(['./src/javascript/components/**/*.jsx','./src/javascript/actions/*.jsx','./src/javascript/stores/*.jsx','./src/javascript/utilities/*.js'])     // eslint() attaches lint output eslint property     // of file object can used other modules.     .pipe(eslint())     // eslint.format() outputs lint results console.     // alternatively use eslint.formateach() (see docs).     .pipe(eslint.format())     // have process exit error code (1) on     // lint error, return stream , pipe failonerror last.   //.pipe(eslint.failonerror()); });  gulp.task('templates', ['clean'], function () {   gulp.src('./src/htdocs/**/*.html')     .pipe(swig())     .pipe(gulp.dest('./build/')); });  gulp.task('server', function () {   gulp.src('./build')     .pipe(webserver({       host: '0.0.0.0',       port: 8080,       // fallback: 'index.html',       livereload: true,       proxies: [{         source: '/ui',         target: 'http://localhost:8080/'       }]     })); });  gulp.task('sass', ['clean'], function () {   var css = gulp.src('./src/sass/**/*.scss')     .pipe(sass().on('error', sass.logerror));    if (production) { css = css.pipe(minify()); }   css.pipe(gulp.dest('./build/css')); });  gulp.task('sass:watch', function () {   gulp.watch('./src/sass/**/*.scss', ['sass']); });  // main build task gulp.task('build', ['build-vendor', 'build-app', 'uikit', 'sass', 'templates', 'copyfiles']);  gulp.task('build-vendor', function () {   var b = browserify({     // generate source maps in non-production environment     debug: !production   });    // similar thing, npm-managed modules.   // resolve path using 'resolve' module   getnpmpackageids().foreach(function (id) {     b.require(noderesolve.sync(id), { expose: id });   });    var stream = b.bundle().pipe(source('vendor.js'))     .pipe(buffer())     .pipe(gulp.dest('./build'));    if (production) {     stream = stream.pipe(uglify())     .pipe(gulp.dest('./build'));   }   return stream; });  function write(name) {     return concat(function (content) {         // create new vinyl file content , use basename of         // filepath in scope basename.         var f = file(name, content, { src: true });         // uglify content         if (production) {           f = f.pipe(uglify());         }         // write content build directory         f.pipe(gulp.dest('./'));         return f;       });   }  gulp.task('build-app', function () {   var files = ['src/javascript/app.jsx', 'src/javascript/app-2f.jsx', 'src/javascript/app-nyi.jsx'];   var b = browserify(files, {     extensions: ['.jsx'],     debug: !production   });    // exclude npm modules   getnpmpackageids().foreach(function (id) {     b.external(id);   });    b.plugin('factor-bundle', {     outputs: [       write('build/app.js'),       write('build/app-2f.js'),       write('build/app-nyi.js')     ]   });   var stream = b.transform(babelify, {presets: ["react","stage-0","es2015"]}).bundle()     .pipe(source('common.js'))     .pipe(buffer())     .pipe(gulp.dest('./build/'));    if (production) {     stream = stream.pipe(uglify())     .pipe(gulp.dest('./build'));   }   return stream; });  gulp.task('clean', function (cb) {   del([     'build/**/*.*'   ], cb); });  gulp.task('uikit', ['clean'], function () {   gulp.src([(production ? './node_modules/': '../') + 'osstools_uikit/assets/css/screen.css', './node_modules/react-widgets/dist/css/react-widgets.css', './node_modules/rc-slider/assets/index.css', './node_modules/react-bootstrap-table/css/react-bootstrap-table-all.css'])   .pipe(concatcss('osstools_uikit.css', {rebaseurls:false}))   .pipe(gulp.dest('./build/css')); });  gulp.task('copyfiles', ['clean'], function () {   gulp.src((production ? './node_modules/' : '../') + 'osstools_uikit/assets/images/**/*')   .pipe(gulp.dest('./build/css/images/'));   gulp.src(['./node_modules/react-widgets/dist/fonts/*', (production ? './node_modules/' : '../') + 'osstools_uikit/assets/fonts/**/*'])   .pipe(gulp.dest('./build/fonts/')); });  gulp.task('watch', ['build-vendor', 'build-app', 'uikit', 'sass', 'templates', 'copyfiles'], function () {   gulp.watch('./src/javascript/components/**/*.jsx', ['build']);   gulp.watch('./src/javascript/stores/*.jsx', ['build']);   gulp.watch('./src/javascript/actions/*.jsx', ['build']);   gulp.watch('./src/javascript/utilities/*.js', ['build']);   gulp.watch('./src/sass/**/*.scss', ['sass']);   gulp.watch('./src/htdocs/**/*.html', ['templates']); });  gulp.task('default', ['build', 'server', 'watch']); 


Comments

Popular posts from this blog

magento2 - Magento 2 admin grid add filter to collection -

Android volley - avoid multiple requests of the same kind to the server? -

Combining PHP Registration and Login into one class with multiple functions in one PHP file -