Мне нужно сделать простую страницу html, что-то вроде таблицы стилей для значков.Как сгенерировать html-страницу с элементами из scss в Gulp
Глоток задача 'iconfont' генерации глифов шрифты из SVG иконок с этим кодом:
gulp.task('iconfont', function(){
return gulp.src(['assets/svg/*.svg'])
.pipe(iconfontCss({
fontName: 'my-icons',
cssClass: 'icon',
path: 'conf/icon-font.scss',
targetPath: '../../scss/layout/_icon-font.scss',
fontPath: '../fonts/'
}))
.pipe(iconfont({
fontName: 'my-icons',
prependUnicode: false,
formats: ['ttf', 'eot', 'woff'],
normalize: true,
centerHorizontally: true
}))
.on('glyphs', function(glyphs, options) {
// CSS templating, e.g.
console.log(glyphs, options);
})
.pipe(gulp.dest('assets/fonts/'));
});
и генерирует .Icon-купели SCSS файл с классами:
.icon-calendar {
@include icon(calendar);
}
.icon-circle {
@include icon(circle);
}
.icon-sun {
@include icon(sun);
}
.icon-home {
@include icon(home);
}
возможно ли это потом генерировать простую страницу html, содержащую элементы с этими именами классов:
<i class="icon-calendar">.icon-calendar</i>
<i class="icon-circle">.icon-circle</i>
<i class="icon-sun">.icon-sun</i>
<i class="icon-home">.icon-home</i>
Да, только что прочитал т он сгенерировал css, проанализировал его и сгенерировал новый html-файл. Используйте модуль узла 'fs' для чтения и' gulp-wrap' https://www.npmjs.com/package/gulp-wrap для генерации html из шаблона – cl3m
Вы можете использовать механизм шаблонов (рули и т. Д.), который имеет плагин gulp, а затем просто создайте шаблон с заполнителями для имен классов. Вам просто нужна логика, чтобы понять их динамически. – aw04