# nanosvg > SVG files compression tool for Nano. More information in [Nano](https://vecta.io/nano) Latest version **1.6.7** (published 2022-08-16) · 0 weekly downloads > **Deprecated.** This package is deprecated. ## Install ```sh npm install nanosvg pnpm add nanosvg yarn add nanosvg bun add nanosvg ``` Provides the command `nanosvg`. ## Health **Score 10/100 (F)** — status: deprecated. Negative: deprecated. ## Facts | | | |---|---| | Version | 1.6.7 | | Published | 2022-08-16 | | First published | 2019-05-02 | | Weekly downloads | 0 | | TypeScript types | none | | Module format | CommonJS | | Dependencies | 13 | | Unpacked size | 513.7 KB | | Known vulnerabilities | 0 (+1 in 1 direct dependencies) | | Install scripts | no | | Author | Thomas Yip | | Maintainers | yan.radica, weiluo.radica, fahmi.radica, neel.radica, yiqian.radica, tom.radica | | Keywords | svg, dxf, parser, compress, minify, optimize | ## Links - npm: https://www.npmjs.com/package/nanosvg - Homepage: https://vecta.io/nano - Issues: https://vecta.io/nano - npm.io page: https://npm.io/package/nanosvg ## Dependencies (13) - [he](https://npm.io/package/he.md) ^1.2.0 - [css](https://npm.io/package/css.md) ^2.2.4 - [pako](https://npm.io/package/pako.md) ^1.0.10 - [request](https://npm.io/package/request.md) ^2.88.0 - [css-what](https://npm.io/package/css-what.md) ^3.2.1 - [fs-extra](https://npm.io/package/fs-extra.md) ^8.1.0 - [minimist](https://npm.io/package/minimist.md) ^1.2.5 - [env-paths](https://npm.io/package/env-paths.md) ^2.2.0 - [is-online](https://npm.io/package/is-online.md) ^8.4.0 - [htmlparser2](https://npm.io/package/htmlparser2.md) ^4.0.0 - [glob-promise](https://npm.io/package/glob-promise.md) ^3.4.0 - [fonteditor-core](https://npm.io/package/fonteditor-core.md) ^2.0.3 - [node-machine-id](https://npm.io/package/node-machine-id.md) ^1.1.12 ## Alternatives - [babylon](https://npm.io/package/babylon.md) — 5.1M weekly downloads - [csscolorparser](https://npm.io/package/csscolorparser.md) — 3.7M weekly downloads - [expr-eval-fork](https://npm.io/package/expr-eval-fork.md) — 1.5M weekly downloads - [@leeoniya/ufuzzy](https://npm.io/package/@leeoniya/ufuzzy.md) — 247.7K weekly downloads - [xml-parser](https://npm.io/package/xml-parser.md) — 78.4K weekly downloads ## Recent versions - 1.6.7 (latest) — 2022-08-16 - 1.6.6 — 2022-08-16 - 1.6.5 — 2022-04-29 - 1.6.4 — 2022-04-26 - 1.6.3 — 2022-04-20 - 1.6.2 — 2021-12-24 - 1.6.1 — 2021-12-22 - 1.6.0 — 2021-11-11 - 1.5.9 — 2021-11-08 - 1.5.8 — 2021-10-27 - 1.5.7 — 2021-09-24 - 1.5.6 — 2021-05-28 - 1.5.5 — 2021-04-22 - 1.5.4 — 2021-01-25 - 1.5.3 — 2021-01-19 - … 60 more at https://npm.io/package/nanosvg/versions ## README ![Nano](https://vecta.io/nano/images/nano-logo-text.svg) NanoSVG uses lossless techniques to compress your SVG and save up to 80% bandwidth. * Compress 22% better than the competition, resulting in smaller SVG images * Selectively embed fonts to ensure your SVG images works everywhere without loss of fonts irrespective of how you embed them. * Cleans out malicious codes and scripts _This package requires a paid license from Nano_ For free usage, visit [Nano](https://vecta.io/nano?src=npm). ###This package will be deprecated on July 2023 Radica Software, the development team behind Vecta.io, has decided that our Nano Pro offering will reach end-of-life on July 24, 2023. After this date, maintenance, enhancements, and support for this product will cease. ## Installation `npm install -g nanosvg` ## Usages Nanosvg can be used on the command line (CLI), or as a module in any node.js compatible build system. ## Usages on CLI ### Activation `nanosvg --activate=YOUR_SERIAL_KEY` ### Command line syntax `nanosvg src_glob dest_folder [--options=value]+` ### Examples ``` //Compress a single file and output to folder with default options nanosvg "./test.svg" "./compressed" //Compress all svg files and output to folder with default options nanosvg "./images/*.svg" "./compressed" //Compress all dxf files and output to folder with default options nanosvg "./images/*.dxf" "./compressed" //Compress all svg files and output to folder //with no font embedding and precision = 4 nanosvg "./images/*.svg" "./compressed" --fonts=false --precision=4 //Compress all svg files using config file //Prepare config.json file before compressing //config.json content { "fonts": false, "attrs": [ "my_attr", "other_attr" ] } //Compress with --config option nanosvg "./images/*.svg" "./compressed" --config config.json ``` ## Usage as a module ```javascript var nanofy = require('nanosvg'); //Compress a single file and output to folder with default options nanofy('./test.svg', './compressed').then(function () { console.log('Completed'); }); //Compress all svg files and output to folder with default options nanofy('./images/*.svg', './compressed').then(function () { console.log('Completed'); }); //Compress all svg files and output to folder //with no font embedding and precision = 4 nanofy('./images/*.svg', './compressed', { fonts: false, precision: 4 }).then(function () { console.log('Completed'); }); //Compress all svg files and preserve "my_attribute" attribute in //the SVG nanofy('./images/*.svg', './compressed', { attrs: [ 'my_attribute', 'other_attr' ] }).then(function () { console.log('Completed'); }); //Compress SVG from buffer _fs.readFile('./test.svg').then(function(buffer) { return nanofy(buffer, null, {silent: true}).then(function(compressed_buffer) { return _fs.writeFile('./nanofied.svg', compressed_buffer); }); }); //Gulp task to watch for SVG changes gulp.task('Watch SVG', function() { gulp.watch('watch/this/folder/*.svg') .on('change', function(file) { nanofy(file, './destination/folder'); }); }); ``` ## Options * `precision=3 ` Set the number of decimal places to compress for numerical values, defaults to 3. Applies only to values with decimal places larger than precision. ```html ``` * `fonts=true ` Enable the embedding of fonts, defaults to true. If enabled, will embed fonts into the SVG, if text and fonts are detected. Fonts must be available on [Google fonts](https://fonts.google.com/). * `classes=false` Do not modify your classes in the SVG, defaults to false. ```html ``` * `ids=false` Do not modify your id(s) in the SVG, defaults to false. ```html ``` * `structure=false` Do not modify your structure in the SVG, defaults to false. Useful when used on `object` tags, when you want to maintain original structure for interactivity. * `events=false` Do not modify your events in the SVG, defaults to false. Useful when used on `object` tags, when you want to maintain these events for interactivity. * `wordpress=false` Export as WordPress-compatible SVG, defaults to false. * `react=false` Export as React SVG component in JSX file format, defaults to false. * `font_path=path-to-font-folder` Embed custom fonts. Supported format: ttf & woff Example: 1. MyFont.ttf is placed in a folder "myfonts" 2. nanosvg src_glob dest_folder --local_fonts=myfonts 3. SVG as below ```html Embed this font ``` * `config=path-to-config` Compress with configuration file. The configuration file can contain all of the options. ``` { "font_path": "path-to-font-folder", "structure": true, "attrs": [ "my_attr", "other_attr" ] } ``` * `gzip=false` Compress with gzip, defaults to false. * `br=11 ` Configure brotli compression quality, defaults to 11. Compression quality level ranged from 0-11. Got any question? Shoot us an email at [support@vecta.io](mailto:support@vecta.io) --- _Source: https://npm.io/package/nanosvg · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._