Как получить правильный путь внедрения зависимостей с помощью wiredep?

Я пытаюсь использовать wiredep для включения файлов css и js из Bower в свое приложение. У меня есть необработанный index.html (html, исключающий Bower css и js) в app/rawHtml/index.html, как показано в дереве папок ниже:

 app
   ├── bower_components
   │   ├── lib1
   │   │   ├── lib1.css
   │   │   ├── lib1.js
   │   │   ├── bower.json
   │   │   ├── package.json
   │   │   └── README.md
   │   ├── lib2
   │   │   ├── lib2.css
   │   │   ├── lib2.js
   │   │   ├── bower.json
   │   │   ├── package.json
   │   │   └── README.md
   │   │       ├── globals.js
   │   │       ├── locale-header.js
   │   │       └── test-header.js
   ├── index.html
   └── rawHtml
       └── index.html

Я хочу использовать от app/rawHtml/index.html до app/index.html. Мой gulpfile для wiredep выглядит следующим образом:

gulpfile.js

gulp.task('bower:dev', function () {
   return gulp.src('app/rawHtml/index.html')
   .pipe(wiredep())
   .pipe(gulp.dest('app/'));
});

Теперь файл index.html создан. Но зависимости вводятся следующим образом по отношению к app/rawHtml/index.html:

 <!-- bower:css --> 
 <link rel="stylesheet" href="../bower_components/lib1/lib1.css" />                                                             
 <link rel="stylesheet" href="../bower_components/lib2/lib2.css" />

<!-- bower:js -->
<script src="../bower_components/lib1/lib1.js"></script>
<script src="../bower_components/lib2/lib2.js"></script>

Вместо по отношению к целевому файлу app/index.html следующим образом:

 <!-- bower:css --> 
 <link rel="stylesheet" href="bower_components/lib1/lib1.css" />                                                             
 <link rel="stylesheet" href="bower_components/lib2/lib2.css" />

<!-- bower:js -->
<script src="bower_components/lib1/lib1.js"></script>
<script src="bower_components/lib2/lib2.js"></script>

Я попытался сохранить исходный и конечный файлы index.html в одном и том же каталоге, но не нашел возможности переименовать конечный файл. Как мне использовать wiredep, чтобы я мог получить правильный путь инъекции?


person Pravin    schedule 24.03.2016    source источник


Ответы (1)


Хорошо, у меня была такая же проблема. Я думаю, вам нужно поместить index.html в каталог app перед запуском команды wiredep.

gulpfile.js

gulp.task('bower:dev', function () {
    return gulp.src('app/rawHtml/index.html')
    .pipe(gulp.dest('app/'))
    .pipe(wiredep())
    .pipe(gulp.dest('app/'));
});
person Dimko Desu    schedule 10.04.2016