Skip to content
A Plugin for SVG assets to convert IDs to Classes, create BEM Naming Based on Layes and using SVGO to compresse and Clean up SVGs, right when you export them. This Plugin *requires* Sketch 3.8. Its based on the original Svgo Compressor from BohemianCoding (https://github.com/BohemianCoding/svgo-compressor)
Branch: master
Clone or download
Latest commit b45e0fd Jun 24, 2019
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
SVG BEM.sketchplugin/Contents update Jun 24, 2019
assets update Jun 24, 2019
doc/img updade images Jun 11, 2019
node_modules Update Dependency Jun 11, 2019
scripts
src update Jun 24, 2019
.appcast.xml update Jun 24, 2019
.gitignore Create .gitignore Jun 5, 2019
LICENSE.md inital comit Jun 5, 2019
README.md Update README.md Jun 12, 2019
SVG BEM.sketchplugin.zip
package-lock.json Publish 2.0.1 release 🚀 Jun 24, 2019
package.json Publish 2.0.1 release 🚀 Jun 24, 2019
svg bem logo.png LogoUpdate Jun 11, 2019
svg bem logo.svg LogoUpdate Jun 11, 2019
svg-bem.png LogoUpdate Jun 11, 2019
testIcon.sketch update Jun 24, 2019
testicon.svg Update Dependency Jun 11, 2019
webpack.skpm.config.js inital comit Jun 5, 2019

README.md

SVG BEM LOGO

SVG BEM

A Plugin for SVG export to convert IDs to Classes, create BEM Naming based on the layes of the artboard. Furthermore it uses SVGO to compress and Clean up SVGs, right when you export them. This Plugin requires Sketch 52. The Plugin bases on the original Svgo Compressor from Bohemian Coding.

一个用于SVG导出的插件,是用于将ID转换为Class,是基于Sketch板层创建BEM命名的。此外,当你输出它们是,它用于SVGO的压缩和清理SVG。

Usage

The SVG BEM extends the standard Sketch SVG Export and compress your SVG assets whenever you export them. You have to do anything.

每当您导出SVG BEM时,SVG BEM都会扩展标准的Sketch SVG导出和压缩SVG资产。 你必须做任何事情

SVG Example

Specific IDs or Classes Names

If you need a specific ID or Class yust use the # or . as prefix in ur Sketch layers.

如果您需要特定ID或Class,请使用 . 作为草图图层中的前缀。

Plugin Seetings

If you’re not happy with the default settings of SVG BEM, you can select Plugins › SVG BEM › Setting and change your defaults based on your needs.

  • ID To Class Conversion: Turn On or OFF the SVG IDs to Classes conversion. 将SVG ID打开或关闭为Class转换
  • #*?&@ Replacement: Specified separator to replace special character. 用指定的分隔符替换所有特殊字符。
  • Names to BEM Sty Conversion: Turn On or OFF the conversion to BEM style. 打开或关闭转换为BEM样式。
  • BEM Seperator: Specified separator for the BEM style.BEM样式的指定分隔符

Plugin View

Install

  • Download SVG BEM & unzip it.
  • Double click SVG BEM.sketchplugin to install the Plugin.

SVGO Plugins Settings

For more information go to svgo-compressor from BohemianCoding.

You can’t perform that action at this time.