使用 gulp 注入 bower 依赖项 - 相对路径问题

Question

我想用 gulp-inject 和 main-bower-files 注入 bower 依赖项。拾取依赖项，但生成的路径是绝对的。

我得到 /www/lib/angular/angular.js 而我想要 lib/angular/angular.js

<!-- bower:js -->
<script src="/www/lib/angular/angular.js"></script>
<!-- endinject -->

.bowerrc

{
  "directory": "www/lib"
}

gulpfile.js

var gulp = require('gulp');
var inject = require('gulp-inject');
var mainBowerFiles = require('main-bower-files');
var debug = require('gulp-debug');

gulp.task('index', function () {
    return gulp.src('./www/index.html')
        .pipe(inject(gulp.src(mainBowerFiles(), {read: false}, {relative: true}), {name: 'bower'}))
        .pipe(gulp.dest('./www'));
});

Answer 1

选项使用错误，relative选项应该在inject而不是gulp.src。

正确的任务：

gulp.task('index', function () {
    return gulp.src('./www/index.html')
        .pipe(inject(gulp.src(mainBowerFiles(), {read: false}), {name: 'bower', relative: true}))
        .pipe(gulp.dest('./www'));
});

使用 gulp 注入 bower 依赖项 - 相对路径问题

inject bower dependencies with gulp - relative path issue

gulp

gulp-inject