Giter VIP home page Giter VIP logo

svgmini's Introduction

SVGMini Build Status Travis Build status npm version vscode marketplace extension

Extension

Get it from the VS Code Marketplace โ†’

Run SVGMini: Minify SVGs in Current File from the command palette.


Explainer

Config

svgmini.replaceFill

When set SVGMini will replace all fill attributes in SVGs with currentColor. Defaults to false.

"svgmini.replaceFill": true


CLI

Install

Install via npm

yarn global add svgmini

or

npm install -g svgmini

or

Install from a github release:

curl -LSfs https://avencera.github.io/svgmini/install.sh | sh -s -- --git avencera/svgmini

or

Download a release directly from github: github.com/avencera/svgmini/releases

Run

Run on a file svgmini path/to_repo/index.html

Config

--replace-fill

When set SVGMini will replace all fill attributes in SVGs with currentColor. Defaults to false.

svgmini path/to_repo/index.html --replace-fill


What?

A tool to minify SVGs that are contained in other documents (for example HTML or JSX files).

Why?

Lots of tools and plugins exist to minify SVGs for example:

However none of them did what I wanted, which was to minify SVGs within my HTML files.

svgmini's People

Contributors

dependabot[bot] avatar praveenperera avatar

Stargazers

 avatar  avatar

Watchers

 avatar  avatar  avatar

Forkers

dhc02

svgmini's Issues

Conflict with CurrentColor/Fill Property

This works if you are using Icons, but for Illustrations or shapes this not works, because this extension change the "fill" property. if there was a way to avoid touching the color (fills) on HTML. This can be a great useful Extension.

If "svgmini.replaceFill": true, all SVG (shapes, backgrounds, strokes) are obtain the same color (e. CurrentColor = black from color font)
If "svgmini.replaceFill": false, all SVG (shapes, backgrounds, strokes) are obtain the same color from the first svg from HTML.

If this extension just minify inline svg without touch something else can be an useful tool for pages (HMTL) with complex svg images.

Doesn't minify SVGs in HTML

It doesn't minify the SVGs in the HTML file after executing it from the command palette.

My VSC version:
Version: 1.46.1 (user setup)
Commit: cd9ea6488829f560dc949a8b2fb789f3cdc05f5d
Date: 2020-06-17T21:13:20.174Z
Electron: 7.3.1
Chrome: 78.0.3904.130
Node.js: 12.8.1
V8: 7.8.279.23-electron.0
OS: Windows_NT x64 10.0.16299

The plugin version: 0.2.1

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.