Описание тега gulp-inject

Описание тега Вопросы с тегом

Gulp-inject - это плагин для внедрения JavaScript, таблиц стилей и веб-компонентов для системы сборки потоковой передачи Gulp.

gulp-injectпринимает поток исходных файлов, преобразует каждый файл в строку и вставляет каждую преобразованную строку в заполнители в файлах целевого потока. См. Раздел "Основное использование" и "Дополнительные примеры" ниже.

Существуют преобразования и заполнители по умолчанию для вставки файлов в файлы html, jade, jsx, less, slm, haml и sass / scss.

https://www.npmjs.com/package/gulp-inject

npm install --save-dev gulp-inject

Основное использование

Целевой файл src/index.html:

<!DOCTYPE html>
<html>
<head>
  <title>My index</title>
  <!-- inject:css -->
  <!-- endinject -->
</head>
<body>

  <!-- inject:js -->
  <!-- endinject -->
</body>
</html>

Файл gulpfile.js:

var gulp = require('gulp');
var inject = require('gulp-inject');

gulp.task('index', function () {
  var target = gulp.src('./src/index.html');
  // It's not necessary to read the files (will speed up things), we're only after their paths: 
  var sources = gulp.src(['./src/**/*.js', './src/**/*.css'], {read: false});

  return target.pipe(inject(sources))
    .pipe(gulp.dest('./src'));
});