在 Gulp 任务中更改 bowerFiles() 注入路径答案

【问题标题】：Change bowerFiles() injection path in Gulp task在 Gulp 任务中更改 bowerFiles() 注入路径
【发布时间】：2016-02-10 04:49:26
【问题描述】：

我有以下 Gulp 任务：

gulp.task('bowerinstall', function() {
    gulp.src('app/index.html')
        .pipe($.inject(gulp.src(bowerFiles(), {read: false}), {name: 'bower'}))
        .pipe(gulp.dest(['dist/', 'app/']));
});

此任务查看我的 index.html 并将 bower 文件注入其中。这很好用，但是它将以下路径注入到我的 index.html 中：

<script src="/app/bower_components/modernizr/modernizr.js"></script>

该任务已确定要注入我的应用程序的正确资源，这很好，但我希望它注入以下内容：

<script src="bower_components/modernizr/modernizr.js"></script>

有没有办法修改我的 gulp 任务来做到这一点？

谢谢！

【问题讨论】：

标签： javascript build gulp

【解决方案1】：

在下面一行：

    .pipe($.inject(gulp.src(bowerFiles(), {read: false}), {name: 'bower'}))

添加选项relative: true，例如：

    .pipe($.inject(gulp.src(bowerFiles(), {read: false}), {name: 'bower', relative: true}))

文档对此进行了介绍： https://www.npmjs.com/package/gulp-inject#injecting-files-relative-to-target-files

【讨论】：