KEDRIA
@KEDRIA
Начинающий верстальщик

Не находит шрифты. Ошибка в gulp. Как решить?

Решил поставить себе smart-grid и подключение шрифтов через gulp , в итоге выбивает ошибку "ReferenceError: fonts is not defined"
// сompress: false

//Подключаем модули галпа
const gulp = require('gulp');
const concat = require('gulp-concat');
const autoprefixer = require('gulp-autoprefixer');
const cleanCSS = require('gulp-clean-css');
const uglify = require('gulp-uglify');
const del = require('del');
const browserSync = require('browser-sync').create();
const sourcemaps = require('gulp-sourcemaps');
const less = require('gulp-less');

//Порядок подключения css файлов
const cssFiles = [
   './build/css/reset.css',
   './build/css/style.css'
]
//Порядок подключения less файлов

//Порядок подключения js файлов
const jsFiles = [
   './src/js/lib.js',
   './src/js/main.js'
]

//Таск на стили CSS
function styles() {
   //Шаблон для поиска файлов CSS
   //Все файлы по шаблону './src/css/**/*.css'
   return gulp.src('./src/css/style.less')
   .pipe(sourcemaps.init())
   .pipe(less())
 
   //Добавить префиксы
   .pipe(autoprefixer({
      browsers: ['last 2 versions'],
      cascade: false
   }))
   
   .pipe(sourcemaps.write('./'))
   //Выходная папка для стилей
   .pipe(gulp.dest('./build/css'))
   .pipe(browserSync.stream());
}

//Таск на скрипты JS
function scripts() {
   //Шаблон для поиска файлов JS
   //Всей файлы по шаблону './src/js/**/*.js'
   return gulp.src(jsFiles)
   //Объединение файлов в один
   .pipe(concat('script.js'))
   //Минификация JS
   .pipe(uglify({
      toplevel: true
   }))
   //Выходная папка для скриптов
   .pipe(gulp.dest('./build/js'))
   .pipe(browserSync.stream());
}

//Удалить всё в указанной папке
function clean() {
   return del(['build/*'])
}

//Просматривать файлы
function watch() {
   browserSync.init({
      server: {
          baseDir: "./"
      }
  });

  function fonts() {
   return gulp.src('./src/fonts/**/*')
     .pipe(gulp.dest('./build/fonts/'))
 };
  //Следить за Less файлами
  gulp.watch('./src/css/**/*.less', styles)
  gulp.watch('./src/fonts/**/*', fonts).on('change', browserSync.reload);
  //Следить за JS файлами
  gulp.watch('./src/js/**/*.js', scripts)
  //При изменении HTML запустить синхронизацию
  gulp.watch("./*.html").on('change', browserSync.reload);
}

//Таск вызывающий функцию styles
gulp.task('styles', styles);
//Таск вызывающий функцию scripts
gulp.task('scripts', scripts);
//Таск для очистки папки build
gulp.task('del', clean);
//Таск для отслеживания изменений
gulp.task('watch', watch);
//Таск для удаления файлов в папке build и запуск styles и scripts
gulp.task('build', gulp.series(clean, gulp.parallel(styles,scripts,fonts)));
gulp.task('fonts',fonts);

//Таск запускает таск build и watch последовательно
gulp.task('dev', gulp.series('build','watch'));

Может ошибка в галп файле? Не могу понять , сижу уже 2 часа не могу разобраться.
Путь к файлу '../src/fonts/Proxima Nova/ProximaNova-Light.woff2'
  • Вопрос задан
  • 45 просмотров
Решения вопроса 1
vadimkot
@vadimkot Куратор тега CSS
У вас функция fonts() декларируется внутри функции watch() - вынесите ее из области видимости watch наружу и появится там fonts.
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы