Question

我有以下gulp文件：

var paths = {
    all: ['*.js', '**/*.js', 'index.html'],
    js: ['*.js', '**/*.js'],
    html: 'index.html',
    dist: 'dist'
};

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

gulp.task("default", function () {
    gulp.src(paths.html)
        .pipe(gulp.dest(paths.dist));
    return gulp.src(paths.js)
        .pipe(babel())
        .pipe(gulp.dest(paths.dist));
});

gulp.task('watch', function(){
    gulp.watch(paths.all, ['default']);
});

当我运行它时，我收到此错误

 SyntaxError: d:/project_folder/node_modules/gulp-babel/node_modules/gulp-util/node_modules/beeper/index.js: 'return' outside of function (9:1) ...`

我在某处读到我不应该编译依赖项。我没有以下标志就跑了一口气。所以我不知道我是否编译它们。但是gulp似乎很慢，因为它需要几秒钟才能完成第一项任务。如何摆脱这个错误？我是否对依赖项做错了什么？

Answer 1

是的，您当前包含当前目录中的所有.js文件，而不是源目录。您的应用程序代码（假设为app.js）将包括＆＃34;包括＆＃34;使用common js要求的依赖关系，例如：

var request = require('request');

为了实际映射require语句，您需要使用模块加载器或打包器，例如：Browserify或Webpack

以下gulp任务将解决模块错误：

var paths = {
    all: ['./src**/*.js', 'index.html'],
    js: ['./src/**/*.js'],
    html: 'index.html',
    dist: 'dist'
};

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

gulp.task('default', function () {
    gulp.src(paths.html)
        .pipe(gulp.dest(paths.dist));
    return gulp.src(paths.js)
        .pipe(babel())
        .pipe(gulp.dest(paths.dist));
});

gulp.task('watch', function(){
    gulp.watch(paths.all, ['default']);
});

这仅包含.js文件夹中的所有src文件，而不包括**/*.js，其中包含*.js {{}中每个文件夹中的所有node_modules个文件1}}。

关于模块加载：

您可能希望使用加载程序任务捆绑所有客户端代码，而不是仅将其复制到bower_components，例如：

dist

Gulp抛出语法错误，可能编译依赖项

1 个答案: