Base64 images in your css file.
This plugin requires Grunt ~0.4.4
If you haven't used Grunt before, be sure to check out the Getting Started guide, as it explains how to create a Gruntfile as well as install and use Grunt plugins. Once you're familiar with that process, you may install this plugin with this command:
npm install grunt-css-base64image --save-dev
Once the plugin has been installed, it may be enabled inside your Gruntfile with this line of JavaScript:
grunt.loadNpmTasks('grunt-css-base64image');
css-base64image任务使用css-base64-images项目编码图片。 这个版本是fork自https://github.com/maxzhang/grunt-base64image, 追加了css的相对路径和绝对路径的功能
指定CSS源目录
指定CSS中相对路径的目录, 如果没有指定,那么默认采用styles
指定CSS中"/image/a.png"这样的绝对路径的的根目录
指定输出目录
module.exports = function(grunt) {
grunt.loadNpmTasks('grunt-css-base64image');
grunt.initConfig({
pkg: grunt.file.readJSON('package.json'),
base64image: {
css: {
styles: 'app/styles/',
root : "src/images",
relative: 'src/images/',
dest: 'dest/styles/base64/'
}
}
});
};