I'm using the NodeJS implementation of KSS. I have the following file structure:
sass (.scss files)
css (compiled .css files)
images (images & sprites)
styleguide (auto-generated styleguide html)
|- public (auto-generated assets)
|- template (styleguide template files)
I can successfully generate a styleguide by executing the following command line instruction:
kss-node sass styleguide --css css/styles.css --template styleguide/template
So sass
is my source folder to parse, styleguide
is the destination folder and the --css
and --template
options tell the compiler where to find my main css file and template respectively. During the process the contents of the css/styles.css
file is copied over to styleguide/public/style.css
which is then referenced by the styleguide. This is all great.
However, the css file that is generated and referenced by the styleguide now sits in a different folder structure from the original css file (it is two deep from the root instead of one) and therefore any references to the images
folder are now invalid. Is there a way to resolve this without placing my original css files in another folder in the css
directory to mimic the styleguide folder structure (which would be a massive hack)?
Also, any other references to images in the normal html markup (derived from the scss comments) will have to be adapted to reference the adjusted folder structure, and therefore is not indicative of a real life implementation of my code. Is there a way to resolve this too?
Thanks
I know it's not a solution per se, but what I ended up doing was a Grunt task to copy my images (even the generated by Compass) to the public
folder of the generated styleguide after the KSS parsing (also done with Grunt).