Использования Gulp с Вавилонской ошибкой для импорта

Question

Я хочу использовать столпотворение для компиляции кода ES6 Я попытался с помощью одной простого файла (маршруты/users.js) как следующего

import express from 'express'; 
var router = express.Router(); 

/* GET users listing. */ 
router.get('/', (req, res, next) => { 
    res.send('respond with a resource'); 
}); 

export default router; 

Я добавил к глотке файл следующие

gulp.task('esconverter',() => { 
    return gulp.src('routes/users.js') 
     .pipe(babel({ 
      presets: ['es2015'] 
     })) 
     .pipe(gulp.dest('dist')); 
}); 

Я добавил задание по умолчанию

gulp.task('default', ['esconverter' ,'nodemon'],() => { 
    console.log("Done"); 
}); 

когда я бегу он (gulp.js) я получил следующее сообщение об ошибке

/Users/i0/Webs/blog10/bl/routes/users.js:1 
(function (exports, require, module, __filename, __dirname) { import express from 'express'; 
                   ^^^^^^ 
SyntaxError: Unexpected token import 
    at Object.exports.runInThisContext (vm.js:76:16) 

Я вижу в Dist/users.js папку, создавшего файл, который был создан

'use strict'; 

Object.defineProperty(exports, "__esModule", { 
    value: true 
}); 

var _express = require('express'); 

var _express2 = _interopRequireDefault(_express); 

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } 

var router = _express2.default.Router(); 

/* GET users listing. */ 
router.get('/', function (req, res, next) { 
    res.send('respond with a resource'); 
}); 

exports.default = router; 

Как я могу решить эту проблему ?

обновление

Это моя структура проекта: Точка стартера проекта в бен/WWW экспресса в app.js в корне

в дополнении I изменил мой файл gulp на это и по-прежнему та же ошибка :(

var gulp = require('gulp'); 
var browserSync = require('browser-sync'); 
var nodemon = require('gulp-nodemon'); 
const babel = require('gulp-babel'); 

gulp.task('browser-sync', ['nodemon'],() => { 
    browserSync.init(null, { 
     proxy: { 
      target: "http://localhost:4000", 
      ws: true 
     }, 
     files: ["public/**/*.*"], 
    }); 
}); 



gulp.task('esconverter',() => { 
    return gulp.src(['bin/www', 'routes/users.js', 'routes/index.js']) 
     .pipe(babel({ 
      presets: ['es2015'] 
     })) 
     .pipe(gulp.dest('dist')); 
}); 


gulp.task('nodemon', cb => { 
    let started = false; 

    return nodemon({ 
     script: 'dist/www' 
     //script: 'bin/www' 
    }).on('start',() => { 
     // to avoid nodemon being started multiple times 
     if (!started) { 
      cb(); 
      started = true; 
     } 
    }); 
}); 

gulp.task('default', ['nodemon','esconverter' ],() => { 
    console.log("Done"); 
}); 

обновление 2

Стараюсь также с помощью следующего кода

gulp.task('esconverter',() => { 
    return gulp.src(['./**/*.js', '!./node_modules{,/**}', './gulpfile.js', 'bin/www','!./dist']) 
     .pipe(babel({ 
      presets: ['es2015'] 
     })) 
     .pipe(gulp.dest('dist')); 
}); 

которые создают следующую DIST папку и все та же ошибка выше

Answer 1

Вы должны запустить столпотворение в вашей всей базе кода и убедитесь, что вы используете узел в скомпилированном основном файле.

Если у вас есть index.js файл, вы должны изменить свою задачу что-то вроде этого:

gulp.task('esconverter',() => { 
    return gulp.src(['index.js', 'routes/users.js']) 
     .pipe(babel({ 
      presets: ['es2015'] 
     })) 
     .pipe(gulp.dest('dist')); 
}); 

И вы должны запустить node dist/index.js.

---

Обновление на основе обновления исходного кода:

Если переместить все исходные файлы в папку src, вы можете иметь свою задачу так:

gulp.task('esconverter',() => { 
    return gulp.src(['./src/**/*.js', './src/**/*.json', './src/**/www']) 
     .pipe(babel({ 
      presets: ['es2015'] 
     })) 
     .pipe(gulp.dest('dist')); 
}); 

и в вашем nodemon вы указываете на: 'dist/bin/www'.

Важная часть здесь состоит в том, чтобы сохранить одну и ту же файловую структуру внутри папки dist, имеющейся в вашем источнике, в противном случае требуемые пути не удастся.