ferdinandtorggler/extract-svg-styles

Extract SVG element's <style> tags to files.

extract-svg-styles's Issues

does not extract styles from inline attributes

Tools like Inkscape generate inline styles as attributes on nodes.
I wanted to use extract-svg-styles to generate two files: svg with the shape of an icon, and css with colours etc. The goal was to be able to dynamically change color of icon on state change (for example :hover could be red, disabled grey etc.).
However currently styles from attributes are not extracted.
Attached is an example of icon I have troubles with.
similar_question.zip

usage example contains fancy apostrophes so it won't compile

The part:

var extractSvg = require(‘extract-svg-styles’);
extractSvg.extract(options);

fails.

Error: ReferenceError: primordials is not defined

ReferenceError: primordials is not defined
index.js

var extractSvg = require('extract-svg-styles');

extractSvg.extract({
    src: './test/*.svg',
    out: {
        style: './test/dest/css',
        svg: './test/dest/svg'
    },
    classPrefix: 's-'
});

➜ POC git:(feature/initial-testing) ✗ node index.js

fs.js:47
} = primordials;
    ^

ReferenceError: primordials is not defined
    at fs.js:47:5
    at req_ (/Users/sylwestermielniczuk/Documents/works/diorama-sylwester/demos/html-svg/pocs/0111/POC/node_modules/natives/index.js:143:24)
    at Object.req [as require] (/Users/sylwestermielniczuk/Documents/works/diorama-sylwester/demos/html-svg/pocs/0111/POC/node_modules/natives/index.js:55:10)
    at Object.<anonymous> (/Users/sylwestermielniczuk/Documents/works/diorama-sylwester/demos/html-svg/pocs/0111/POC/node_modules/graceful-fs/fs.js:1:37)
    at Module._compile (node:internal/modules/cjs/loader:1126:14)
    at Object.Module._extensions..js (node:internal/modules/cjs/loader:1180:10)
    at Module.load (node:internal/modules/cjs/loader:1004:32)
    at Function.Module._load (node:internal/modules/cjs/loader:839:12)
    at Module.require (node:internal/modules/cjs/loader:1028:19)
    at require (node:internal/modules/cjs/helpers:102:18)
➜  POC git:(feature/initial-testing) ✗ 

tests fail for logo-gradient-illycs6.svg

When I run node ./test/test.js I get

C:\Users\qbolec\Documents\GitHub\extract-svg-styles\extract-svg-styles\node_modules\css\lib\parse\index.js:72
      throw err;
            ^
Error: undefined:7:1: missing '{'
    at error (C:\Users\qbolec\Documents\GitHub\extract-svg-styles\extract-svg-styles\node_modules\css\lib\parse\index.js:62:15)
    at declarations (C:\Users\qbolec\Documents\GitHub\extract-svg-styles\extract-svg-styles\node_modules\css\lib\parse\index.js:247:25)
    at rule (C:\Users\qbolec\Documents\GitHub\extract-svg-styles\extract-svg-styles\node_modules\css\lib\parse\index.js:560:21)
    at rules (C:\Users\qbolec\Documents\GitHub\extract-svg-styles\extract-svg-styles\node_modules\css\lib\parse\index.js:117:70)
    at stylesheet (C:\Users\qbolec\Documents\GitHub\extract-svg-styles\extract-svg-styles\node_modules\css\lib\parse\index.js:81:21)
    at Object.module.exports [as parse] (C:\Users\qbolec\Documents\GitHub\extract-svg-styles\extract-svg-styles\node_modules\css\lib\parse\index.js:564:20)
    at nestCSS (C:\Users\qbolec\Documents\GitHub\extract-svg-styles\extract-svg-styles\index.js:67:22)
    at DestroyableTransform.extractStyles [as _transform] (C:\Users\qbolec\Documents\GitHub\extract-svg-styles\extract-svg-styles\index.js:156:21)
    at DestroyableTransform.Transform._read (C:\Users\qbolec\Documents\GitHub\extract-svg-styles\extract-svg-styles\node_modules\through2\node_modules\readable-stream\lib\_stream_transform.
js:184:10)
    at DestroyableTransform.Transform._write (C:\Users\qbolec\Documents\GitHub\extract-svg-styles\extract-svg-styles\node_modules\through2\node_modules\readable-stream\lib\_stream_transform
.js:172:12)
npm ERR! Test failed.  See above for more details.