Security News
The Unpaid Backbone of Open Source: Solo Maintainers Face Increasing Security Demands
Solo open source maintainers face burnout and security challenges, with 60% unpaid and 60% considering quitting.
A simple library for inserting inline SVG into DOM. Comes with the builder!
Include browser/svgasset.svg
somewhere in the page. svgAsset
function appears in the global scope.
Calling svgAsset()
return a SVG DOM element that can be used in any way you want.
The signature is SVGAsset(/* str */ assetName, /* optional object or str */ attrs)
.
assetName
is a name of the SVG asset;
attrs
(optional) is a dictionary of attributes to set to element.
If it's a string in format "width x height", it's the same as providing {"width": ..., "height": ...}
.
But first you have to declare the assets themselves.
It is done with svgAsset.register(/* object */ assets)
assets
is a dictionary. Keys are asset names and values are corresponding HTML (SVG) strings.Sure, creating and maintaining assets dictionary by hands is close to impossible. But you don't need to do it manually, there's a builder for that.
Builder can be used in Node.js as a module. The require
result is a function with following signature:
require('svgasset')(/* array of str */ filenames, /* optional object */ options)
filenames
are filenames of SVG files to be included into dictionary. No magic wildcards are used here.
Relative filenames will be resolved from currect directory (process.cwd()
, not __dirname
!).
options.writeBefore
(optional) is a string or Buffer to be written before the dictionary.
options.writeAfter
(optional) is similar to writeBefore
.
Function returns ReadableStream
that can be piped to any file descriptor or stdout/stderr.
In addition to all Stream
interface there's some events emitted:
error
when something bad is happened. All errors are recoverable and even if you have zillion of errors,
output stream still would contain valid javascript (if errors were handled and didn't abort Node process).
progress
reports filename being processed now. Useful for CLI application.
If installed globally, this module can be called via command line interface.
svgasset-build [-o <output filename>] [-v] <filename> [, <filename>, ...]
-o
or --output
defines where output dictionary would be placed. Default is stdout
.
-v
or --verbose
tells application to report what file is being processed right now.
Reports end errors are written to stderr
, not touching the stdout
.
filenames
are filenames. Detailed expaination is below.
First of all, relative filenames are resolved from current directory.
Wildcards are supported (glob
node module is used). So, svgasset-build my-app/images/**/*.svg
is a perfectly valid input.
If a filename specified starts with @
, it is considered to be a list: a text file containing filenames one per line.
Anything between #
and the end of the line is a comment.
List file even can inlude other list files, start them with @
char. Wildcards are also supported.
Relative filenames in list files are resolved form the directory where list file is (like in CSS includes).
I want to build all the SVGs in current directory and anything listed in prod-svgs.txt
in the parent dir, and place output into svgs.js
.
svgasset-build *.svg @../prod-svgs.txt -o svgs.js
I want to do the same keeping my command line as simple as possible.
svgasset-build @prod.txt -o svgs.js
# prod.txt
# Include all the SVGs
*.svg
# Include another file
@../prod-svgs.txt
I want to process file in current directory, its name starts with @
, but it's not the list.
svgasset-build ./@icon.svg -o svgs.js
If you dont want to install svgasset-build
globally, it can be called directly:
node <path-to-module>/bin/cli
FAQs
Client side inline SVG library and backend building tool
The npm package svgasset receives a total of 16 weekly downloads. As such, svgasset popularity was classified as not popular.
We found that svgasset demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 1 open source maintainer collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
Solo open source maintainers face burnout and security challenges, with 60% unpaid and 60% considering quitting.
Security News
License exceptions modify the terms of open source licenses, impacting how software can be used, modified, and distributed. Developers should be aware of the legal implications of these exceptions.
Security News
A developer is accusing Tencent of violating the GPL by modifying a Python utility and changing its license to BSD, highlighting the importance of copyleft compliance.