1 год назад
Нет шрифтов в файле fonts.scss
Не могу понять в чем причина. Помогите пожалуйста что не так?
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120
1. gulpfile.js
import gulp from "gulp";
import { path } from "./gulp/config/path.js";
import { plugins } from "./gulp/config/plugins.js";
global.app = {
path: path,
gulp: gulp,
plugins: plugins
}
import { copy } from "./gulp/tasks/copy.js";
import { reset } from "./gulp/tasks/reset.js";
import { html } from "./gulp/tasks/html.js";
import { server } from "./gulp/tasks/server.js";
import { scss } from "./gulp/tasks/scss.js";
import { js } from "./gulp/tasks/js.js";
import { images } from "./gulp/tasks/images.js";
import { otfToTtf, ttfToWoff, fontsStyle } from "./gulp/tasks/fonts.js";
function watcher(){
gulp.watch(path.watch.files, copy);
gulp.watch(path.watch.html, html);
gulp.watch(path.watch.scss, scss);
gulp.watch(path.watch.js,js );
gulp.watch(path.watch.images,images);}
const fonts = gulp.series(otfToTtf, ttfToWoff, fontsStyle);
const mainTasks = gulp.series(fonts, gulp.parallel(copy, html, scss, js, images));
const dev = gulp.series(reset, mainTasks, gulp.parallel(watcher, server));
gulp.task('default', dev);
2.path.js
import * as nodePath from 'path';
const rootFolder = nodePath.basename(nodePath.resolve());
const buildFolder = './dist'; //путь к папке с результатом
const srcFolder = './src'; //путь к папке с исходниками
export const path = {
build: {
js: `${buildFolder}/js/`,
css: `${buildFolder}/css/`,
html: `${buildFolder}/`,
images: `${buildFolder}/img/`,
fonts: `${buildFolder}/fonts/`,
files: `${buildFolder}/files/`,
},
src: {
js: `${srcFolder}/js/app.js`,
images: `${srcFolder}/img/**/*.{jpg,jpeg,png,gif,webp}`,
svg: `${srcFolder}/img/**/*.svg`,
scss: `${srcFolder}/scss/style.scss`,
html: `${srcFolder}/*.html`,
files: `${srcFolder}/files/**/*.*`,
},
watch: {
js:`${srcFolder}/js/**/*.js`,
scss: `${srcFolder}/scss/**/*.scss`,
html:`${srcFolder}/**/*.html`,
images: `${srcFolder}/img/**/*.{jpg,jpeg,png,svg,gif,ico,webp}`,
files: `${srcFolder}/files/**/*.*`,
},
clean: buildFolder,
buildFolder: buildFolder,
srcFolder: srcFolder,
rootFolder: rootFolder,
ftp: ''
};
3.fonts.js
import fs from 'fs';
import fonter from 'gulp-fonter';
import ttf2woff2 from 'gulp-ttf2woff2';
export const otfToTtf = () => {
//Ищем файлы шрифтов .otf
return app.gulp.src(`${app.path.srcFolder}/fonts/*.otf`, {})
.pipe(app.plugins.plumber(
app.plugins.notify.onError({
title: "FONTS",
message: "Error: <%= error.message %>"
}))
)
.pipe(fonter({
formats: ['ttf']
}))
.pipe(app.gulp.dest(`${app.path.srcFolder}/fonts/`))
}
export const ttfToWoff = () => {
return app.gulp.src(`${app.path.srcFolder}/fonts/*.ttf`, {})
.pipe(app.plugins.plumber(
app.plugins.notify.onError({
title: "FONTS",
message: "Error: <%= error.message %>"
}))
)
.pipe(fonter({
formats: ['woff']
}))
.pipe(app.gulp.dest(`${app.path.build.fonts}`))
.pipe(app.gulp.src(`${app.path.srcFolder}/fonts/*.ttf`))
.pipe(ttf2woff2())
.pipe(app.gulp.dest(`${app.path.build.fonts}`));
}
export const fontsStyle = () => {
let fontsFile = `${app.path.srcFolder}/scss/fonts.scss`;
fs.readdir(app.path.build.fonts, function (err, fontsFiles){
if(fontsFiles) {
if(!fs.existsSync(fontsFile)){
fs.writeFile(fontsFile, '', cb);
let newFileOnly;
for(var i = 0; i < fontsFiles.length; i++) {
Только авторизированные пользователи могут оставлять свои ответы
Дата
Популярность
Шрифты через лоадеры шрифтов, scss через scss лоадеры, потом через css лоадеры. В вебпак это так происходит, гальп думаю похож
Больше по теме