Я пытаюсь использовать 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, чтобы я мог получить правильный путь инъекции?