Gulp rigger и gulp include file при сборке html файла ломают верстку
У вставляемого блока появляется непонятный отступ сверху в 24px (в скриншотах — наглядно).
В результирующем .html файле никаких лишних символов. От сверстанного обычным способом файла он не отличается никак. Откуда тогда отступ?
Помощь в написании контрольных, курсовых и дипломных работ здесь.
Ошибка при сборке файлов на gulp
Добрый день уважаемые, помогите пожалуйста с решением проблемы. Не запускается сборщик проекта -.
При сборке проекта не компилится через gulp файлы scss
Здраствуйте!Возможо не в тот раздел пишу, но все же кто знает помогите пожалуйста разобраться, мне.
Переход на Gulp v4 Перестал работать плагин сборщик спрайтов gulp.spritesmith
Перешел на новую версию Gulp (v4) и мой галп сборщик превратился в тыкву, Подскажите, как исправить.
Gulp извлечение строки из файла
Мне нужно отформатировать генерируемый SCSS код, я нашёл 2 плагина.
После сборки страница криво отображается во всех браузерах (все бровзеры последних версий).
ПС
Windows 7 x64, node.js v8.9.1
Без понятия, какую еще доп. инфу можно указать.
Может в стилях проблема, а не в разметке?
или какие-нибудь ложные отступы или ложные пробелы есть на странице? типо ?
Раньше, лет 5 назад, когда верстал под ИЕ 7-8 была такая фишка, что если хэдеру поставить margin-top то создавался отступ сверху, не от этого элемента, а прям как у вас, но в других браузерах всё ок было.. проверьте стили в отладчике хрома.
Может в стилях проблема, а не в разметке?
или какие-нибудь ложные отступы или ложные пробелы есть на странице? типо ?
Раньше, лет 5 назад, когда верстал под ИЕ 7-8 была такая фишка, что если хэдеру поставить margin-top то создавался отступ сверху, не от этого элемента, а прям как у вас, но в других браузерах всё ок было.. проверьте стили в отладчике хрома.
Нашел!
Это был символ #65279 , он же BOM (Byte Order Mark), который находится в начале файлов в кодировке UTF-8. Чтобы таких отступов не было, нужно преобразовывать файлы-шаблоны (например, header.html) в utf-8 без BOM (умеет, например, notepad++).
Конечно, руками все это делать напряжно, буду искать автоматизированное решение.
ПС
Надо было послушать muxahuk1214, и проверить в инспекторе хрома. Ибо я уже много лет сижу через мозилу, а она через свой инспектор ничего не показывает, как будто там ничего лишнего и нет.
Пометьте, пожалуйста, как ответ.
gulp: назначение файла package.json
Сообщение вынесено из темы: https://www.cyberforum.ru/javascript/thread1724805.html whiteapps.
Ошибки при запуске Gulp
Давно работал с Gulp и никаких проблем не было, пока не решил обновиться. Была сборочка, которую.
Ошибка при запуске Gulp
Уже пол дня мучаюсь, все запускается в отдельности кроме BrowserSync Вот мой gulpfile.js var.
При установке gulp-clean-css удаляется файл fs-write-stream-atomic
При установке gulp-clean-css,происходит следующее C:\Open\OSPanel\domains\Compulink>npm install.
Источник
Как исправить ошибку при запуска gulp?
‘use strict’;
// Импортируем все наши галп-плагины и сам галп
var gulp = require(‘gulp’),
watch = require(‘gulp-watch’),
prefixer = require(‘gulp-autoprefixer’),
uglify =require(‘gulp-uglify’),
sass = require(‘gulp-sass’),
sourcemaps =require(‘gulp-sourcemaps’),
rigger = require(‘gulp-rigger’),
cssmin = require(‘gulp-minify-css’),
imagemin =require(‘gulp-imagemin’),
tinypng = require(‘gulp-tinypng’),
rimraf = require(‘rimraf’),
browserSync = require(‘browser-sync’),
reload = browserSync.reload;
var path = <
build: < //указываем, куда скалдывать готовые после сборки файлы
html: ‘build/’,
js: ‘build/js/’,
css: ‘build/css/’,
img: ‘build/img/’,
fonts: ‘build/fonts/’
>,
src: < // Пути, где будем брать исходники
html: ‘src/*.html’, // Синтаксис src/*.html говорит gulp, что мы хотим взять все файлы с расширением .html
js: ‘src/js/main.js’, // В стилях и сриптах нам понадобятся только main-файлы
style: ‘src/style/main.scss’,
img: ‘src/img/**/*.*’ // Сиснтаксис img/**/*.* означает «взять все файлы в папке img и всех вложенных папок с любым расширением
>,
clean: ‘.build’
>;
// Создадим переменную с настройками нашего dev-сервера:
var config = <
server: <
baseDir: «.build»
>,
tunnel: true,
host: ‘localhost’,
port: 9000,
logPrefix: «Frontend_Devil»
>;
Источник
Работа gulp-rigger?
Едет верстка после того как отработает плагин. Добавляет не понятно что в код
почему может быть?
Заменил gulp-rigger на gulp-file-inlude
теперь остался только один символ
Пробовал также менять кодировку, ничего не помогает
- Вопрос задан более трёх лет назад
- 12016 просмотров
Средний 1 комментарий
Было
Стало
Плагин gulp-rigger предназначен для подключения файлов. Как например директива include в php, или import в css. Gulp-rigger применяют когда надо вставить повторяющийся кусок кода, там где подобных директив нету. Например в html. Простым написанием //= можно подключить необходимый код. Например шапку или футер сайта. Так же можно применить gulp-rigger для js. Хотя это реже встречается.
Подобное необходимо если к примеру вы не можете использовать jade или php в отношении html. По поводу символов ничего не могу сказать. Вряд ли это от rigger-a.
Источник
И снова.. Почему Gulp 4 не работает?
Подскажите, пожалуйста. Почему это не работает?
Может кто-то взять к себе и протестировать?
https://github.com/KononovD/kononovD.github.io/tre.
тут сам gulpfile.js и package.json
Ошибка следующая
[22:37:09] Using gulpfile
\Desktop\testGulp\gulpfile.js
[22:37:09] Starting ‘default’.
[22:37:09] Starting ‘build’.
[22:37:09] Starting ‘clean:build’.
[22:37:09] Finished ‘clean:build’ after 2.01 ms
[22:37:09] Starting ‘html:build’.
[22:37:09] Finished ‘html:build’ after 13 ms
[22:37:09] Starting ‘scss:build’.
[22:37:09] ‘scss:build’ errored after 4.53 ms
[22:37:09] TypeError: dest.on is not a function
at DestroyableTransform.Readable.pipe (C:\Users\я\Desktop\testGulp\node_modules\readable-stream\lib\_stream_readable.js:564:8)
at DestroyableTransform.pipe2 (C:\Users\я\Desktop\testGulp\node_modules\gulp-plumber\index.js:72:14)
at C:\Users\я\Desktop\testGulp\gulpfile.js:82:10
at taskWrapper (C:\Users\я\Desktop\testGulp\node_modules\undertaker\lib\set-task.js:13:15)
at bound (domain.js:395:14)
at runBound (domain.js:408:12)
at asyncRunner (C:\Users\я\Desktop\testGulp\node_modules\async-done\index.js:55:18)
at process._tickCallback (internal/process/next_tick.js:61:11)
[22:37:09] ‘build’ errored after 23 ms
[22:37:09] ‘default’ errored after 26 ms
Мне почему-то кажется, что все дело в автопрефиксере..
И еще может кто объяснить в чем разница 2х наблюдателей? Они в самом низу, первый (закомментированный) не просит модуль «gulp-warch», а 2й просит.. В чем разница?
Спасибо.
Источник
Gulp-rigger. Почему выскакивает ошибка при импорте в шаблон субшаблона?
Сборка происходит в Gulp 4.
Имеется основной index.html
В него с помощью «gulp-rigger»: «^0.5.8» импортируются html-шаблоны.
Когда я в один из таких шаблонов пытаюсь импортировать субшаблон, то в вылетает следующая ошибка.
Не могу понять чем связана эта ошибка?
Примечательно то, что ведь в другом проекте с таким же package.json подобный импорт с помощью Ригера работает!
В чём тут косяк?
- Вопрос задан 09 апр.
- 48 просмотров
Хм.. Забавно. Рад, что вас это заинтересовало. Давайте разбираться.
Сейчас запустил второй проект, всё работает
Вот инфа по нему:
Я сам сетап составлял который мне нужен был для проекта. Т.е. это не чей-то, а мой стартеркит. И там вложенный импорт работал. Я даже не задумывался о том, что он может не работать.
Vyach Gor, Короче, тут вот в чём дело.
Используя gulp-rigger, надо делать на манер SPA как в React –
т.е. один вход для html.
Я забыл поправить путь к сорсу для gulp.src!
У меня было вот так: ‘assets/src/**/*.html’
Т.о. Gulp тянул все html-файлы в сборку.
А когда я прописал путь вот так: ‘assets/src/index.html’,
то вуаля! Всё работает! 🙂
Я оставил вот так: ‘assets/src/*.html’,
на случай дополнительных страниц.
Так что ларчик просто открывался. Ничего там в ригере они не правили.
Если ты посмотришь свой gulpfile.js, то увидишь, что у тебя скорее всего тоже в этом была проблема.
Сам задал вопрос, сам и ответил на него – это в моём репертуаре )))
Источник