\begin{quote}
Optimise inline SVG with Post\+CSS. \end{quote}
\hypertarget{md_sfcode_node_modules_postcss_svgo_README_autotoc_md22213}{}\doxysection{Install}\label{md_sfcode_node_modules_postcss_svgo_README_autotoc_md22213}
With \href{https://npmjs.org/package/postcss-svgo}{\texttt{ npm}} do\+:


\begin{DoxyCode}{0}
\DoxyCodeLine{npm install postcss-\/svgo -\/-\/save }

\end{DoxyCode}
\hypertarget{md_sfcode_node_modules_postcss_svgo_README_autotoc_md22214}{}\doxysection{Example}\label{md_sfcode_node_modules_postcss_svgo_README_autotoc_md22214}
\hypertarget{md_sfcode_node_modules_postcss_svgo_README_autotoc_md22215}{}\doxysubsection{Input}\label{md_sfcode_node_modules_postcss_svgo_README_autotoc_md22215}

\begin{DoxyCode}{0}
\DoxyCodeLine{h1 \{}
\DoxyCodeLine{    background: url('data:image/svg+xml;charset=utf-\/8,<?xml version="{}1.0"{} encoding="{}utf-\/8"{}?><!DOCTYPE svg PUBLIC "{}-\///W3C//DTD SVG 1.1//EN"{} "{}http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"{}><svg version="{}1.1"{} id="{}Layer\_1"{} xmlns="{}http://www.w3.org/2000/svg"{} xmlns:xlink="{}http://www.w3.org/1999/xlink"{} xml:space="{}preserve"{}><circle cx="{}50"{} cy="{}50"{} r="{}40"{} fill="{}yellow"{} /></svg>');}
\DoxyCodeLine{\}}
\DoxyCodeLine{}
\DoxyCodeLine{h2 \{}
\DoxyCodeLine{    background: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz48IURPQ1RZUEUgc3ZnIFBVQkxJQyAiLS8vVzNDLy9EVEQgU1ZHIDEuMS8vRU4iICJodHRwOi8vd3d3LnczLm9yZy9HcmFwaGljcy9TVkcvMS4xL0RURC9zdmcxMS5kdGQiPjxzdmcgdmVyc2lvbj0iMS4xIiBpZD0iTGF5ZXJfMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+PGNpcmNsZSBjeD0iNTAiIGN5PSI1MCIgcj0iNDAiIGZpbGw9InllbGxvdyIgLz48IS0tdGVzdCBjb21tZW50LS0+PC9zdmc+');}
\DoxyCodeLine{\} }

\end{DoxyCode}
\hypertarget{md_sfcode_node_modules_postcss_svgo_README_autotoc_md22216}{}\doxysubsection{Output}\label{md_sfcode_node_modules_postcss_svgo_README_autotoc_md22216}

\begin{DoxyCode}{0}
\DoxyCodeLine{h1 \{}
\DoxyCodeLine{    background: url('data:image/svg+xml;charset=utf-\/8,<svg xmlns="{}http://www.w3.org/2000/svg"{}><circle cx="{}50"{} cy="{}50"{} r="{}40"{} fill="{}\%23ff0"{}/></svg>');}
\DoxyCodeLine{\}}
\DoxyCodeLine{}
\DoxyCodeLine{h2 \{}
\DoxyCodeLine{    background: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjxjaXJjbGUgY3g9IjUwIiBjeT0iNTAiIHI9IjQwIiBmaWxsPSIjZmYwIi8+PC9zdmc+');}
\DoxyCodeLine{\} }

\end{DoxyCode}
\hypertarget{md_sfcode_node_modules_postcss_svgo_README_autotoc_md22217}{}\doxysection{API}\label{md_sfcode_node_modules_postcss_svgo_README_autotoc_md22217}
\hypertarget{md_sfcode_node_modules_postcss_svgo_README_autotoc_md22218}{}\doxysubsection{$<$tt$>$svgo(\mbox{[}options\mbox{]})$<$/tt$>$}\label{md_sfcode_node_modules_postcss_svgo_README_autotoc_md22218}
Note that postcss-\/svgo is an {\itshape asynchronous} processor. It cannot be used like this\+:


\begin{DoxyCode}{0}
\DoxyCodeLine{var result = postcss([ svgo() ]).process(css).css;}
\DoxyCodeLine{console.log(result); }

\end{DoxyCode}


Instead make sure your Post\+CSS runner uses the asynchronous API\+:


\begin{DoxyCode}{0}
\DoxyCodeLine{postcss([ svgo() ]).process(css).then(function (result) \{}
\DoxyCodeLine{    console.log(result.css);}
\DoxyCodeLine{\}); }

\end{DoxyCode}
\hypertarget{md_sfcode_node_modules_postcss_svgo_README_autotoc_md22219}{}\doxysubsubsection{options}\label{md_sfcode_node_modules_postcss_svgo_README_autotoc_md22219}
\hypertarget{md_sfcode_node_modules_postcss_svgo_README_autotoc_md22220}{}\doxyparagraph{encode}\label{md_sfcode_node_modules_postcss_svgo_README_autotoc_md22220}
Type\+: {\ttfamily boolean} Default\+: {\ttfamily undefined}

If {\ttfamily true}, it will encode URL-\/unsafe characters such as {\ttfamily $<$}, {\ttfamily $>$} and {\ttfamily \&}; {\ttfamily false} will decode these characters, and {\ttfamily undefined} will neither encode nor decode the original input. Note that regardless of this setting, {\ttfamily \#} will always be URL-\/encoded.\hypertarget{md_sfcode_node_modules_postcss_svgo_README_autotoc_md22221}{}\doxyparagraph{plugins}\label{md_sfcode_node_modules_postcss_svgo_README_autotoc_md22221}
Optionally, you can customise the output by specifying the {\ttfamily plugins} option. You will need to provide the config in comma separated objects, like the example below. Note that you can either disable the plugin by setting it to {\ttfamily false}, or pass different options to change the default behaviour.


\begin{DoxyCode}{0}
\DoxyCodeLine{var postcss = require('postcss');}
\DoxyCodeLine{var svgo = require('postcss-\/svgo');}
\DoxyCodeLine{}
\DoxyCodeLine{var opts = \{}
\DoxyCodeLine{    plugins: [\{}
\DoxyCodeLine{        removeDoctype: false}
\DoxyCodeLine{    \}, \{}
\DoxyCodeLine{        removeComments: false}
\DoxyCodeLine{    \}, \{}
\DoxyCodeLine{        cleanupNumericValues: \{}
\DoxyCodeLine{            floatPrecision: 2}
\DoxyCodeLine{        \}}
\DoxyCodeLine{    \}, \{}
\DoxyCodeLine{        convertColors: \{}
\DoxyCodeLine{            names2hex: false,}
\DoxyCodeLine{            rgb2hex: false}
\DoxyCodeLine{        \}}
\DoxyCodeLine{    \}]}
\DoxyCodeLine{\};}
\DoxyCodeLine{}
\DoxyCodeLine{postcss([ svgo(opts) ]).process(css).then(function (result) \{}
\DoxyCodeLine{    console.log(result.css)}
\DoxyCodeLine{\}); }

\end{DoxyCode}


You can view the \href{https://github.com/svg/svgo/tree/master/plugins}{\texttt{ full list of plugins here}}.\hypertarget{md_sfcode_node_modules_postcss_svgo_README_autotoc_md22222}{}\doxysection{Usage}\label{md_sfcode_node_modules_postcss_svgo_README_autotoc_md22222}
See the \href{https://github.com/postcss/postcss\#usage}{\texttt{ Post\+CSS documentation}} for examples for your environment.\hypertarget{md_sfcode_node_modules_postcss_svgo_README_autotoc_md22223}{}\doxysection{Contributors}\label{md_sfcode_node_modules_postcss_svgo_README_autotoc_md22223}
See \href{https://github.com/cssnano/cssnano/blob/master/CONTRIBUTORS.md}{\texttt{ CONTRIBUTORS.\+md}}.\hypertarget{md_sfcode_node_modules_postcss_svgo_README_autotoc_md22224}{}\doxysection{License}\label{md_sfcode_node_modules_postcss_svgo_README_autotoc_md22224}
MIT © \href{http://beneb.info}{\texttt{ Ben Briggs}} 