放入main.js的连接文件只是保持堆叠而不是清除文件然后添加代码

时间:2015-06-06 21:11:13

标签: javascript gulp gulp-concat

我试图将我的所有脚本编译成单个main.js文件,然后我可以将其链接到我的索引文件。问题是我的所有脚本文件都被连接在一起,然后添加main.js文件,所以如果我保存3次,我基本上会有3个副本连接并放入我的所有脚本在main.js文件中。

我想在每次保存时删除main.js文件,然后运行连接,或者只是在添加内容之前清理文件。现在,如果我尝试使用del模块删除文件,则会收到一条错误消息,指出我无法在不强制执行此操作的情况下将文件从工作目录中删除。如果可能的话,我想避免强迫这一点。

我觉得必须有更优雅的方式来做这件事。

这是我的脚本任务:

// Concat and compile our JS into a minified dist file
gulp.task('scripts', function() {
  return gulp.src('../app/public/assets/scripts/**/*.js')
    .pipe(jshint())
    .pipe(jshint.reporter('default'))
    .pipe(concat('main.js'))
    //.pipe(del(['../app/public/assets/scripts/main.js'])) <-- Doesn't work without forcing
    .pipe(gulp.dest('../app/public/assets/scripts'))
    .pipe(gulpif(flags.build, gulp.dest('../app/dist/assets/scripts')))
    .pipe(rename({ suffix: '.min' }))
    .pipe(uglify())
    .pipe(gulpif(flags.build, gulp.dest('../app/dist/assets/scripts')))
    .pipe(notify({ message: 'Finished compiling scripts' }));
});

1 个答案:

答案 0 :(得分:0)

我通常做这样的事情(非常简化:)):

var PARAMS = {
    destPath: 'build',
    js: [
        'src/js/test1.js',
        'src/js/test2.js',
        // ecc...
    ],
    // other
};

var TARGETS = {
    dest: 'main.js', // dest file

    extra: [
        // This files are inclued only in .bundle.min.js version
        // extra file here
    ],

    js: [
        'src/js/test1.js',
        'src/js/test2.js',
        // ecc...
    ]
};

gulp.task('connect', function() {
    return connect.server({
        livereload: true,
        host: '0.0.0.0',
        port: 8000
    });
});

gulp.task('reload', ['build'], function () {
    return gulp.src(['sandbox/**/*.html'])
        .pipe(connect.reload());
});

gulp.task('watch', ['connect', 'build'], function () {
    var src = [];
    // other
    src = src.concat(PARAMS.js);
    return gulp.watch(src, ['reload']);
});

gulp.task('clean', function (done) {
    return del(['build'], done);
});

gulp.task('build', ['clean'], function () {
    return gulp.src(target.js);
        .pipe(concat(target.dest))
        .pipe(gulp.dest(PARAMS.destPath))  // Plain

        .pipe(uglify())
        .pipe(rename({ extname: '.min.js' }))  // Minified
        .pipe(gulp.dest(PARAMS.destPath))

        .pipe(addsrc(target.extra))
        .pipe(order(target.extra))
        .pipe(concat(target.dest))
        .pipe(rename({ extname: '.bundled.min.js' }))  // Bundled
        .pipe(gulp.dest(PARAMS.destPath));
});

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