Permalink
Browse files

Initial commit

  • Loading branch information...
Mihhail Lapuškin
Mihhail Lapuškin committed Sep 9, 2013
0 parents commit 529b6e31de1db2af7621fd2f8148a7126de1bfb8
Showing with 227 additions and 0 deletions.
  1. +6 −0 Gruntfile.js
  2. +22 −0 LICENSE-MIT
  3. +83 −0 README.md
  4. +33 −0 package.json
  5. +83 −0 tasks/css-url-embed.js
@@ -0,0 +1,6 @@
+module.exports = function(grunt) {
+ 'use strict';
+
+ grunt.loadTasks('tasks');
+ grunt.registerTask('default', 'cssUrlEmbed');
+};
@@ -0,0 +1,22 @@
+Copyright (c) 2013 Mihhail Lapuškin
+
+Permission is hereby granted, free of charge, to any person
+obtaining a copy of this software and associated documentation
+files (the "Software"), to deal in the Software without
+restriction, including without limitation the rights to use,
+copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the
+Software is furnished to do so, subject to the following
+conditions:
+
+The above copyright notice and this permission notice shall be
+included in all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
+EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES
+OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
+NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT
+HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,
+WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
+FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR
+OTHER DEALINGS IN THE SOFTWARE.
@@ -0,0 +1,83 @@
+# grunt-css-url-embed
+
+> Embed URL's as base64 data URI's inside your stylesheets
+
+There are lots of base64 embedding Grunt plugins out there, but pretty much all of them are already outdated and/or abandoned. This plugin aims to change that.
+Most of the codebase is donater from [datauri](https://github.com/ahomu/grunt-data-uri) plugin.
+
+
+## Getting Started
+This plugin requires Grunt `~0.4.0`
+
+If you haven't used [Grunt](http://gruntjs.com/) before, be sure to check out the [Getting Started](http://gruntjs.com/getting-started) guide, as it explains how to create a [Gruntfile](http://gruntjs.com/sample-gruntfile) as well as install and use Grunt plugins. Once you're familiar with that process, you may install this plugin with this command:
+
+```shell
+npm install grunt-css-url-embed --save-dev
+```
+
+Once the plugin has been installed, it may be enabled inside your Gruntfile with this line of JavaScript:
+
+```js
+grunt.loadNpmTasks('grunt-css-url-embed');
+```
+
+## cssUrlEmbed task
+_Run this task with the `grunt cssUrlEmbed` command._
+
+Task targets, files and options may be specified according to the grunt [Configuring tasks](http://gruntjs.com/configuring-tasks) guide.
+
+URL's are encoded with [datauri](https://github.com/heldr/datauri). Both image and font URL's are supported. Web URL's are not supported ATM.
+
+### Options
+
+#### baseDir
+
+Type: `String`
+Default: `.` or the directory of `Gruntfile.js`
+
+The base directory for URL's.
+
+### Usage Examples
+
+#### Map input and output files directly
+
+```js
+cssUrlEmbed: {
+ encodeDirectly: {
+ files: {
+ 'path/to/output.css': ['path/to/input.css']
+ }
+ }
+}
+```
+
+#### Specify base directory if needed
+```js
+cssUrlEmbed: {
+ encodeWithBaseDir: {
+ options: {
+ baseDir: './app'
+ },
+ files: {
+ 'path/to/output.css': ['path/to/input.css']
+ }
+ }
+}
+```
+
+#### Process all CSS files in target directory
+```js
+cssUrlEmbed: {
+ encode: {
+ expand: true,
+ cwd: 'target/css',
+ src: [ '**/*.css' ],
+ dest: 'target/css'
+ }
+}
+```
+
+
+## Release History
+
+ * 2013-XX-XX   v0.1.0   First version.
@@ -0,0 +1,33 @@
+{
+ "name": "grunt-css-url-embed",
+ "description": "Embed URL's as base64 strings inside your stylesheets",
+ "version": "0.1.0",
+ "homepage": "https://github.com/mihhail-lapushkin/grunt-css-url-embed",
+ "author": {
+ "name": "Mihhail Lapushkin",
+ "email": "miha@smail.ee",
+ "url": "http://www.linkedin.com/in/mihhail"
+ },
+ "repository": {
+ "type": "git",
+ "url": "git://github.com/mihhail-lapushkin/grunt-css-url-embed.git"
+ },
+ "bugs": {
+ "url": "https://github.com/mihhail-lapushkin/grunt-css-url-embed/issues"
+ },
+ "licenses": [ {
+ "type": "MIT",
+ "url": "https://github.com/mihhail-lapushkin/grunt-css-url-embed/blob/master/LICENSE-MIT"
+ } ],
+ "main": "Gruntfile.js",
+ "engines": {
+ "node": ">=0.8.0"
+ },
+ "dependencies": {
+ "datauri": ">= 0.1"
+ },
+ "devDependencies": {
+ "grunt": "~0.4.0"
+ },
+ "keywords": [ "gruntplugin", "image", "data-uri", "base64", "encode", "embed", "css", "url" ]
+}
@@ -0,0 +1,83 @@
+/*
+ * grunt-css-url-embed
+ * https://github.com/mihhail-lapushkin/grunt-css-url-embed
+ *
+ * Copyright (c) 2013 Mihhail Lapushkin
+ * Licensed under the MIT license.
+ */
+
+'use strict';
+
+module.exports = function(grunt) {
+ var URL_REGEX = /(?:url\(["']?)(.*?)(?:["']?\))/;
+
+ var path = require('path');
+ var datauri = require('datauri');
+
+ grunt.registerMultiTask('cssUrlEmbed', "Embed URL's as base64 strings inside your stylesheets", function() {
+ var options = this.options();
+
+ this.files.forEach(function(f) {
+ var inputFile = f.src.filter(function(filepath) {
+ if (!grunt.file.exists(filepath)) {
+ grunt.log.warn('Source file "' + filepath + '" not found');
+ return false;
+ } else {
+ return true;
+ }
+ });
+
+ var outputContent = inputFile.map(function(f) {
+ grunt.log.subhead('Processing source file "' + f + '"');
+
+ return embedUrls(f, options);
+ }).join('');
+
+ grunt.file.write(f.dest, outputContent);
+ grunt.log.writeln('File "' + f.dest + '" created');
+ });
+ });
+
+ var embedUrls = function(f, options) {
+ try {
+ var source = grunt.file.read(f);
+ var baseDir = path.resolve(options.baseDir ? options.baseDir : path.dirname(f));
+ var allUrls = source.match(new RegExp(URL_REGEX.source, 'g')) || [];
+ var targetUrls = allUrls.filter(function(url) { return !url.match('(data:|http)'); });
+ var uniqTargetUrls = grunt.util._.uniq(targetUrls);
+ var extractedUrls = uniqTargetUrls.map(function(url) { return url.match(URL_REGEX)[1]; });
+
+ if (targetUrls.length === 0) {
+ grunt.log.writeln("Nothing to embed here!");
+ return source;
+ }
+
+ grunt.log.debug('Using "' + baseDir + '" as base directory for URL\'s');
+
+ grunt.log.writeln(uniqTargetUrls.length + " embeddable URL" + (uniqTargetUrls.length > 1 ? "'s" : "") + " found");
+
+ extractedUrls.forEach(function(url) {
+ var urlFullPath = path.resolve(baseDir + '/' + url);
+ var dataUri;
+
+ grunt.log.debug('"' + url + '" resolved to "' + urlFullPath + '"');
+
+ if (!grunt.file.exists(urlFullPath)) {
+ grunt.log.warn('"' + url + '" seems to be wrong');
+ return;
+ }
+
+ dataUri = datauri(urlFullPath);
+
+ grunt.log.ok('"' + url + '" embedded');
+
+ source = source.replace(new RegExp(url, 'g'), dataUri);
+ });
+
+ return source;
+ } catch (e) {
+ grunt.log.error(e);
+ grunt.fail.warn('URL embed failed!');
+ }
+ };
+};

0 comments on commit 529b6e3

Please sign in to comment.