gulp-css2txt

0.1.8 • Public • Published

gulp-css2txt

Build Status

npm version

gulp-css2txt is a gulp plugin to extract possible characters from css which may be appear in browser.

install

$ npm install -D gulp-css2txt

Simple usage

Static import

import gulp from 'gulp'
import css2txt from 'gulp-css2txt'
 
gulp.task('css2txt', () => {
  gulp.src(['path/to/the.css'])
    .pipe(css2txt())
    .pipe(gulp.dest('dist/'))
})

CommonJS style

const gulp = require('gulp')
const css2txt = require('gulp-css2txt')
 
gulp.task('css2txt', () => {
  gulp.src(['path/to/the.css'])
    .pipe(css2txt({ opts }))
    .pipe(gulp.dest('dist/'))
})

Overview of transformation

input

CSS is acceptable input.

.foo::before {
  content: 'abc'
}
.bar::before {
  content: "def"
}
.baz::after {
  content: '\47'; /* G */
}

output

Output willbe aggregated characters.

abcdefG

Example stack of font subsetting with gulp-fontmin

prepare

$ npm install -D gulp gulp-css2txt gulp-fontmin
$ npm install -S font-awesome
import gulp    from 'gulp'
import css2txt from 'gulp-css2txt'
import fontmin from 'gulp-fontmin'
 
gulp.task('font', cb => {
 
  const texts = []
 
  gulp.src(['./dist/*.css'])
    .pipe(css2txt())
    .on('data', file => texts.push(file.contents.toString()))
    .on('end', () => {
 
      const text = texts.join('')
      const formats = ['eot', 'ttf', 'woff', 'svg']
 
      gulp.src('./node_modules/font-awesome/fonts/**/*.ttf')
        .pipe(fontmin({ text, formats }))
        .pipe(gulp.dest('./dist'))
        .on('end', () => cb())
    })

Package Sidebar

Install

npm i gulp-css2txt

Weekly Downloads

5

Version

0.1.8

License

MIT

Last publish

Collaborators

  • kamataryo