Question

我有AngularJs项目，其条目和公共文件为index.html，在该文件中我包含了各种js和css。现在，当我必须上传到生产模式时，我想更改文件的缩小版本的路径。如何使用gulp自动管理？

我无法为生产生成index.html文件，然后每次都将其恢复为开发模式。我试过了gulp-inject gulp-replace。所有工作，但为此我必须再次恢复生产模式。

Answer 1

在gulpfile.js中创建两个不同的变量。其中一个用于prod，另一个用于dev。第一个变量包含缩小文件的路径，第二个变量包含原始文件的路径。

var dev = [
        'path-of-files.js',
        'path-of-files.js'
    ];

gulp.task('dev', function () {
    var target = gulp.src('path-of-raw-index');
    return target
        .pipe(inject(gulp.src(devMode)))
        .pipe(concat('dev-index.html'))
        .pipe(gulp.dest('target-path'));
});

gulp.task('prod', function () {
    var target = gulp.src('path-of-raw-index');
    return target
        .pipe(inject(gulp.src(prodMode)))
        .pipe(concat('prod-index.html'))
        .pipe(gulp.dest('target-path'));
});

将这些代码行放在要注入的raw-index-file

中

<!-- inject:js -->
<!-- built js files will go here... -->
<!-- endinject -->

gulp

1 个答案: