mirror of
https://github.com/locomotivemtl/locomotive-boilerplate.git
synced 2026-01-15 00:55:08 +08:00
Added 'grunt-svg-sprite' plugin
The plugin replaces 'svgmin' and 'svgstore' with an all-in-one and highly flexible solution for managing SVG assets.
Changes:
- Deleted 'assets/images/sprite/', SVG images can live anywhere within the source image directory;
- When compiled to 'www/assets/images/sprite.svg', the plugin generates an HTML file in 'assets/images/sprite.symbol.html' that serves as an index of the spritesheet's contents;
- A separator ("--") is used when traversing a directory structure for the symbol ID (e.g, 'sprite.svg#icons--social--twitter');
This commit is contained in:
@@ -32,5 +32,4 @@ module.exports = function (grunt)
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
};
|
||||
|
||||
@@ -17,8 +17,7 @@
|
||||
"browserify:prod",
|
||||
"concat:prod",
|
||||
"uglify",
|
||||
"svgstore",
|
||||
"svgmin",
|
||||
"svg_sprite",
|
||||
"notify:build"
|
||||
],
|
||||
|
||||
|
||||
29
build/grunt/config/svg_sprite.js
Normal file
29
build/grunt/config/svg_sprite.js
Normal file
@@ -0,0 +1,29 @@
|
||||
module.exports = {
|
||||
options : {
|
||||
svg: {
|
||||
xmlDeclaration : false,
|
||||
namespaceIDs : true,
|
||||
doctypeDeclaration : false,
|
||||
cleanupNumericValues : true,
|
||||
removeTitle : true,
|
||||
removeDesc : true
|
||||
}
|
||||
},
|
||||
prod: {
|
||||
expand : true,
|
||||
cwd : '<%= paths.img.src %>',
|
||||
src : [ '**/*.svg', '!sprite.svg' ],
|
||||
dest : '<%= paths.img.dist %>',
|
||||
options : {
|
||||
mode: {
|
||||
symbol: {
|
||||
dest : '.',
|
||||
sprite : 'sprite.svg',
|
||||
example : {
|
||||
dest: '../../../build/sprite.symbol.html'
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -1,22 +0,0 @@
|
||||
module.exports = {
|
||||
options: {
|
||||
plugins: [
|
||||
{ removeViewBox: false },
|
||||
{ cleanupIDs: false },
|
||||
{ convertPathData: false },
|
||||
{ mergePaths: false },
|
||||
{ convertShapeToPath: false },
|
||||
{ cleanupNumericValues: false },
|
||||
{ convertTransform: false },
|
||||
{ removeUselessStrokeAndFill: false },
|
||||
{ removeTitle: true },
|
||||
{ removeDesc: true }
|
||||
]
|
||||
},
|
||||
dist: {
|
||||
expand : true,
|
||||
cwd : '<%= paths.img.dist %>',
|
||||
src : '*.svg',
|
||||
dest : '<%= paths.img.dist %>'
|
||||
}
|
||||
};
|
||||
@@ -1,8 +0,0 @@
|
||||
module.exports = {
|
||||
options: {},
|
||||
prod: {
|
||||
files: {
|
||||
'<%= paths.img.dist %>/sprite.svg': [ '<%= paths.img.src %>/sprite/*.svg' ]
|
||||
}
|
||||
}
|
||||
};
|
||||
@@ -13,7 +13,7 @@ module.exports = {
|
||||
},
|
||||
svg: {
|
||||
files: [ '<%= paths.img.src %>/**/*.svg' ],
|
||||
tasks: [ 'svgstore', 'notify:svg' ]
|
||||
tasks: [ 'svg_sprite', 'notify:svg' ]
|
||||
},
|
||||
tasks: {
|
||||
options: {
|
||||
|
||||
@@ -24,8 +24,7 @@
|
||||
"grunt-phplint": "0.0.0",
|
||||
"grunt-postcss": "0.0.0",
|
||||
"grunt-sass": "0.0.0",
|
||||
"grunt-svgmin": "0.0.0",
|
||||
"grunt-svgstore": "0.0.0",
|
||||
"grunt-svg-sprite": "0.0.0",
|
||||
"load-grunt-config": "0.0.0",
|
||||
"postcss-banner": "0.0.0",
|
||||
"svg4everybody": "0.0.0"
|
||||
|
||||
@@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg"/>
|
||||
|
Before Width: | Height: | Size: 41 B |
Reference in New Issue
Block a user