drdk / grunt-dr-svg-sprites

Grunt plugin to create SVG sprites with PNG fallbacks at needed sizes
113 stars 19 forks source link

0.5.2 produces no output (0.2.8 fine) #10

Closed benfrain closed 10 years ago

benfrain commented 10 years ago

If I use 0.5.2 I don't get any errors but I don't get any output either. This is using the references to paths as per the readme.

Using 0.2.8 I get the expected output using the prior path names. For example:

"svg-sprites": {
            options: {
                paths: {
                    spriteElements: "source/img/sprites",
                    sprites: "source/img/gensprites",
                    css: "source/css"
                },
                sizes: {
                    large: "1"
                },
                refSize: "large",
                unit: 8
            }
        }

Is there anything I can check?

phloe commented 10 years ago

I put in proper grunt target support in v0.5.0 - also noted in the changelog. The basic options example in the readme should give you an idea of what the new syntax looks like :)

I'm not sure if there's any way of otherwise informing of (breaking) changes. A check for outdated options might be doable...

benfrain commented 10 years ago

Sorry. Probably didn't explain myself well. With the latest version even using the options syntax given in the readme I don't get any output.

phloe commented 10 years ago

Hmmm, what does your options look like?

benfrain commented 10 years ago

Out and about at the moment so will post in the morning but I just copy and pasted from the read me and amended the path.

benfrain commented 10 years ago

Hi,

OK, so if I use 0.5.2 and the following syntax I get nothing:

// 0.5.2
        "svg-sprites": {
            options: {
                spriteElementPath: "source/img/sprites",
                spritePath: "source/img/gensprites",
                cssPath: "source/css"
            }
        }

That's after running npm prune --production and then sudo npm install to bring everything fresh.

Also tried with additional options and nesting the paths like this:

"svg-sprites": {
            options: {
                paths: {
                    spriteElementPath: "source/img/sprites",
                    spritePath: "source/img/gensprites",
                    cssPath: "source/css"
                },
                sizes: {
                    large: "1"
                },
                refSize: "large",
                unit: 8
            }
        }

But still no output.

phloe commented 10 years ago

Ah! I see why now: each sprite needs to have its own target defined. With the new target support your sizes, refSize and unit need to be inside a target definition.

Try this:

"svg-sprites": {
    options: {
        paths: {
            spriteElementPath: "source/img",
            spritePath: "source/img/gensprites",
            cssPath: "source/css"
        }
    },
    sprites: {
        options: {
            sizes: {
                large: "1"
            },
            refSize: "large",
            unit: 8
        }
    }   
}

This describes a sprites target - which would look for a folder of the same name inside spriteElementPath (sprites in source/img).

I hope this fixes your problem :)

benfrain commented 10 years ago

OK, great. I'll give it a whirl first thing Monday. Thanks again. :+1:

benfrain commented 10 years ago

Yes, finally get it now :) Just sent a PR with an extra example for the readme in the hope it helps my future self. :+1: