jaywcjlove / svgtofont

Read a set of SVG icons and ouput a TTF/EOT/WOFF/WOFF2/SVG font.
https://jaywcjlove.github.io/svgtofont
MIT License
520 stars 82 forks source link

Is there a way to use the object for SVG path in svgtofont? #174

Open wmixx opened 1 year ago

wmixx commented 1 year ago

Is there a way for SVG content to be in the form of objects instead of folders?

jaywcjlove commented 1 year ago

I do not understand what you mean. @wmixx

jaywcjlove commented 1 year ago

dictionary object ? @wmixx give me an example?

wmixx commented 1 year ago

Something like that.

const svgtofont = require('svgtofont');
const path = require('path');
var svgs = [{
    "svg":"<?xml version="1.0" encoding="UTF-8"?><svg width="24" height="24" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg"><circle cx="24" cy="24" r="20" stroke="#333" stroke-width="4" stroke-linecap="round" stroke-linejoin="round"/><path fill-rule="evenodd" clip-rule="evenodd" d="M24 37V44V37Z" fill="none"/><path d="M24 37V44" stroke="#333" stroke-width="4" stroke-linecap="round" stroke-linejoin="round"/><path fill-rule="evenodd" clip-rule="evenodd" d="M36 24H44H36Z" fill="none"/><path d="M36 24H44" stroke="#333" stroke-width="4" stroke-linecap="round" stroke-linejoin="round"/><path fill-rule="evenodd" clip-rule="evenodd" d="M4 24H11H4Z" fill="none"/><path d="M4 24H11" stroke="#333" stroke-width="4" stroke-linecap="round" stroke-linejoin="round"/><path fill-rule="evenodd" clip-rule="evenodd" d="M24 11V4V11Z" fill="none"/><path d="M24 11V4" stroke="#333" stroke-width="4" stroke-linecap="round" stroke-linejoin="round"/></svg>"
},{
    "svg": "<?xml version="1.0" encoding="UTF-8"?><svg width="24" height="24" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M10 6C10 4.89543 10.8954 4 12 4H36C37.1046 4 38 4.89543 38 6V44L31 39L24 44L17 39L10 44V6Z" fill="none" stroke="#333" stroke-width="4" stroke-linecap="round" stroke-linejoin="round"/><path d="M18 22L30 22" stroke="#333" stroke-width="4" stroke-linecap="round" stroke-linejoin="round"/><path d="M18 30L30 30" stroke="#333" stroke-width="4" stroke-linecap="round" stroke-linejoin="round"/><path d="M18 14L30 14" stroke="#333" stroke-width="4" stroke-linecap="round" stroke-linejoin="round"/></svg>"
}]
svgtofont({
  // src: path.resolve(process.cwd(), 'icon'), // svg path
  src: svgs
  dist: path.resolve(process.cwd(), 'fonts'), // output path
  fontName: 'svgtofont', // font name
  css: true, // Create CSS files.
}).then(() => {
  console.log('done!');
});
schmidt-oliver commented 1 year ago

There is no direct way to achieve this. It looks like you have to write the SVGs in a temporary folder.