gulp-jsfy
v0.1.6-beta
Published
transform .css to .js append to <head>
Downloads
18
Maintainers
Readme
gulp-jsfy
transform .css to .js append to <head>
Installation
$ npm install gulp-jsfy
Plugin Usage
gulp= require 'gulp'
gulp.task 'default',->
main= require 'main-bower-files'
jsfy= require 'gulp-jsfy'
concat= require 'gulp-concat'
gulp.src main()
.pipe jsfy dataurl:true
.pipe concat 'bower_components.js'
.pipe gulp.dest 'public_html'
Plugin Options
- dataurl:
false
true
: Replaceurl(relative/URL)
tourl(DATAURI)
- ignoreURL:
false
true
: Don't Replaceurl(URL)
How do transform to .js ?
It's transform .css into <link href="DATAURI">
.js And resolve url()
references.
Becomes css is standalone.
Example
@charset "UTF-8";
/*!
Animate.css - http://daneden.me/animate
Licensed under the MIT license - http://opensource.org/licenses/MIT
Copyright (c) 2014 Daniel Eden
...
*/
gulpfile.coffee
gulp= require 'gulp'
jsfy= require 'gulp-jsfy'
gulp.task 'default',->
gulp.src 'animate.css'
.pipe jsfy()
.pipe gulp.dest './'
Execute gulp
$ npm install gulp gulp-jsfy coffee-script
$ gulp
# Finished 'default' after 37 ms
Become animate.css.js
(function(){
var link=document.createElement('link');
link.setAttribute('data-name','animate');
link.setAttribute('rel','stylesheet');
link.setAttribute('href',"data:text/css;charset=utf8;base64,QGNoYXJzZXQgIlVU..."
document.head.appendChild(link);
})();